website refactor

apps/website/components/races/RaceHeroWrapper.tsx

@@ -2,6 +2,7 @@
 
 import { RaceHero as UiRaceHero } from '@/components/races/RaceHero';
 import { LucideIcon } from 'lucide-react';
+import { DateDisplay } from '@/lib/display-objects/DateDisplay';
 
 interface RaceHeroProps {
   track: string;
@@ -17,7 +18,7 @@ interface RaceHeroProps {
 }
 
 export function RaceHero(props: RaceHeroProps) {
-  const { statusConfig, ...rest } = props;
+  const { statusConfig, scheduledAt, ...rest } = props;
   
   // Map variant to match UI component expectations
   const mappedConfig: {
@@ -30,5 +31,12 @@ export function RaceHero(props: RaceHeroProps) {
     variant: statusConfig.variant === 'default' ? 'default' : statusConfig.variant
   };
 
-  return <UiRaceHero {...rest} statusConfig={mappedConfig} />;
+  return (
+    <UiRaceHero 
+      {...rest} 
+      formattedDate={DateDisplay.formatShort(scheduledAt)}
+      formattedTime={DateDisplay.formatTime(scheduledAt)}
+      statusConfig={mappedConfig} 
+    />
+  );
 }