87 lines
2.4 KiB
TypeScript
87 lines
2.4 KiB
TypeScript
'use client';
|
|
|
|
import type { MembershipRole } from '@/lib/types/MembershipRole';
|
|
import { useParams } from 'next/navigation';
|
|
import { useMemo } from 'react';
|
|
import {
|
|
useLeagueJoinRequests,
|
|
useLeagueRosterAdmin,
|
|
useApproveJoinRequest,
|
|
useRejectJoinRequest,
|
|
useUpdateMemberRole,
|
|
useRemoveMember,
|
|
} from "@/lib/hooks/league/useLeagueRosterAdmin";
|
|
import { RosterAdminTemplate } from '@/templates/RosterAdminTemplate';
|
|
|
|
const ROLE_OPTIONS: MembershipRole[] = ['owner', 'admin', 'steward', 'member'];
|
|
|
|
export function RosterAdminPage() {
|
|
const params = useParams();
|
|
const leagueId = params.id as string;
|
|
|
|
// Fetch data using React-Query + DI
|
|
const {
|
|
data: joinRequests = [],
|
|
isLoading: loadingJoinRequests,
|
|
refetch: refetchJoinRequests,
|
|
} = useLeagueJoinRequests(leagueId);
|
|
|
|
const {
|
|
data: members = [],
|
|
isLoading: loadingMembers,
|
|
refetch: refetchMembers,
|
|
} = useLeagueRosterAdmin(leagueId);
|
|
|
|
const loading = loadingJoinRequests || loadingMembers;
|
|
|
|
// Mutations
|
|
const approveMutation = useApproveJoinRequest({
|
|
onSuccess: () => refetchJoinRequests(),
|
|
});
|
|
|
|
const rejectMutation = useRejectJoinRequest({
|
|
onSuccess: () => refetchJoinRequests(),
|
|
});
|
|
|
|
const updateRoleMutation = useUpdateMemberRole({
|
|
onError: () => refetchMembers(), // Refetch on error to restore state
|
|
});
|
|
|
|
const removeMemberMutation = useRemoveMember({
|
|
onSuccess: () => refetchMembers(),
|
|
});
|
|
|
|
const pendingCountLabel = useMemo(() => {
|
|
return joinRequests.length === 1 ? '1 request' : `${joinRequests.length} requests`;
|
|
}, [joinRequests.length]);
|
|
|
|
const handleApprove = async (requestId: string) => {
|
|
await approveMutation.mutateAsync({ leagueId, requestId });
|
|
};
|
|
|
|
const handleReject = async (requestId: string) => {
|
|
await rejectMutation.mutateAsync({ leagueId, requestId });
|
|
};
|
|
|
|
const handleRoleChange = async (driverId: string, newRole: MembershipRole) => {
|
|
await updateRoleMutation.mutateAsync({ leagueId, driverId, newRole });
|
|
};
|
|
|
|
const handleRemove = async (driverId: string) => {
|
|
await removeMemberMutation.mutateAsync({ leagueId, driverId });
|
|
};
|
|
|
|
return (
|
|
<RosterAdminTemplate
|
|
joinRequests={joinRequests}
|
|
members={members}
|
|
loading={loading}
|
|
pendingCountLabel={pendingCountLabel}
|
|
onApprove={handleApprove}
|
|
onReject={handleReject}
|
|
onRoleChange={handleRoleChange}
|
|
onRemove={handleRemove}
|
|
roleOptions={ROLE_OPTIONS}
|
|
/>
|
|
);
|
|
} |