72 lines
2.2 KiB
TypeScript
72 lines
2.2 KiB
TypeScript
'use client';
|
|
|
|
import { DriverLeaderboardPreview } from '@/components/leaderboards/DriverLeaderboardPreview';
|
|
import { TeamLeaderboardPreview } from '@/components/teams/TeamLeaderboardPreviewWrapper';
|
|
import type { LeaderboardsViewData } from '@/lib/view-data/LeaderboardsViewData';
|
|
import { Container } from '@/ui/Container';
|
|
import { GridItem } from '@/ui/primitives/GridItem';
|
|
import { PageHero } from '@/ui/PageHero';
|
|
import { Grid } from '@/ui/primitives/Grid';
|
|
import { Trophy, Users } from 'lucide-react';
|
|
|
|
interface LeaderboardsTemplateProps {
|
|
viewData: LeaderboardsViewData;
|
|
onDriverClick: (id: string) => void;
|
|
onTeamClick: (id: string) => void;
|
|
onNavigateToDrivers: () => void;
|
|
onNavigateToTeams: () => void;
|
|
}
|
|
|
|
export function LeaderboardsTemplate({
|
|
viewData,
|
|
onDriverClick,
|
|
onTeamClick,
|
|
onNavigateToDrivers,
|
|
onNavigateToTeams
|
|
}: LeaderboardsTemplateProps) {
|
|
return (
|
|
<Container size="lg" py={8}>
|
|
<PageHero
|
|
title="Leaderboards"
|
|
description="Track the best drivers and teams across all competitions. Every race counts. Every position matters. Analyze telemetry-grade rankings and performance metrics."
|
|
icon={Trophy}
|
|
actions={[
|
|
{
|
|
label: 'Driver Rankings',
|
|
onClick: onNavigateToDrivers,
|
|
icon: Trophy,
|
|
variant: 'primary'
|
|
},
|
|
{
|
|
label: 'Team Rankings',
|
|
onClick: onNavigateToTeams,
|
|
icon: Users,
|
|
variant: 'secondary'
|
|
}
|
|
]}
|
|
/>
|
|
|
|
<Grid cols={12} gap={6} mt={10}>
|
|
<GridItem colSpan={12} lgSpan={6}>
|
|
<DriverLeaderboardPreview
|
|
drivers={viewData.drivers}
|
|
onDriverClick={onDriverClick}
|
|
onNavigateToDrivers={onNavigateToDrivers}
|
|
/>
|
|
</GridItem>
|
|
<GridItem colSpan={12} lgSpan={6}>
|
|
<TeamLeaderboardPreview
|
|
topTeams={viewData.teams.map(team => ({
|
|
...team,
|
|
isRecruiting: false,
|
|
performanceLevel: 'N/A'
|
|
}))}
|
|
onTeamClick={onTeamClick}
|
|
onViewFullLeaderboard={onNavigateToTeams}
|
|
/>
|
|
</GridItem>
|
|
</Grid>
|
|
</Container>
|
|
);
|
|
}
|