website refactor

apps/website/components/races/RaceListItemWrapper.tsx

@@ -24,22 +24,22 @@ interface RaceListItemProps {
 export function RaceListItem({ race, onClick }: RaceListItemProps) {
   const statusConfig = {
     scheduled: {
-      icon: Clock,
+      iconName: 'Clock',
       variant: 'primary' as const,
       label: 'Scheduled',
     },
     running: {
-      icon: PlayCircle,
+      iconName: 'PlayCircle',
       variant: 'success' as const,
       label: 'LIVE',
     },
     completed: {
-      icon: CheckCircle2,
+      iconName: 'CheckCircle2',
       variant: 'default' as const,
       label: 'Completed',
     },
     cancelled: {
-      icon: XCircle,
+      iconName: 'XCircle',
       variant: 'warning' as const,
       label: 'Cancelled',
     },
@@ -64,11 +64,13 @@ export function RaceListItem({ race, onClick }: RaceListItemProps) {
       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)}
-      statusConfig={config}
     />
   );
 }