45 lines
1.1 KiB
TypeScript
45 lines
1.1 KiB
TypeScript
import { RaceResultList } from '@/components/races/RaceResultList';
|
|
import { RaceSummaryItem } from '@/components/races/RaceSummaryItem';
|
|
import { Box } from '@/ui/Box';
|
|
import { Card } from '@/ui/Card';
|
|
import { Heading } from '@/ui/Heading';
|
|
|
|
type RaceWithResults = {
|
|
raceId: string;
|
|
track: string;
|
|
car: string;
|
|
winnerName: string;
|
|
formattedDate: string;
|
|
};
|
|
|
|
interface LatestResultsSidebarProps {
|
|
results: RaceWithResults[];
|
|
}
|
|
|
|
export function LatestResultsSidebar({ results }: LatestResultsSidebarProps) {
|
|
if (!results.length) {
|
|
return null;
|
|
}
|
|
|
|
return (
|
|
<Card bg="bg-iron-gray/80" p={4}>
|
|
<Heading level={3} mb={3}>
|
|
Latest results
|
|
</Heading>
|
|
<RaceResultList>
|
|
{results.slice(0, 4).map((result) => {
|
|
return (
|
|
<Box as="li" key={result.raceId}>
|
|
<RaceSummaryItem
|
|
track={result.track}
|
|
meta={`${result.winnerName} • ${result.car}`}
|
|
dateLabel={result.formattedDate}
|
|
/>
|
|
</Box>
|
|
);
|
|
})}
|
|
</RaceResultList>
|
|
</Card>
|
|
);
|
|
}
|