Raid Request button working

This commit is contained in:
2025-03-10 20:30:39 -04:00
parent 439e82b821
commit 5a2c8a8936
7 changed files with 101 additions and 5 deletions

View File

@@ -0,0 +1,11 @@
export enum GamePermissionType {
ADMIN = "ADMIN"
}
export interface GamePermission {
gamePermissionId?: string;
accountId: string;
gameId: string;
gamePermissionType: GamePermissionType;
}

View File

@@ -0,0 +1,9 @@
import { RaidGroupPermissionType } from "./RaidGroup";
export interface RaidGroupPermission {
raidGroupPermissionId?: string;
accountId: string;
raidGroupId: string;
permission: RaidGroupPermissionType;
}

View File

@@ -1,3 +1,6 @@
import { GamePermission } from "@/interface/GamePermission";
import { RaidGroupPermission } from "@/interface/RaidGroupPermission";
import { RaidGroupRequest } from "@/interface/RaidGroupRequest";
import { api } from "@/util/AxiosUtil"; import { api } from "@/util/AxiosUtil";
import { createContext, useCallback, useContext, useEffect, useLayoutEffect, useMemo, useState } from "react"; import { createContext, useCallback, useContext, useEffect, useLayoutEffect, useMemo, useState } from "react";
import { Navigate, Outlet } from "react-router"; import { Navigate, Outlet } from "react-router";
@@ -15,6 +18,9 @@ type AuthProviderState = {
expiration: Date | null; expiration: Date | null;
setExpiration: (expiration: Date | null) => void; setExpiration: (expiration: Date | null) => void;
accountId: string | null; accountId: string | null;
raidGroupPermissions: RaidGroupPermission[];
gamePermissions: GamePermission[];
raidGroupRequests: RaidGroupRequest[];
} }
const initialState: AuthProviderState = { const initialState: AuthProviderState = {
@@ -22,7 +28,10 @@ const initialState: AuthProviderState = {
setJwt: () => null, setJwt: () => null,
expiration: null, expiration: null,
setExpiration: () => null, setExpiration: () => null,
accountId: null accountId: null,
raidGroupPermissions: [],
gamePermissions: [],
raidGroupRequests: []
} }
const AuthContext = createContext<AuthProviderState>(initialState); const AuthContext = createContext<AuthProviderState>(initialState);
@@ -35,6 +44,9 @@ export function AuthProvider({
const [ expiration, setExpiration ] = useState<Date | null>(null); const [ expiration, setExpiration ] = useState<Date | null>(null);
const [ firstFetch, setFirstFetch ] = useState(true); const [ firstFetch, setFirstFetch ] = useState(true);
const [ accountId, setAccountId ] = useState<string | null>(null); const [ accountId, setAccountId ] = useState<string | null>(null);
const [ raidGroupPermissions, setRaidGroupPermissions ] = useState<RaidGroupPermission[]>([]);
const [ gamePermissions, setGamePermissions ] = useState<GamePermission[]>([]);
const [ raidGroupRequests, setRaidGroupRequests ] = useState<RaidGroupRequest[]>([]);
const fetchToken = useCallback(async () => { const fetchToken = useCallback(async () => {
@@ -50,6 +62,9 @@ export function AuthProvider({
setExpiration(new Date(decodedToken.exp * 1000)); setExpiration(new Date(decodedToken.exp * 1000));
setFirstFetch(false); setFirstFetch(false);
setAccountId(decodedToken.accountId); setAccountId(decodedToken.accountId);
setRaidGroupPermissions(JSON.parse(decodedToken.raidGroupPermissions));
setGamePermissions(JSON.parse(decodedToken.gamePermissions));
setRaidGroupRequests(JSON.parse(decodedToken.raidGroupRequests));
return response.data.token; return response.data.token;
} }
//If the token cannot be retrieved //If the token cannot be retrieved
@@ -98,8 +113,11 @@ export function AuthProvider({
setJwt, setJwt,
expiration, expiration,
setExpiration, setExpiration,
accountId accountId,
}), [ jwt, setJwt, expiration, setExpiration, accountId ]); raidGroupPermissions,
gamePermissions,
raidGroupRequests
}), [ jwt, setJwt, expiration, setExpiration, accountId, raidGroupPermissions, gamePermissions, raidGroupRequests ]);
//TODO: Return a spinner while the first token is being fetched //TODO: Return a spinner while the first token is being fetched

View File

@@ -42,6 +42,8 @@ export default function RaidGroupHeader({
buttonProps={buttonProps} buttonProps={buttonProps}
showEditRaidGroupModal={() => setDisplayEditRaidGroupModal(true)} showEditRaidGroupModal={() => setDisplayEditRaidGroupModal(true)}
showDeleteRaidGroupModal={() => setDisplayDeleteRaidGroupModal(true)} showDeleteRaidGroupModal={() => setDisplayDeleteRaidGroupModal(true)}
hasRaidGroupPermissions={true}
hasRaidGroupRequest={false}
/> />
</div> </div>
<RaidGroupModal <RaidGroupModal

View File

@@ -1,22 +1,41 @@
import { ButtonProps } from "@/components/button/Button"; import { ButtonProps } from "@/components/button/Button";
import DangerButton from "@/components/button/DangerButton"; import DangerButton from "@/components/button/DangerButton";
import PrimaryButton from "@/components/button/PrimaryButton"; import PrimaryButton from "@/components/button/PrimaryButton";
import { BsPencilFill, BsTrash3 } from "react-icons/bs"; import TertiaryButton from "@/components/button/TertiaryButton";
import { BsChatRightText, BsPencilFill, BsTrash3 } from "react-icons/bs";
export default function RaidGroupAdminButtons({ export default function RaidGroupAdminButtons({
buttonProps, buttonProps,
showRaidGroupRequestModal,
showEditRaidGroupModal, showEditRaidGroupModal,
showDeleteRaidGroupModal showDeleteRaidGroupModal,
hasRaidGroupPermissions,
hasRaidGroupRequest
}:{ }:{
buttonProps: ButtonProps; buttonProps: ButtonProps;
showRaidGroupRequestModal?: () => void;
showEditRaidGroupModal: () => void; showEditRaidGroupModal: () => void;
showDeleteRaidGroupModal: () => void; showDeleteRaidGroupModal: () => void;
hasRaidGroupPermissions: boolean;
hasRaidGroupRequest: boolean;
}){ }){
return ( return (
<div <div
className="flex flex-row items-center justify-center gap-2" className="flex flex-row items-center justify-center gap-2"
> >
{
!hasRaidGroupPermissions &&
<TertiaryButton
{...buttonProps}
onClick={showRaidGroupRequestModal}
disabled={hasRaidGroupRequest}
>
<BsChatRightText
size={22}
/>
</TertiaryButton>
}
<PrimaryButton <PrimaryButton
{...buttonProps} {...buttonProps}
onClick={showEditRaidGroupModal} onClick={showEditRaidGroupModal}

View File

@@ -1,8 +1,11 @@
import { ButtonProps } from "@/components/button/Button"; import { ButtonProps } from "@/components/button/Button";
import Table from "@/components/table/Table"; import Table from "@/components/table/Table";
import { RaidGroup } from "@/interface/RaidGroup"; import { RaidGroup } from "@/interface/RaidGroup";
import { useAuth } from "@/providers/AuthProvider";
import { containsRaidGroupPermission, containsRaidGroupRequest } from "@/util/PermissionUtil";
import { useState } from "react"; import { useState } from "react";
import { Link } from "react-router"; import { Link } from "react-router";
import RaidGroupRequestModal from "../raidGroupRequest/modal/RaidGroupRequestModal";
import DeleteRaidGroupModal from "./modals/DeleteRaidGroupModal"; import DeleteRaidGroupModal from "./modals/DeleteRaidGroupModal";
import RaidGroupModal from "./modals/RaidGroupModal"; import RaidGroupModal from "./modals/RaidGroupModal";
import RaidGroupAdminButtons from "./RaidGroupAdminButtons"; import RaidGroupAdminButtons from "./RaidGroupAdminButtons";
@@ -14,8 +17,10 @@ export default function RaidGroupsList({
raidGroups: RaidGroup[]; raidGroups: RaidGroup[];
}){ }){
const [ selectedRaidGroup, setSelectedRaidGroup ] = useState<RaidGroup>(); const [ selectedRaidGroup, setSelectedRaidGroup ] = useState<RaidGroup>();
const [ displayRaidGroupRequestModal, setDisplayRaidGroupRequestModal ] = useState(false);
const [ displayEditRaidGroupModal, setDisplayEditRaidGroupModal ] = useState(false); const [ displayEditRaidGroupModal, setDisplayEditRaidGroupModal ] = useState(false);
const [ displayDeleteRaidGroupModal, setDisplayDeleteRaidGroupModal ] = useState(false); const [ displayDeleteRaidGroupModal, setDisplayDeleteRaidGroupModal ] = useState(false);
const { raidGroupPermissions, raidGroupRequests } = useAuth();
const buttonProps: ButtonProps = { const buttonProps: ButtonProps = {
@@ -69,6 +74,10 @@ export default function RaidGroupsList({
</div> </div>
<RaidGroupAdminButtons <RaidGroupAdminButtons
buttonProps={buttonProps} buttonProps={buttonProps}
showRaidGroupRequestModal={() => {
setSelectedRaidGroup(raidGroup);
setDisplayRaidGroupRequestModal(true);
}}
showEditRaidGroupModal={() => { showEditRaidGroupModal={() => {
setSelectedRaidGroup(raidGroup); setSelectedRaidGroup(raidGroup);
setDisplayEditRaidGroupModal(true); setDisplayEditRaidGroupModal(true);
@@ -77,6 +86,8 @@ export default function RaidGroupsList({
setSelectedRaidGroup(raidGroup); setSelectedRaidGroup(raidGroup);
setDisplayDeleteRaidGroupModal(true); setDisplayDeleteRaidGroupModal(true);
}} }}
hasRaidGroupPermissions={containsRaidGroupPermission(raidGroup.raidGroupId ?? "", raidGroupPermissions)}
hasRaidGroupRequest={containsRaidGroupRequest(raidGroup.raidGroupId ?? "", raidGroupRequests)}
/> />
</div> </div>
]); ]);
@@ -88,6 +99,11 @@ export default function RaidGroupsList({
tableHeadElements={headElements} tableHeadElements={headElements}
tableBodyElements={bodyElements} tableBodyElements={bodyElements}
/> />
<RaidGroupRequestModal
display={displayRaidGroupRequestModal}
close={() => {setDisplayRaidGroupRequestModal(false); setSelectedRaidGroup(undefined);}}
raidGroupId={selectedRaidGroup?.raidGroupId ?? ""}
/>
<RaidGroupModal <RaidGroupModal
display={displayEditRaidGroupModal} display={displayEditRaidGroupModal}
close={() => {setDisplayEditRaidGroupModal(false); setSelectedRaidGroup(undefined);}} close={() => {setDisplayEditRaidGroupModal(false); setSelectedRaidGroup(undefined);}}

View File

@@ -0,0 +1,21 @@
import { RaidGroupPermission } from "@/interface/RaidGroupPermission";
import { RaidGroupRequest } from "@/interface/RaidGroupRequest";
export function containsRaidGroupPermission(raidGroupId: string, permissions: RaidGroupPermission[]): boolean{
for(const permission of permissions){
if(permission.raidGroupId === raidGroupId){
return true;
}
}
return false;
}
export function containsRaidGroupRequest(raidGroupId: string, requests: RaidGroupRequest[]){
for(const request of requests){
if(request.raidGroupId === raidGroupId){
return true;
}
}
return false;
}