di usage in website

apps/website/app/races/[id]/page.test.tsx

@@ -39,23 +39,66 @@ vi.mock('@/components/sponsors/SponsorInsightsCard', () => ({
   useSponsorMode: () => false,
 }));
 
-// Mock services hook to provide raceService and leagueMembershipService
+// Mock the new DI hooks
 const mockGetRaceDetails = vi.fn();
 const mockReopenRace = vi.fn();
 const mockFetchLeagueMemberships = vi.fn();
 const mockGetMembership = vi.fn();
 
-vi.mock('@/lib/services/ServiceProvider', () => ({
-  useServices: () => ({
-    raceService: {
-      getRaceDetails: mockGetRaceDetails,
-      reopenRace: mockReopenRace,
-      // other methods are not used in this test
-    },
-    leagueMembershipService: {
-      fetchLeagueMemberships: mockFetchLeagueMemberships,
-      getMembership: mockGetMembership,
-    },
+// Mock race detail hook
+vi.mock('@/hooks/race/useRaceDetail', () => ({
+  useRaceDetail: (raceId: string, driverId: string) => ({
+    data: mockGetRaceDetails.mock.results[0]?.value || null,
+    isLoading: false,
+    isError: false,
+    isSuccess: !!mockGetRaceDetails.mock.results[0]?.value,
+    refetch: vi.fn(),
+    retry: vi.fn(),
+  }),
+}));
+
+// Mock reopen race hook
+vi.mock('@/hooks/race/useReopenRace', () => ({
+  useReopenRace: () => ({
+    mutateAsync: mockReopenRace,
+    mutate: mockReopenRace,
+    isPending: false,
+    isLoading: false,
+  }),
+}));
+
+// Mock league membership service static method
+vi.mock('@/lib/services/leagues/LeagueMembershipService', () => ({
+  LeagueMembershipService: {
+    getMembership: mockGetMembership,
+    fetchLeagueMemberships: mockFetchLeagueMemberships,
+    setLeagueMemberships: vi.fn(),
+    clearLeagueMemberships: vi.fn(),
+    getCachedMembershipsIterator: vi.fn(() => [][Symbol.iterator]()),
+    getAllMembershipsForDriver: vi.fn(() => []),
+    getLeagueMembers: vi.fn(() => []),
+  },
+}));
+
+// Mock league membership hook (if used by component)
+vi.mock('@/hooks/league/useLeagueMemberships', () => ({
+  useLeagueMemberships: (leagueId: string, currentUserId: string) => ({
+    data: mockFetchLeagueMemberships.mock.results[0]?.value || null,
+    isLoading: false,
+    isError: false,
+    isSuccess: !!mockFetchLeagueMemberships.mock.results[0]?.value,
+    refetch: vi.fn(),
+  }),
+}));
+
+// Mock the useLeagueMembership hook that the component imports
+vi.mock('@/hooks/useLeagueMembershipService', () => ({
+  useLeagueMembership: (leagueId: string, driverId: string) => ({
+    data: mockGetMembership.mock.results[0]?.value || null,
+    isLoading: false,
+    isError: false,
+    isSuccess: !!mockGetMembership.mock.results[0]?.value,
+    refetch: vi.fn(),
   }),
 }));
 
@@ -122,7 +165,7 @@ describe('RaceDetailPage - Re-open Race behavior', () => {
     mockGetMembership.mockReset();
     mockIsOwnerOrAdmin.mockReset();
 
-    // Set up default mock implementations for services
+    // Set up default mock implementations
     mockFetchLeagueMemberships.mockResolvedValue(undefined);
     mockGetMembership.mockReturnValue({ role: 'owner' }); // Return owner role by default
   });
@@ -131,8 +174,9 @@ describe('RaceDetailPage - Re-open Race behavior', () => {
     mockIsOwnerOrAdmin.mockReturnValue(true);
     const viewModel = createViewModel('completed');
 
-    // Mock the service to return the right data
-    mockGetRaceDetails.mockResolvedValue(viewModel);
+    // Mock the hooks to return the right data
+    mockGetRaceDetails.mockReturnValue(viewModel);
+    mockGetMembership.mockReturnValue({ role: 'owner' });
     mockReopenRace.mockResolvedValue(undefined);
 
     const confirmSpy = vi.spyOn(window, 'confirm').mockReturnValue(true);
@@ -162,7 +206,8 @@ describe('RaceDetailPage - Re-open Race behavior', () => {
     mockIsOwnerOrAdmin.mockReturnValue(false);
     const viewModel = createViewModel('completed');
 
-    mockGetRaceDetails.mockResolvedValue(viewModel);
+    mockGetRaceDetails.mockReturnValue(viewModel);
+    mockGetMembership.mockReturnValue({ role: 'member' });
 
     renderWithQueryClient(<RaceDetailInteractive />);
 
@@ -178,7 +223,8 @@ describe('RaceDetailPage - Re-open Race behavior', () => {
     mockIsOwnerOrAdmin.mockReturnValue(true);
     const viewModel = createViewModel('scheduled');
 
-    mockGetRaceDetails.mockResolvedValue(viewModel);
+    mockGetRaceDetails.mockReturnValue(viewModel);
+    mockGetMembership.mockReturnValue({ role: 'owner' });
 
     renderWithQueryClient(<RaceDetailInteractive />);