Files
RaidBuilderWeb/src/ui/account/modals/AccountRaidGroupPermissionsModal.tsx
2026-01-07 14:06:46 -05:00

101 lines
3.3 KiB
TypeScript

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"){
//TODO: Fix this warning
// eslint-disable-next-line react-hooks/set-state-in-effect
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 = () => {
if(!raidGroup?.raidGroupId || !account?.accountId){
addErrorMessage("Error updating raid group permissions: Raid group and account are required");
return;
}
if(!currentPermission){
addErrorMessage("Error updating raid group permissions: Permission is required");
return;
}
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>
</>
}
/>
);
}