page wrapper

apps/website/app/leagues/[id]/rulebook/LeagueRulebookInteractive.tsx

@@ -1,48 +0,0 @@
-'use client';
-
-import { useState, useEffect } from 'react';
-import { useParams } from 'next/navigation';
-import { LeagueRulebookTemplate } from '@/templates/LeagueRulebookTemplate';
-import { useInject } from '@/lib/di/hooks/useInject';
-import { LEAGUE_SERVICE_TOKEN } from '@/lib/di/tokens';
-import { LeagueDetailPageViewModel } from '@/lib/view-models/LeagueDetailPageViewModel';
-
-export default function LeagueRulebookInteractive() {
-  const params = useParams();
-  const leagueId = params.id as string;
-
-  const leagueService = useInject(LEAGUE_SERVICE_TOKEN);
-
-  const [viewModel, setViewModel] = useState<LeagueDetailPageViewModel | null>(null);
-  const [loading, setLoading] = useState(true);
-
-  useEffect(() => {
-    async function loadData() {
-      try {
-        const data = await leagueService.getLeagueDetailPageData(leagueId);
-        if (!data) {
-          setLoading(false);
-          return;
-        }
-
-        setViewModel(data);
-      } catch (err) {
-        console.error('Failed to load scoring config:', err);
-      } finally {
-        setLoading(false);
-      }
-    }
-
-    loadData();
-  }, [leagueId, leagueService]);
-
-  if (!viewModel && !loading) {
-    return (
-      <div className="text-center text-gray-400 py-12">
-        Unable to load rulebook
-      </div>
-    );
-  }
-
-  return <LeagueRulebookTemplate viewModel={viewModel!} loading={loading} />;
-}

apps/website/app/leagues/[id]/rulebook/LeagueRulebookStatic.tsx

@@ -1,38 +0,0 @@
-import { LeagueRulebookTemplate } from '@/templates/LeagueRulebookTemplate';
-import { ServiceFactory } from '@/lib/services/ServiceFactory';
-import { getWebsiteApiBaseUrl } from '@/lib/config/apiBaseUrl';
-import { LeagueDetailPageViewModel } from '@/lib/view-models/LeagueDetailPageViewModel';
-
-interface LeagueRulebookStaticProps {
-  leagueId: string;
-}
-
-export default async function LeagueRulebookStatic({ leagueId }: LeagueRulebookStaticProps) {
-  const serviceFactory = new ServiceFactory(getWebsiteApiBaseUrl());
-  const leagueService = serviceFactory.createLeagueService();
-  
-  let viewModel: LeagueDetailPageViewModel | null = null;
-  let loading = false;
-
-  try {
-    loading = true;
-    const data = await leagueService.getLeagueDetailPageData(leagueId);
-    if (data) {
-      viewModel = data;
-    }
-  } catch (err) {
-    console.error('Failed to load scoring config:', err);
-  } finally {
-    loading = false;
-  }
-
-  if (!viewModel && !loading) {
-    return (
-      <div className="text-center text-gray-400 py-12">
-        Unable to load rulebook
-      </div>
-    );
-  }
-
-  return <LeagueRulebookTemplate viewModel={viewModel!} loading={loading} />;
-}

apps/website/app/leagues/[id]/rulebook/page.tsx

@@ -1,3 +1,63 @@
-import LeagueRulebookInteractive from './LeagueRulebookInteractive';
+import { LeagueRulebookTemplate } from '@/templates/LeagueRulebookTemplate';
+import { PageWrapper } from '@/components/shared/state/PageWrapper';
+import { PageDataFetcher } from '@/lib/page/PageDataFetcher';
+import { LeagueService } from '@/lib/services/leagues/LeagueService';
+import { LeaguesApiClient } from '@/lib/api/leagues/LeaguesApiClient';
+import { DriversApiClient } from '@/lib/api/drivers/DriversApiClient';
+import { SponsorsApiClient } from '@/lib/api/sponsors/SponsorsApiClient';
+import { RacesApiClient } from '@/lib/api/races/RacesApiClient';
+import { EnhancedErrorReporter } from '@/lib/infrastructure/EnhancedErrorReporter';
+import { ConsoleLogger } from '@/lib/infrastructure/logging/ConsoleLogger';
+import { getWebsiteApiBaseUrl } from '@/lib/config/apiBaseUrl';
+import { notFound } from 'next/navigation';
+import type { LeagueDetailPageViewModel } from '@/lib/view-models/LeagueDetailPageViewModel';
 
-export default LeagueRulebookInteractive;
+interface Props {
+  params: { id: string };
+}
+
+export default async function Page({ params }: Props) {
+  // Validate params
+  if (!params.id) {
+    notFound();
+  }
+
+  // Fetch data using PageDataFetcher.fetchManual
+  const data = await PageDataFetcher.fetchManual(async () => {
+    // Create dependencies for API clients
+    const baseUrl = getWebsiteApiBaseUrl();
+    const logger = new ConsoleLogger();
+    const errorReporter = new EnhancedErrorReporter(logger, {
+      showUserNotifications: true,
+      logToConsole: true,
+      reportToExternal: process.env.NODE_ENV === 'production',
+    });
+
+    // Create API clients
+    const leaguesApiClient = new LeaguesApiClient(baseUrl, errorReporter, logger);
+    const driversApiClient = new DriversApiClient(baseUrl, errorReporter, logger);
+    const sponsorsApiClient = new SponsorsApiClient(baseUrl, errorReporter, logger);
+    const racesApiClient = new RacesApiClient(baseUrl, errorReporter, logger);
+
+    // Create service
+    const service = new LeagueService(
+      leaguesApiClient,
+      driversApiClient,
+      sponsorsApiClient,
+      racesApiClient
+    );
+    
+    return await service.getLeagueDetailPageData(params.id);
+  });
+
+  if (!data) {
+    notFound();
+  }
+
+  // Create a Template wrapper that matches PageWrapper's expected interface
+  const Template = ({ data }: { data: LeagueDetailPageViewModel }) => {
+    return <LeagueRulebookTemplate viewModel={data} loading={false} />;
+  };
+
+  return <PageWrapper data={data} Template={Template} />;
+}