Raid Request button working

src/interface/GamePermission.ts

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

src/interface/RaidGroupPermission.ts

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

src/providers/AuthProvider.tsx

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

src/ui/calendar/RaidGroupHeader.tsx

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

src/ui/raidGroup/RaidGroupAdminButtons.tsx

@@ -1,22 +1,41 @@
 import { ButtonProps } from "@/components/button/Button";
 import DangerButton from "@/components/button/DangerButton";
 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({
 	buttonProps,
+	showRaidGroupRequestModal,
 	showEditRaidGroupModal,
-	showDeleteRaidGroupModal
+	showDeleteRaidGroupModal,
+	hasRaidGroupPermissions,
+	hasRaidGroupRequest
 }:{
 	buttonProps: ButtonProps;
+	showRaidGroupRequestModal?: () => void;
 	showEditRaidGroupModal: () => void;
 	showDeleteRaidGroupModal: () => void;
+	hasRaidGroupPermissions: boolean;
+	hasRaidGroupRequest: boolean;
 }){
 	return (
 		<div
 			className="flex flex-row items-center justify-center gap-2"
 		>
+			{
+				!hasRaidGroupPermissions &&
+				<TertiaryButton
+					{...buttonProps}
+					onClick={showRaidGroupRequestModal}
+					disabled={hasRaidGroupRequest}
+				>
+					<BsChatRightText
+						size={22}
+					/>
+				</TertiaryButton>
+			}
 			<PrimaryButton
 				{...buttonProps}
 				onClick={showEditRaidGroupModal}

src/ui/raidGroup/RaidGroupsList.tsx

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

src/util/PermissionUtil.ts

@@ -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;
+}