fix issues

2026-01-07 16:20:19 +01:00
parent 3b3971e653
commit 1b63fa646c
17 changed files with 758 additions and 187 deletions
--- a/apps/website/app/layout.tsx
+++ b/apps/website/app/layout.tsx
@@ -6,6 +6,7 @@ import { AuthProvider } from '@/lib/auth/AuthContext';
 import { FeatureFlagService } from '@/lib/feature/FeatureFlagService';
 import { FeatureFlagProvider } from '@/lib/feature/FeatureFlagProvider';
 import { ContainerProvider } from '@/lib/di/providers/ContainerProvider';
+import { QueryClientProvider } from '@/lib/providers/QueryClientProvider';
 import { initializeGlobalErrorHandling } from '@/lib/infrastructure/GlobalErrorHandler';
 import { initializeApiLogger } from '@/lib/infrastructure/ApiRequestLogger';
 import { Metadata, Viewport } from 'next';
@@ -81,39 +82,41 @@ export default async function RootLayout({
      </head>
      <body className="antialiased overflow-x-hidden">
        <ContainerProvider>
-          <AuthProvider>
-            <FeatureFlagProvider flags={enabledFlags}>
-              <NotificationProvider>
-                <NotificationIntegration />
-                <EnhancedErrorBoundary enableDevOverlay={process.env.NODE_ENV === 'development'}>
-                  <header className="fixed top-0 left-0 right-0 z-50 bg-deep-graphite/80 backdrop-blur-sm border-b border-white/5">
-                    <div className="max-w-7xl mx-auto px-6 py-4">
-                      <div className="flex items-center justify-between">
-                        <div className="flex items-center space-x-3">
-                          <Link href="/" className="inline-flex items-center">
-                            <Image
-                              src="/images/logos/wordmark-rectangle-dark.svg"
-                              alt="GridPilot"
-                              width={160}
-                              height={30}
-                              className="h-6 w-auto md:h-8"
-                              priority
-                            />
-                          </Link>
-                          <p className="hidden sm:block text-sm text-gray-400 font-light">
-                            Making league racing less chaotic
-                          </p>
+          <QueryClientProvider>
+            <AuthProvider>
+              <FeatureFlagProvider flags={enabledFlags}>
+                <NotificationProvider>
+                  <NotificationIntegration />
+                  <EnhancedErrorBoundary enableDevOverlay={process.env.NODE_ENV === 'development'}>
+                    <header className="fixed top-0 left-0 right-0 z-50 bg-deep-graphite/80 backdrop-blur-sm border-b border-white/5">
+                      <div className="max-w-7xl mx-auto px-6 py-4">
+                        <div className="flex items-center justify-between">
+                          <div className="flex items-center space-x-3">
+                            <Link href="/" className="inline-flex items-center">
+                              <Image
+                                src="/images/logos/wordmark-rectangle-dark.svg"
+                                alt="GridPilot"
+                                width={160}
+                                height={30}
+                                className="h-6 w-auto md:h-8"
+                                priority
+                              />
+                            </Link>
+                            <p className="hidden sm:block text-sm text-gray-400 font-light">
+                              Making league racing less chaotic
+                            </p>
+                          </div>
                        </div>
                      </div>
-                    </div>
-                  </header>
-                  <div className="pt-16">{children}</div>
-                  {/* Development Tools */}
-                  {process.env.NODE_ENV === 'development' && <DevToolbar />}
-                </EnhancedErrorBoundary>
-              </NotificationProvider>
-            </FeatureFlagProvider>
-          </AuthProvider>
+                    </header>
+                    <div className="pt-16">{children}</div>
+                    {/* Development Tools */}
+                    {process.env.NODE_ENV === 'development' && <DevToolbar />}
+                  </EnhancedErrorBoundary>
+                </NotificationProvider>
+              </FeatureFlagProvider>
+            </AuthProvider>
+          </QueryClientProvider>
        </ContainerProvider>
      </body>
    </html>
--- a/apps/website/app/leaderboards/LeaderboardsPageWrapper.tsx
+++ b/apps/website/app/leaderboards/LeaderboardsPageWrapper.tsx
@@ -0,0 +1,49 @@
+'use client';
+
+import { useRouter } from 'next/navigation';
+import LeaderboardsTemplate from '@/templates/LeaderboardsTemplate';
+import type { DriverLeaderboardViewModel } from '@/lib/view-models/DriverLeaderboardViewModel';
+import type { TeamSummaryViewModel } from '@/lib/view-models/TeamSummaryViewModel';
+
+interface LeaderboardsPageData {
+  drivers: DriverLeaderboardViewModel | null;
+  teams: TeamSummaryViewModel[] | null;
+}
+
+export function LeaderboardsPageWrapper({ data }: { data: LeaderboardsPageData | null }) {
+  const router = useRouter();
+  
+  if (!data || (!data.drivers && !data.teams)) {
+    return null;
+  }
+
+  const drivers = data.drivers?.drivers || [];
+  const teams = data.teams || [];
+
+  const handleDriverClick = (driverId: string) => {
+    router.push(`/drivers/${driverId}`);
+  };
+
+  const handleTeamClick = (teamId: string) => {
+    router.push(`/teams/${teamId}`);
+  };
+
+  const handleNavigateToDrivers = () => {
+    router.push('/leaderboards/drivers');
+  };
+
+  const handleNavigateToTeams = () => {
+    router.push('/teams/leaderboard');
+  };
+
+  return (
+    <LeaderboardsTemplate
+      drivers={drivers}
+      teams={teams}
+      onDriverClick={handleDriverClick}
+      onTeamClick={handleTeamClick}
+      onNavigateToDrivers={handleNavigateToDrivers}
+      onNavigateToTeams={handleNavigateToTeams}
+    />
+  );
+}
--- a/apps/website/app/leaderboards/drivers/DriverRankingsPageWrapper.tsx
+++ b/apps/website/app/leaderboards/drivers/DriverRankingsPageWrapper.tsx
@@ -0,0 +1,48 @@
+'use client';
+
+import { useRouter } from 'next/navigation';
+import DriverRankingsTemplate from '@/templates/DriverRankingsTemplate';
+import { useState } from 'react';
+import type { DriverLeaderboardViewModel } from '@/lib/view-models/DriverLeaderboardViewModel';
+
+type SkillLevel = 'pro' | 'advanced' | 'intermediate' | 'beginner';
+type SortBy = 'rank' | 'rating' | 'wins' | 'podiums' | 'winRate';
+
+export function DriverRankingsPageWrapper({ data }: { data: DriverLeaderboardViewModel | null }) {
+  const router = useRouter();
+  
+  // Client-side state for filtering and sorting
+  const [searchQuery, setSearchQuery] = useState('');
+  const [selectedSkill, setSelectedSkill] = useState<'all' | SkillLevel>('all');
+  const [sortBy, setSortBy] = useState<SortBy>('rank');
+  const [showFilters, setShowFilters] = useState(false);
+
+  if (!data || !data.drivers) {
+    return null;
+  }
+
+  const handleDriverClick = (driverId: string) => {
+    if (driverId.startsWith('demo-')) return;
+    router.push(`/drivers/${driverId}`);
+  };
+
+  const handleBackToLeaderboards = () => {
+    router.push('/leaderboards');
+  };
+
+  return (
+    <DriverRankingsTemplate
+      drivers={data.drivers}
+      searchQuery={searchQuery}
+      selectedSkill={selectedSkill}
+      sortBy={sortBy}
+      showFilters={showFilters}
+      onSearchChange={setSearchQuery}
+      onSkillChange={setSelectedSkill}
+      onSortChange={setSortBy}
+      onToggleFilters={() => setShowFilters(!showFilters)}
+      onDriverClick={handleDriverClick}
+      onBackToLeaderboards={handleBackToLeaderboards}
+    />
+  );
+}
--- a/apps/website/app/leaderboards/drivers/page.tsx
+++ b/apps/website/app/leaderboards/drivers/page.tsx
@@ -1,62 +1,11 @@
 import { PageWrapper } from '@/components/shared/state/PageWrapper';
-import DriverRankingsTemplate from '@/templates/DriverRankingsTemplate';
 import { PageDataFetcher } from '@/lib/page/PageDataFetcher';
 import { DRIVER_SERVICE_TOKEN } from '@/lib/di/tokens';
 import { DriverService } from '@/lib/services/drivers/DriverService';
 import { Users } from 'lucide-react';
-import { redirect , useRouter } from 'next/navigation';
+import { redirect } from 'next/navigation';
 import type { DriverLeaderboardViewModel } from '@/lib/view-models/DriverLeaderboardViewModel';
-import { useState } from 'react';
-
-// ============================================================================
-// TYPES
-// ============================================================================
-
-type SkillLevel = 'pro' | 'advanced' | 'intermediate' | 'beginner';
-type SortBy = 'rank' | 'rating' | 'wins' | 'podiums' | 'winRate';
-
-// ============================================================================
-// WRAPPER COMPONENT (Client-side state management)
-// ============================================================================
-
-function DriverRankingsPageWrapper({ data }: { data: DriverLeaderboardViewModel | null }) {
-  const router = useRouter();
-  
-  // Client-side state for filtering and sorting
-  const [searchQuery, setSearchQuery] = useState('');
-  const [selectedSkill, setSelectedSkill] = useState<'all' | SkillLevel>('all');
-  const [sortBy, setSortBy] = useState<SortBy>('rank');
-  const [showFilters, setShowFilters] = useState(false);
-
-  if (!data || !data.drivers) {
-    return null;
-  }
-
-  const handleDriverClick = (driverId: string) => {
-    if (driverId.startsWith('demo-')) return;
-    router.push(`/drivers/${driverId}`);
-  };
-
-  const handleBackToLeaderboards = () => {
-    router.push('/leaderboards');
-  };
-
-  return (
-    <DriverRankingsTemplate
-      drivers={data.drivers}
-      searchQuery={searchQuery}
-      selectedSkill={selectedSkill}
-      sortBy={sortBy}
-      showFilters={showFilters}
-      onSearchChange={setSearchQuery}
-      onSkillChange={setSelectedSkill}
-      onSortChange={setSortBy}
-      onToggleFilters={() => setShowFilters(!showFilters)}
-      onDriverClick={handleDriverClick}
-      onBackToLeaderboards={handleBackToLeaderboards}
-    />
-  );
-}
+import { DriverRankingsPageWrapper } from './DriverRankingsPageWrapper';

 // ============================================================================
 // MAIN PAGE COMPONENT
--- a/apps/website/app/leaderboards/page.tsx
+++ b/apps/website/app/leaderboards/page.tsx
@@ -1,13 +1,13 @@
 import { PageWrapper } from '@/components/shared/state/PageWrapper';
-import LeaderboardsTemplate from '@/templates/LeaderboardsTemplate';
 import { PageDataFetcher } from '@/lib/page/PageDataFetcher';
 import { DRIVER_SERVICE_TOKEN, TEAM_SERVICE_TOKEN } from '@/lib/di/tokens';
 import { DriverService } from '@/lib/services/drivers/DriverService';
 import { TeamService } from '@/lib/services/teams/TeamService';
 import { Trophy } from 'lucide-react';
-import { redirect , useRouter } from 'next/navigation';
+import { redirect } from 'next/navigation';
 import type { DriverLeaderboardViewModel } from '@/lib/view-models/DriverLeaderboardViewModel';
 import type { TeamSummaryViewModel } from '@/lib/view-models/TeamSummaryViewModel';
+import { LeaderboardsPageWrapper } from './LeaderboardsPageWrapper';

 // ============================================================================
 // TYPES
@@ -18,48 +18,6 @@ interface LeaderboardsPageData {
  teams: TeamSummaryViewModel[] | null;
 }

-// ============================================================================
-// WRAPPER COMPONENT
-// ============================================================================
-
-function LeaderboardsPageWrapper({ data }: { data: LeaderboardsPageData | null }) {
-  const router = useRouter();
-  
-  if (!data || (!data.drivers && !data.teams)) {
-    return null;
-  }
-
-  const drivers = data.drivers?.drivers || [];
-  const teams = data.teams || [];
-
-  const handleDriverClick = (driverId: string) => {
-    router.push(`/drivers/${driverId}`);
-  };
-
-  const handleTeamClick = (teamId: string) => {
-    router.push(`/teams/${teamId}`);
-  };
-
-  const handleNavigateToDrivers = () => {
-    router.push('/leaderboards/drivers');
-  };
-
-  const handleNavigateToTeams = () => {
-    router.push('/teams/leaderboard');
-  };
-
-  return (
-    <LeaderboardsTemplate
-      drivers={drivers}
-      teams={teams}
-      onDriverClick={handleDriverClick}
-      onTeamClick={handleTeamClick}
-      onNavigateToDrivers={handleNavigateToDrivers}
-      onNavigateToTeams={handleNavigateToTeams}
-    />
-  );
-}
-
 // ============================================================================
 // MAIN PAGE COMPONENT
 // ============================================================================
--- a/apps/website/app/teams/leaderboard/TeamLeaderboardPageWrapper.tsx
+++ b/apps/website/app/teams/leaderboard/TeamLeaderboardPageWrapper.tsx
@@ -0,0 +1,44 @@
+'use client';
+
+import { useRouter } from 'next/navigation';
+import TeamLeaderboardTemplate from '@/templates/TeamLeaderboardTemplate';
+import { useState } from 'react';
+import type { TeamSummaryViewModel } from '@/lib/view-models/TeamSummaryViewModel';
+
+type SkillLevel = 'pro' | 'advanced' | 'intermediate' | 'beginner';
+type SortBy = 'rating' | 'wins' | 'winRate' | 'races';
+
+export function TeamLeaderboardPageWrapper({ data }: { data: TeamSummaryViewModel[] | null }) {
+  const router = useRouter();
+  
+  // Client-side state for filtering and sorting
+  const [searchQuery, setSearchQuery] = useState('');
+  const [filterLevel, setFilterLevel] = useState<SkillLevel | 'all'>('all');
+  const [sortBy, setSortBy] = useState<SortBy>('rating');
+
+  if (!data || data.length === 0) {
+    return null;
+  }
+
+  const handleTeamClick = (teamId: string) => {
+    router.push(`/teams/${teamId}`);
+  };
+
+  const handleBackToTeams = () => {
+    router.push('/teams');
+  };
+
+  return (
+    <TeamLeaderboardTemplate
+      teams={data}
+      searchQuery={searchQuery}
+      filterLevel={filterLevel}
+      sortBy={sortBy}
+      onSearchChange={setSearchQuery}
+      onFilterLevelChange={setFilterLevel}
+      onSortChange={setSortBy}
+      onTeamClick={handleTeamClick}
+      onBackToTeams={handleBackToTeams}
+    />
+  );
+}
--- a/apps/website/app/teams/leaderboard/page.tsx
+++ b/apps/website/app/teams/leaderboard/page.tsx
@@ -1,58 +1,11 @@
 import { PageWrapper } from '@/components/shared/state/PageWrapper';
-import TeamLeaderboardTemplate from '@/templates/TeamLeaderboardTemplate';
 import { PageDataFetcher } from '@/lib/page/PageDataFetcher';
 import { TEAM_SERVICE_TOKEN } from '@/lib/di/tokens';
 import { TeamService } from '@/lib/services/teams/TeamService';
 import { Trophy } from 'lucide-react';
-import { redirect , useRouter } from 'next/navigation';
+import { redirect } from 'next/navigation';
 import type { TeamSummaryViewModel } from '@/lib/view-models/TeamSummaryViewModel';
-import { useState } from 'react';
-
-// ============================================================================
-// TYPES
-// ============================================================================
-
-type SkillLevel = 'pro' | 'advanced' | 'intermediate' | 'beginner';
-type SortBy = 'rating' | 'wins' | 'winRate' | 'races';
-
-// ============================================================================
-// WRAPPER COMPONENT (Client-side state management)
-// ============================================================================
-
-function TeamLeaderboardPageWrapper({ data }: { data: TeamSummaryViewModel[] | null }) {
-  const router = useRouter();
-  
-  // Client-side state for filtering and sorting
-  const [searchQuery, setSearchQuery] = useState('');
-  const [filterLevel, setFilterLevel] = useState<SkillLevel | 'all'>('all');
-  const [sortBy, setSortBy] = useState<SortBy>('rating');
-
-  if (!data || data.length === 0) {
-    return null;
-  }
-
-  const handleTeamClick = (teamId: string) => {
-    router.push(`/teams/${teamId}`);
-  };
-
-  const handleBackToTeams = () => {
-    router.push('/teams');
-  };
-
-  return (
-    <TeamLeaderboardTemplate
-      teams={data}
-      searchQuery={searchQuery}
-      filterLevel={filterLevel}
-      sortBy={sortBy}
-      onSearchChange={setSearchQuery}
-      onFilterLevelChange={setFilterLevel}
-      onSortChange={setSortBy}
-      onTeamClick={handleTeamClick}
-      onBackToTeams={handleBackToTeams}
-    />
-  );
-}
+import { TeamLeaderboardPageWrapper } from './TeamLeaderboardPageWrapper';

 // ============================================================================
 // MAIN PAGE COMPONENT