User tab working

src/ui/account/modals/AccountRaidGroupPermissionsModal.tsx

@@ -0,0 +1,88 @@
+import PrimaryButton from "@/components/button/PrimaryButton";
+import SecondaryButton from "@/components/button/SecondaryButton";
+import RaidBuilderModal from "@/components/modal/RaidBuilderModal";
+import RaidGroupPermissionSelector from "@/components/raidGroup/RaidGroupPermissionSelector";
+import { useGetRaidGroupPermissionsForAccount, useUpdateRaidGroupPermissionsForAccount } from "@/hooks/AccountHooks";
+import { Account } from "@/interface/Account";
+import { RaidGroup, RaidGroupPermissionType } from "@/interface/RaidGroup";
+import { useTimedModal } from "@/providers/TimedModalProvider";
+import { useEffect, useState } from "react";
+
+
+export default function AccountRaidGroupPermissionsModal({
+	display,
+	close,
+	account,
+	raidGroup
+}:{
+	display: boolean;
+	close: () => void;
+	account?: Account;
+	raidGroup?: RaidGroup;
+}){
+	const [ currentPermission, setCurrentPermission ] = useState<RaidGroupPermissionType>();
+
+
+	const raidGroupPermissionsQuery = useGetRaidGroupPermissionsForAccount(raidGroup?.raidGroupId, account?.accountId);
+	const raidGroupPermissionsMutate = useUpdateRaidGroupPermissionsForAccount(raidGroup?.raidGroupId, account?.accountId);
+	const { addSuccessMessage, addErrorMessage } = useTimedModal();
+
+	useEffect(() => {
+		if(raidGroupPermissionsQuery.status === "success"){
+			setCurrentPermission(raidGroupPermissionsQuery.data);
+		}
+		else if(raidGroupPermissionsQuery.status === "error"){
+			addErrorMessage(`Error getting raid group permissions: ${raidGroupPermissionsQuery.error.message}`);
+		}
+	}, [raidGroupPermissionsQuery.status, raidGroupPermissionsQuery.data, addSuccessMessage, addErrorMessage, raidGroupPermissionsQuery.error?.message]);
+
+	useEffect(() => {
+		if(raidGroupPermissionsMutate.status === "success"){
+			raidGroupPermissionsMutate.reset();
+			close();
+			addSuccessMessage("Permissions updated successfully");
+		}
+		else if(raidGroupPermissionsMutate.status === "error"){
+			raidGroupPermissionsMutate.reset();
+			addErrorMessage(`Error updating raid group permissions: ${raidGroupPermissionsMutate.error.message}`);
+		}
+	}, [ close, raidGroupPermissionsMutate, raidGroupPermissionsMutate.status, addErrorMessage, addSuccessMessage ]);
+
+
+	const updateRaidGroupPermissions = () => {
+		raidGroupPermissionsMutate.mutate(currentPermission ?? RaidGroupPermissionType.RAIDER);
+	}
+
+
+	return (
+		<RaidBuilderModal
+			display={display}
+			close={close}
+			modalHeader={`Raid Group Permissions for ${account?.username}`}
+			modalBody={
+				<div
+					className="flex flex-col items-center justify-center gap-4"
+				>
+					<RaidGroupPermissionSelector
+						value={currentPermission}
+						onChange={(e) => setCurrentPermission(e.target.value as RaidGroupPermissionType)}
+					/>
+				</div>
+			}
+			modalFooter={
+				<>
+					<PrimaryButton
+						onClick={updateRaidGroupPermissions}
+					>
+						Update
+					</PrimaryButton>
+						<SecondaryButton
+						onClick={close}
+					>
+						Cancel
+					</SecondaryButton>
+				</>
+			}
+		/>
+	);
+}