website refactor

apps/website/client-wrapper/DriversPageClient.tsx

@@ -2,13 +2,11 @@
 
 import type { DriversViewData } from '@/lib/types/view-data/DriversViewData';
 import { DriversTemplate } from '@/templates/DriversTemplate';
-import { Container } from '@/ui/Container';
-import { Stack } from '@/ui/Stack';
-import { Text } from '@/ui/Text';
+import { ErrorTemplate, EmptyTemplate } from '@/templates/shared/StatusTemplates';
 import { useRouter } from 'next/navigation';
 import { useMemo, useState } from 'react';
-
 import { routes } from '@/lib/routing/RouteConfig';
+import { ClientWrapperProps } from '@/lib/contracts/components/ComponentContracts';
 
 interface DriversPageClientProps {
   viewData: DriversViewData | null;
@@ -19,14 +17,6 @@ interface DriversPageClientProps {
   };
 }
 
-/**
- * DriversPageClient
- *
- * Client component that:
- * 1. Manages search state
- * 2. Filters drivers based on search
- * 3. Passes ViewData to Template
- */
 export function DriversPageClient({ viewData, error, empty }: DriversPageClientProps) {
   const [searchQuery, setSearchQuery] = useState('');
   const router = useRouter();
@@ -53,24 +43,22 @@ export function DriversPageClient({ viewData, error, empty }: DriversPageClientP
   // Handle error/empty states
   if (error) {
     return (
-      <Container size="lg" py={12}>
-        <Stack align="center" gap={4}>
-          <Text color="text-red-400">Error loading drivers</Text>
-          <Text color="text-gray-400">Please try again later</Text>
-        </Stack>
-      </Container>
+      <ErrorTemplate 
+        viewData={{}} 
+        message="Error loading drivers" 
+        description="Please try again later" 
+      />
     );
   }
 
   if (!viewData || viewData.drivers.length === 0) {
     if (empty) {
       return (
-        <Container size="lg" py={12}>
-          <Stack align="center" gap={2}>
-            <Text size="xl" weight="semibold" color="text-white">{empty.title}</Text>
-            <Text color="text-gray-400">{empty.description}</Text>
-          </Stack>
-        </Container>
+        <EmptyTemplate 
+          viewData={{}} 
+          title={empty.title} 
+          description={empty.description} 
+        />
       );
     }
     return null;
@@ -86,4 +74,4 @@ export function DriversPageClient({ viewData, error, empty }: DriversPageClientP
       onViewLeaderboard={handleViewLeaderboard}
     />
   );
-}
+}