77 lines
1.9 KiB
TypeScript
77 lines
1.9 KiB
TypeScript
|
|
|
|
import { routes } from '@/lib/routing/RouteConfig';
|
|
import { RaceListItem as UiRaceListItem } from '@/components/races/RaceListItem';
|
|
import { CheckCircle2, Clock, PlayCircle, XCircle } from 'lucide-react';
|
|
|
|
interface Race {
|
|
id: string;
|
|
track: string;
|
|
car: string;
|
|
scheduledAt: string;
|
|
status: 'scheduled' | 'running' | 'completed' | 'cancelled';
|
|
sessionType: string;
|
|
leagueId?: string | null;
|
|
leagueName?: string | null;
|
|
strengthOfField?: number | null;
|
|
}
|
|
|
|
interface RaceListItemProps {
|
|
race: Race;
|
|
onClick: (id: string) => void;
|
|
}
|
|
|
|
export function RaceListItem({ race, onClick }: RaceListItemProps) {
|
|
const statusConfig = {
|
|
scheduled: {
|
|
iconName: 'Clock',
|
|
variant: 'primary' as const,
|
|
label: 'Scheduled',
|
|
},
|
|
running: {
|
|
iconName: 'PlayCircle',
|
|
variant: 'success' as const,
|
|
label: 'LIVE',
|
|
},
|
|
completed: {
|
|
iconName: 'CheckCircle2',
|
|
variant: 'default' as const,
|
|
label: 'Completed',
|
|
},
|
|
cancelled: {
|
|
iconName: 'XCircle',
|
|
variant: 'warning' as const,
|
|
label: 'Cancelled',
|
|
},
|
|
};
|
|
|
|
const config = statusConfig[race.status];
|
|
|
|
const formatTime = (date: string) => {
|
|
return new Date(date).toLocaleTimeString('en-US', {
|
|
hour: '2-digit',
|
|
minute: '2-digit',
|
|
});
|
|
};
|
|
|
|
const date = new Date(race.scheduledAt);
|
|
|
|
return (
|
|
<UiRaceListItem
|
|
track={race.track}
|
|
car={race.car}
|
|
dateLabel={date.toLocaleDateString('en-US', { month: 'short' })}
|
|
dayLabel={date.getDate().toString()}
|
|
timeLabel={formatTime(race.scheduledAt)}
|
|
status={race.status}
|
|
statusLabel={config.label}
|
|
statusVariant={config.variant}
|
|
statusIconName={config.iconName}
|
|
leagueName={race.leagueName}
|
|
leagueHref={race.leagueId ? routes.league.detail(race.leagueId) : undefined}
|
|
strengthOfField={race.strengthOfField}
|
|
onClick={() => onClick(race.id)}
|
|
/>
|
|
);
|
|
}
|