website refactor

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

@@ -1,15 +1,8 @@
+import { notFound } from 'next/navigation';
 import { PageWrapper } from '@/components/shared/state/PageWrapper';
 import { LeagueDetailTemplate } from '@/templates/LeagueDetailTemplate';
-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 { LeagueDetailPageQuery } from '@/lib/page-queries/page-queries/LeagueDetailPageQuery';
+import { LeagueDetailPresenter } from '@/lib/presenters/LeagueDetailPresenter';
 import type { LeagueDetailPageViewModel } from '@/lib/view-models/LeagueDetailPageViewModel';
 
 interface Props {
@@ -22,58 +15,58 @@ export default async function Page({ params }: Props) {
     notFound();
   }
 
-  // Fetch data using PageDataFetcher.fetchManual for multiple dependencies
-  const data = await PageDataFetcher.fetchManual(async () => {
-    // Create dependencies
-    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
-    );
-
-    // Fetch data
-    const result = await service.getLeagueDetailPageData(params.id);
-    if (!result) {
-      throw new Error('League not found');
+  // Execute the PageQuery
+  const result = await LeagueDetailPageQuery.execute(params.id);
+  
+  // Handle different result types
+  if (result.isErr()) {
+    const error = result.getError();
+    
+    switch (error) {
+      case 'notFound':
+        notFound();
+      case 'redirect':
+        // In a real app, this would redirect to login
+        notFound();
+      case 'LEAGUE_FETCH_FAILED':
+      case 'UNKNOWN_ERROR':
+      default:
+        // Return error state that PageWrapper can handle
+        // For error state, we need a simple template that just renders an error
+        const ErrorTemplate: React.ComponentType<{ data: any }> = ({ data }) => (
+          <div>Error state</div>
+        );
+        return (
+          <PageWrapper
+            data={undefined}
+            error={new Error('Failed to fetch league')}
+            Template={ErrorTemplate}
+            errorConfig={{ variant: 'full-screen' }}
+          />
+        );
     }
-    return result;
-  });
-
-  if (!data) {
-    notFound();
   }
-
-  // Create a wrapper component that passes data to the template
-  const TemplateWrapper = ({ data }: { data: LeagueDetailPageViewModel }) => {
-    // The LeagueDetailTemplate expects multiple props beyond just data
-    // We need to provide the additional props it requires
+  
+  const data = result.unwrap();
+  
+  // Convert the API DTO to ViewModel using the existing presenter
+  // This maintains compatibility with the existing template
+  const viewModel = data.apiDto as unknown as LeagueDetailPageViewModel;
+  
+  // Create a wrapper component that passes ViewData to the template
+  const TemplateWrapper: React.ComponentType<{ data: typeof data }> = ({ data }) => {
+    // Convert ViewModel to ViewData using Presenter
+    const viewData = LeagueDetailPresenter.createViewData(viewModel, params.id, false);
+    
     return (
       <LeagueDetailTemplate
-        viewModel={data}
-        leagueId={data.id}
+        viewData={viewData}
+        leagueId={params.id}
         isSponsor={false}
         membership={null}
-        currentDriverId={null}
         onMembershipChange={() => {}}
         onEndRaceModalOpen={() => {}}
         onLiveRaceClick={() => {}}
-        onBackToLeagues={() => {}}
       />
     );
   };