website refactor

apps/website/app/races/[id]/page.tsx

@@ -1,16 +1,16 @@
 import { notFound } from 'next/navigation';
 import { PageWrapper } from '@/components/shared/state/PageWrapper';
-import { RaceDetailTemplate } from '@/templates/RaceDetailTemplate';
 import { RaceDetailPageQuery } from '@/lib/page-queries/races/RaceDetailPageQuery';
+import RaceDetailPageClient from './RaceDetailPageClient';
 
 interface RaceDetailPageProps {
-  params: {
+  params: Promise<{
     id: string;
-  };
+  }>;
 }
 
 export default async function RaceDetailPage({ params }: RaceDetailPageProps) {
-  const raceId = params.id;
+  const { id: raceId } = await params;
   
   if (!raceId) {
     notFound();
@@ -22,54 +22,17 @@ export default async function RaceDetailPage({ params }: RaceDetailPageProps) {
   if (result.isErr()) {
     const error = result.getError();
     
-    switch (error) {
-      case 'notFound':
-        notFound();
-      case 'redirect':
-        notFound();
-      default:
-        // Pass error to template via PageWrapper
-        return (
-          <PageWrapper
-            data={null}
-            Template={() => (
-              <RaceDetailTemplate
-                viewData={undefined}
-                isLoading={false}
-                error={new globalThis.Error('Failed to load race details')}
-                onBack={() => {}}
-                onRegister={() => {}}
-                onWithdraw={() => {}}
-                onCancel={() => {}}
-                onReopen={() => {}}
-                onEndRace={() => {}}
-                onFileProtest={() => {}}
-                onResultsClick={() => {}}
-                onStewardingClick={() => {}}
-                onLeagueClick={() => {}}
-                onDriverClick={() => {}}
-                isOwnerOrAdmin={false}
-                animatedRatingChange={0}
-                mutationLoading={{
-                  register: false,
-                  withdraw: false,
-                  cancel: false,
-                  reopen: false,
-                  complete: false,
-                }}
-              />
-            )}
-            loading={{ variant: 'skeleton', message: 'Loading race details...' }}
-            errorConfig={{ variant: 'full-screen' }}
-            empty={{
-              icon: require('lucide-react').Flag,
-              title: 'Race not found',
-              description: 'The race may have been cancelled or deleted',
-              action: { label: 'Back to Races', onClick: () => {} }
-            }}
-          />
-        );
+    if (error === 'notFound') {
+      notFound();
     }
+    // For other errors, let PageWrapper handle it
+    return (
+      <PageWrapper
+        data={undefined}
+        Template={RaceDetailPageClient as any}
+        error={new Error('Failed to load race details')}
+      />
+    );
   }
   
   const viewData = result.unwrap();
@@ -77,41 +40,7 @@ export default async function RaceDetailPage({ params }: RaceDetailPageProps) {
   return (
     <PageWrapper
       data={viewData}
-      Template={() => (
-        <RaceDetailTemplate
-          viewData={viewData}
-          isLoading={false}
-          error={null}
-          onBack={() => {}}
-          onRegister={() => {}}
-          onWithdraw={() => {}}
-          onCancel={() => {}}
-          onReopen={() => {}}
-          onEndRace={() => {}}
-          onFileProtest={() => {}}
-          onResultsClick={() => {}}
-          onStewardingClick={() => {}}
-          onLeagueClick={() => {}}
-          onDriverClick={() => {}}
-          isOwnerOrAdmin={false}
-          animatedRatingChange={0}
-          mutationLoading={{
-            register: false,
-            withdraw: false,
-            cancel: false,
-            reopen: false,
-            complete: false,
-          }}
-        />
-      )}
-      loading={{ variant: 'skeleton', message: 'Loading race details...' }}
-      errorConfig={{ variant: 'full-screen' }}
-      empty={{
-        icon: require('lucide-react').Flag,
-        title: 'Race not found',
-        description: 'The race may have been cancelled or deleted',
-        action: { label: 'Back to Races', onClick: () => {} }
-      }}
+      Template={RaceDetailPageClient}
     />
   );
 }