website refactor

apps/website/client-wrapper/DriverRankingsPageClient.tsx

@@ -0,0 +1,41 @@
+'use client';
+
+import React, { useState } from 'react';
+import { useRouter } from 'next/navigation';
+import { DriverRankingsTemplate } from '@/templates/DriverRankingsTemplate';
+import { routes } from '@/lib/routing/RouteConfig';
+import type { DriverRankingsViewData } from '@/lib/view-data/DriverRankingsViewData';
+
+interface DriverRankingsPageClientProps {
+  viewData: DriverRankingsViewData;
+}
+
+export function DriverRankingsPageClient({ viewData }: DriverRankingsPageClientProps) {
+  const router = useRouter();
+  const [searchQuery, setSearchQuery] = useState('');
+
+  const handleDriverClick = (id: string) => {
+    router.push(routes.driver.detail(id));
+  };
+
+  const handleBackToLeaderboards = () => {
+    router.push(routes.leaderboards.root);
+  };
+
+  const filteredDrivers = viewData.drivers.filter(driver => 
+    driver.name.toLowerCase().includes(searchQuery.toLowerCase())
+  );
+
+  return (
+    <DriverRankingsTemplate
+      viewData={{
+        ...viewData,
+        drivers: filteredDrivers
+      }}
+      searchQuery={searchQuery}
+      onSearchChange={setSearchQuery}
+      onDriverClick={handleDriverClick}
+      onBackToLeaderboards={handleBackToLeaderboards}
+    />
+  );
+}