52 lines
1.7 KiB
TypeScript
52 lines
1.7 KiB
TypeScript
'use client';
|
|
|
|
import { LeagueStandingsTable } from '@/components/leagues/LeagueStandingsTable';
|
|
import type { LeagueStandingsViewData } from '@/lib/view-data/LeagueStandingsViewData';
|
|
import { Box } from '@/ui/primitives/Box';
|
|
import { Text } from '@/ui/Text';
|
|
|
|
interface LeagueStandingsTemplateProps {
|
|
viewData: LeagueStandingsViewData;
|
|
onRemoveMember: (driverId: string) => void;
|
|
onUpdateRole: (driverId: string, newRole: string) => void;
|
|
loading?: boolean;
|
|
}
|
|
|
|
export function LeagueStandingsTemplate({
|
|
viewData,
|
|
loading = false,
|
|
}: LeagueStandingsTemplateProps) {
|
|
if (loading) {
|
|
return (
|
|
<Box display="flex" alignItems="center" justifyContent="center" py={24}>
|
|
<Text color="text-zinc-500" font="mono" size="xs" uppercase letterSpacing="widest" animate="pulse">
|
|
Loading Standings...
|
|
</Text>
|
|
</Box>
|
|
);
|
|
}
|
|
|
|
const standings = viewData.standings.map((entry) => {
|
|
const driver = viewData.drivers.find(d => d.id === entry.driverId);
|
|
return {
|
|
position: entry.position,
|
|
driverName: driver?.name || 'Unknown Driver',
|
|
points: entry.totalPoints,
|
|
wins: 0,
|
|
podiums: 0,
|
|
gap: entry.position === 1 ? '—' : `-${viewData.standings[0].totalPoints - entry.totalPoints}`
|
|
};
|
|
});
|
|
|
|
return (
|
|
<Box display="flex" flexDirection="col" gap={8}>
|
|
<Box as="header" display="flex" flexDirection="col" gap={2}>
|
|
<Text as="h2" size="xl" weight="bold" color="text-white" uppercase letterSpacing="tight">Championship Standings</Text>
|
|
<Text size="sm" color="text-zinc-500">Official points classification for the current season.</Text>
|
|
</Box>
|
|
|
|
<LeagueStandingsTable standings={standings} />
|
|
</Box>
|
|
);
|
|
}
|