43 lines
1.2 KiB
TypeScript
43 lines
1.2 KiB
TypeScript
'use client';
|
|
|
|
import { LiveRaceItem } from '@/components/races/LiveRaceItem';
|
|
import type { RaceViewData } from '@/lib/view-data/RacesViewData';
|
|
import { Stack } from '@/ui/Stack';
|
|
import { Text } from '@/ui/Text';
|
|
import { Panel } from '@/ui/Panel';
|
|
import { Icon } from '@/ui/Icon';
|
|
import { Zap } from 'lucide-react';
|
|
|
|
interface LiveRacesBannerProps {
|
|
liveRaces: RaceViewData[];
|
|
onRaceClick: (raceId: string) => void;
|
|
}
|
|
|
|
export function LiveRacesBanner({ liveRaces, onRaceClick }: LiveRacesBannerProps) {
|
|
if (liveRaces.length === 0) return null;
|
|
|
|
return (
|
|
<Panel variant="glass" padding="md">
|
|
<Stack gap={4}>
|
|
<Stack direction="row" align="center" gap={2}>
|
|
<Icon icon={Zap} size={4} intent="success" animate="pulse" />
|
|
<Text weight="bold" size="sm" variant="success" uppercase letterSpacing="widest">
|
|
Live Sessions
|
|
</Text>
|
|
</Stack>
|
|
|
|
<Stack gap={2}>
|
|
{liveRaces.map((race) => (
|
|
<LiveRaceItem
|
|
key={race.id}
|
|
track={race.track}
|
|
leagueName={race.leagueName ?? 'Official'}
|
|
onClick={() => onRaceClick(race.id)}
|
|
/>
|
|
))}
|
|
</Stack>
|
|
</Stack>
|
|
</Panel>
|
|
);
|
|
}
|