diff --git a/wondrous-bot-admin/src/graphql/mutations/org.ts b/wondrous-bot-admin/src/graphql/mutations/org.ts index 650565c8f..241b8b981 100644 --- a/wondrous-bot-admin/src/graphql/mutations/org.ts +++ b/wondrous-bot-admin/src/graphql/mutations/org.ts @@ -1,5 +1,6 @@ import { gql } from "@apollo/client"; import { OrgFragment } from "graphql/fragments/org"; +import { CmtyUserFragment } from "graphql/fragments"; export const UPDATE_ORG = gql` mutation updateOrg($orgId: ID!, $input: OrgInput) { @@ -75,6 +76,15 @@ export const RESET_ORG_CMTY_USER_POINTS = gql` } `; +export const ADD_CMTY_USER_TO_ORG = gql` + mutation addCmtyUserToOrg($orgId: ID!, $discordUsername: String, $points: Int) { + addCmtyUserToOrg(orgId: $orgId, discordUsername: $discordUsername, points: $points) { + ...CmtyUserFragment + } + } + ${CmtyUserFragment} +`; + export const UPDATE_ORG_MODULES = gql` mutation updateOrgModules($orgId: ID!, $input: ModulesInput) { updateOrgModules(orgId: $orgId, input: $input) { diff --git a/wondrous-bot-admin/src/pages/quests/members/MemberAddModal.tsx b/wondrous-bot-admin/src/pages/quests/members/MemberAddModal.tsx new file mode 100644 index 000000000..9489a62ef --- /dev/null +++ b/wondrous-bot-admin/src/pages/quests/members/MemberAddModal.tsx @@ -0,0 +1,145 @@ +import { Box, Grid, Typography } from "@mui/material"; +import { useContext, useState } from "react"; +import { Label } from "components/CreateTemplate/styles"; +import { SharedSecondaryButton } from "components/Shared/styles"; +import Modal from "components/Shared/Modal"; +import { useMutation } from "@apollo/client"; +import useAlerts from "utils/hooks"; +import TextField from "components/Shared/TextField"; +import GlobalContext from "utils/context/GlobalContext"; +import { redColors } from "utils/theme/colors"; +import { ADD_CMTY_USER_TO_ORG } from "graphql/mutations"; + +const MemberAddBody = ({ onClose }) => { + const { setSnackbarAlertOpen, setSnackbarAlertMessage, setSnackbarAlertAnchorOrigin, setSnackbarAlertSeverity } = useAlerts(); + const [addCmtyUserToOrg] = useMutation(ADD_CMTY_USER_TO_ORG, { + onCompleted: () => { + setSnackbarAlertOpen(true); + setSnackbarAlertMessage("Success!"); + setSnackbarAlertAnchorOrigin({ + vertical: "top", + horizontal: "center", + }); + onClose(); + }, + onError: (error) => { + setError('Could not find the Discord user in the server'); + }, + refetchQueries: ["getCmtyUsersForOrg", "searchCmtyUsersForOrg"], + }); + const { activeOrg } = useContext(GlobalContext); + const [discordUsername, setDiscordUsername] = useState(""); + const [points, setPoints] = useState(""); + const [error, setError] = useState(""); + + return ( + + + + + { + setDiscordUsername(value); + }} + multiline={false} + // style={TextInputStyle} + /> + + { + setPoints(value); + }} + multiline={false} + // style={TextInputStyle} + /> + + {error && ( + + {error} + + )} + + + + Cancel + + { + setError(""); + if (!discordUsername) { + setError("Discord Username is required"); + return; + } + if (points) { + const integerPoints = parseInt(points); + if (!integerPoints || integerPoints < 0) { + setError("Points must be a positive integer"); + return; + } + } + addCmtyUserToOrg({ + variables: { + orgId: activeOrg?.id, + discordUsername, + points: parseInt(points), + }, + }); + + }} + > + Add Member + + + + ); +}; +const MemberAddModal = ({ openMemberAddModal, setOpenMemberAddModal }) => { + return ( + <> + setOpenMemberAddModal(false)} + title={"Add discord user to community"} + > + setOpenMemberAddModal(false)} /> + + + ); +}; + +export default MemberAddModal; diff --git a/wondrous-bot-admin/src/pages/quests/members/index.tsx b/wondrous-bot-admin/src/pages/quests/members/index.tsx index 7ae735dfa..dda260dc2 100644 --- a/wondrous-bot-admin/src/pages/quests/members/index.tsx +++ b/wondrous-bot-admin/src/pages/quests/members/index.tsx @@ -13,6 +13,7 @@ import { EMPTY_STATE_TYPES, LIMIT } from "utils/constants"; import GlobalContext from "utils/context/GlobalContext"; import { MemberPageSearchBar } from "./MemberSearchBar"; import ResetPointsModal from "./ResetPointsModal"; +import MemberAddModal from "./MemberAddModal"; import MembersTutorial from "components/TutorialComponent/Tutorials/MembersTutorial"; import { transformUser } from "utils/transformCmtyUserToMembers"; import { FilterPill } from "components/ViewQuestResults/styles"; @@ -26,6 +27,7 @@ const MembersPage = () => { const [memberSearch, setMemberSearch] = useState(null); const [resetPointsBalance, setResetPointsBalance] = useState(null); const [openResetPointsModal, setOpenResetPointsModal] = useState(false); + const [openMemberAddModal, setOpenMemberAddModal] = useState(null); const [openExportModal, setOpenExportModal] = useState(false); const [memberInfo, setMemberInfo] = useState(null); const [getCmtyUsersForOrg, { data, fetchMore, refetch, loading }] = useLazyQuery(GET_COMMUNITY_USERS_FOR_ORG, { @@ -81,6 +83,12 @@ const MembersPage = () => { setOpenResetPointsModal={setOpenResetPointsModal} pointsBalance={resetPointsBalance} /> + + setOpenExportModal(false)} /> {data?.getCmtyUsersForOrg ? ( @@ -120,6 +128,7 @@ const MembersPage = () => { onClick={() => { setResetPointsBalance(false); setOpenResetPointsModal(true); + setOpenMemberAddModal(false); }} > Reset points @@ -128,10 +137,20 @@ const MembersPage = () => { onClick={() => { setResetPointsBalance(true); setOpenResetPointsModal(true); + setOpenMemberAddModal(false); }} > Reset point balances + { + setResetPointsBalance(false); + setOpenResetPointsModal(false); + setOpenMemberAddModal(true); + }} + > + Add User +