wip league admin tools

apps/website/components/leagues/LeagueSchedule.test.tsx

@@ -0,0 +1,79 @@
+import * as React from 'react';
+import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
+import { render, screen } from '@testing-library/react';
+import '@testing-library/jest-dom';
+
+import LeagueSchedule from './LeagueSchedule';
+import { LeagueScheduleViewModel } from '@/lib/view-models/LeagueScheduleViewModel';
+
+const mockPush = vi.fn();
+
+vi.mock('next/navigation', () => ({
+  useRouter: () => ({
+    push: mockPush,
+  }),
+}));
+
+vi.mock('@/hooks/useEffectiveDriverId', () => ({
+  useEffectiveDriverId: () => 'driver-123',
+}));
+
+const mockUseLeagueSchedule = vi.fn();
+vi.mock('@/hooks/useLeagueService', () => ({
+  useLeagueSchedule: (...args: unknown[]) => mockUseLeagueSchedule(...args),
+}));
+
+vi.mock('@/hooks/useRaceService', () => ({
+  useRegisterForRace: () => ({
+    mutateAsync: vi.fn(),
+    isPending: false,
+  }),
+  useWithdrawFromRace: () => ({
+    mutateAsync: vi.fn(),
+    isPending: false,
+  }),
+}));
+
+describe('LeagueSchedule', () => {
+  beforeEach(() => {
+    vi.useFakeTimers();
+    vi.setSystemTime(new Date('2025-01-01T00:00:00Z'));
+    mockPush.mockReset();
+    mockUseLeagueSchedule.mockReset();
+  });
+
+  afterEach(() => {
+    vi.useRealTimers();
+  });
+
+  it('renders a schedule race (no crash)', () => {
+    mockUseLeagueSchedule.mockReturnValue({
+      isLoading: false,
+      data: new LeagueScheduleViewModel([
+        {
+          id: 'race-1',
+          name: 'Round 1',
+          scheduledAt: new Date('2025-01-02T20:00:00Z'),
+          isPast: false,
+          isUpcoming: true,
+          status: 'scheduled',
+        },
+      ]),
+    });
+
+    render(<LeagueSchedule leagueId="league-1" />);
+
+    expect(screen.getByText('Round 1')).toBeInTheDocument();
+  });
+
+  it('renders loading state while schedule is loading', () => {
+    mockUseLeagueSchedule.mockReturnValue({
+      isLoading: true,
+      data: undefined,
+    });
+
+    render(<LeagueSchedule leagueId="league-1" />);
+
+    expect(screen.getByText('Loading schedule...')).toBeInTheDocument();
+  });
+});

apps/website/components/leagues/LeagueSchedule.tsx

@@ -5,6 +5,7 @@ import { useLeagueSchedule } from '@/hooks/useLeagueService';
 import { useRegisterForRace, useWithdrawFromRace } from '@/hooks/useRaceService';
 import { useRouter } from 'next/navigation';
 import { useMemo, useState } from 'react';
+import type { LeagueScheduleRaceViewModel } from '@/lib/view-models/LeagueScheduleViewModel';
 
 interface LeagueScheduleProps {
   leagueId: string;
@@ -21,14 +22,13 @@ export default function LeagueSchedule({ leagueId }: LeagueScheduleProps) {
   const withdrawMutation = useWithdrawFromRace();
 
   const races = useMemo(() => {
-    // Current contract uses `unknown[]` for races; treat as any until a proper schedule DTO/view-model is introduced.
-    return (schedule?.races ?? []) as Array<any>;
+    return schedule?.races ?? [];
   }, [schedule]);
 
-  const handleRegister = async (race: any, e: React.MouseEvent) => {
+  const handleRegister = async (race: LeagueScheduleRaceViewModel, e: React.MouseEvent) => {
     e.stopPropagation();
 
-    const confirmed = window.confirm(`Register for ${race.track}?`);
+    const confirmed = window.confirm(`Register for ${race.track ?? race.name}?`);
 
     if (!confirmed) return;
 
@@ -39,7 +39,7 @@ export default function LeagueSchedule({ leagueId }: LeagueScheduleProps) {
     }
   };
 
-  const handleWithdraw = async (race: any, e: React.MouseEvent) => {
+  const handleWithdraw = async (race: LeagueScheduleRaceViewModel, e: React.MouseEvent) => {
     e.stopPropagation();
 
     const confirmed = window.confirm('Withdraw from this race?');
@@ -134,6 +134,9 @@ export default function LeagueSchedule({ leagueId }: LeagueScheduleProps) {
             const isPast = race.isPast;
             const isUpcoming = race.isUpcoming;
             const isRegistered = Boolean(race.isRegistered);
+            const trackLabel = race.track ?? race.name;
+            const carLabel = race.car ?? '—';
+            const sessionTypeLabel = (race.sessionType ?? 'race').toLowerCase();
             const isProcessing =
               registerMutation.isPending || withdrawMutation.isPending;
 
@@ -150,7 +153,7 @@ export default function LeagueSchedule({ leagueId }: LeagueScheduleProps) {
                 <div className="flex items-center justify-between gap-4">
                   <div className="flex-1">
                     <div className="flex items-center gap-2 mb-1 flex-wrap">
-                      <h3 className="text-white font-medium">{race.track}</h3>
+                      <h3 className="text-white font-medium">{trackLabel}</h3>
                       {isUpcoming && !isRegistered && (
                         <span className="px-2 py-0.5 text-xs font-medium bg-primary-blue/10 text-primary-blue rounded border border-primary-blue/30">
                           Upcoming
@@ -167,9 +170,9 @@ export default function LeagueSchedule({ leagueId }: LeagueScheduleProps) {
                         </span>
                       )}
                     </div>
-                    <p className="text-sm text-gray-400">{race.car}</p>
+                    <p className="text-sm text-gray-400">{carLabel}</p>
                     <div className="flex items-center gap-3 mt-2">
-                      <p className="text-xs text-gray-500 uppercase">{race.sessionType}</p>
+                      <p className="text-xs text-gray-500 uppercase">{sessionTypeLabel}</p>
                     </div>
                   </div>