website refactor

apps/website/components/races/RacesDayGroup.tsx

@@ -0,0 +1,38 @@
+'use client';
+
+import { Stack } from '@/ui/Stack';
+import { Text } from '@/ui/Text';
+import { Box } from '@/ui/Box';
+import { RaceListRow } from './RaceListRow';
+
+interface RacesDayGroupProps {
+  dateLabel: string;
+  races: any[];
+  onRaceClick: (id: string) => void;
+}
+
+export function RacesDayGroup({ dateLabel, races, onRaceClick }: RacesDayGroupProps) {
+  return (
+    <Stack gap={3}>
+      <Box 
+        paddingX={4} 
+        paddingY={2} 
+        borderBottom 
+        borderColor="var(--ui-color-border-muted)"
+      >
+        <Text size="xs" variant="low" weight="bold" uppercase letterSpacing="widest">
+          {dateLabel}
+        </Text>
+      </Box>
+      <Stack gap={1}>
+        {races.map(race => (
+          <RaceListRow 
+            key={race.id} 
+            race={race} 
+            onClick={onRaceClick} 
+          />
+        ))}
+      </Stack>
+    </Stack>
+  );
+}