37 lines
1.0 KiB
TypeScript
37 lines
1.0 KiB
TypeScript
|
|
|
|
import { Box } from '@/ui/Box';
|
|
import { Card } from '@/ui/Card';
|
|
import { Heading } from '@/ui/Heading';
|
|
import { Icon } from '@/ui/Icon';
|
|
import { Grid } from '@/ui/Grid';
|
|
import { StatGridItem } from '@/ui/StatGridItem';
|
|
import { TrendingUp } from 'lucide-react';
|
|
|
|
interface CareerStatsProps {
|
|
stats: {
|
|
totalRaces: number;
|
|
wins: number;
|
|
podiums: number;
|
|
consistency: number | null;
|
|
};
|
|
}
|
|
|
|
export function CareerStats({ stats }: CareerStatsProps) {
|
|
return (
|
|
<Card>
|
|
<Box mb={4}>
|
|
<Heading level={2} icon={<Icon icon={TrendingUp} size={5} color="#10b981" />}>
|
|
Career Statistics
|
|
</Heading>
|
|
</Box>
|
|
<Grid cols={2} gap={4}>
|
|
<StatGridItem label="Races" value={stats.totalRaces} />
|
|
<StatGridItem label="Wins" value={stats.wins} color="text-performance-green" />
|
|
<StatGridItem label="Podiums" value={stats.podiums} color="text-warning-amber" />
|
|
<StatGridItem label="Consistency" value={`${stats.consistency}%`} color="text-primary-blue" />
|
|
</Grid>
|
|
</Card>
|
|
);
|
|
}
|