@jmruthers/pace-core 0.6.4 → 0.6.6

package/src/hooks/__tests__/usePublicEvent.test.ts

@@ -14,22 +14,23 @@ vi.mock('../../components/PublicLayout/PublicPageProvider', () => ({
   }))
 }));
 
-// Mock Supabase client
+// Mock Supabase client with proper query builder chain
+// usePublicEvent uses: .from('core_events').select(...).eq(...).eq(...).not(...).limit(1).single()
+const createMockQueryBuilder = (mockData: any = null, mockError: any = null) => {
+  const builder: any = {
+    select: vi.fn().mockReturnThis(),
+    eq: vi.fn().mockReturnThis(),
+    not: vi.fn().mockReturnThis(),
+    limit: vi.fn().mockReturnThis(),
+    single: vi.fn().mockResolvedValue({ data: mockData, error: mockError }),
+    maybeSingle: vi.fn().mockResolvedValue({ data: mockData, error: mockError })
+  };
+  return builder;
+};
+
 const mockSupabaseClient = {
-  rpc: vi.fn(),
-  from: vi.fn(() => ({
-    select: vi.fn(() => ({
-      eq: vi.fn(() => ({
-        eq: vi.fn(() => ({
-          not: vi.fn(() => ({
-            limit: vi.fn(() => ({
-              single: vi.fn()
-            }))
-          }))
-        }))
-      }))
-    }))
-  }))
+  rpc: vi.fn().mockResolvedValue({ data: null, error: null }),
+  from: vi.fn(() => createMockQueryBuilder())
 };
 
 // Helper to create table query mocks
@@ -131,16 +132,24 @@ describe('usePublicEvent', () => {
         event_logo: null
       };
 
-      mockSupabaseClient.rpc.mockResolvedValueOnce({
-        data: [mockEventData],
-        error: null
+      // usePublicEvent makes TWO queries: core_events + core_file_references (logo)
+      const mockEventQueryBuilder = createMockQueryBuilder({
+        ...mockEventData,
+        event_code: 'test-event',
+        is_visible: true,
+        created_at: '2024-01-01T00:00:00Z',
+        updated_at: '2024-01-01T00:00:00Z'
       });
+      const mockLogoQueryBuilder = createMockQueryBuilder(null, null); // No logo
+      mockSupabaseClient.from
+        .mockReturnValueOnce(mockEventQueryBuilder) // First call: core_events
+        .mockReturnValueOnce(mockLogoQueryBuilder); // Second call: core_file_references
 
       const { result } = renderHook(() => usePublicEvent('test-event'));
 
       await waitFor(() => {
         expect(result.current.isLoading).toBe(false);
-      }, { interval: 10 });
+      }, { interval: 10, timeout: 2000 });
 
       expect(result.current.event).toEqual({
         id: '123',
@@ -161,19 +170,18 @@ describe('usePublicEvent', () => {
     });
 
     it('should handle event not found', async () => {
-      mockSupabaseClient.rpc.mockResolvedValueOnce({
-        data: [],
-        error: null
-      });
+      // Mock query returning null (event not found)
+      const mockQueryBuilder = createMockQueryBuilder(null, { code: 'PGRST116', message: 'No rows found' });
+      mockSupabaseClient.from.mockReturnValue(mockQueryBuilder);
 
       const { result } = renderHook(() => usePublicEvent('nonexistent-event'));
 
       await waitFor(() => {
         expect(result.current.isLoading).toBe(false);
-      }, { interval: 10 });
+      }, { interval: 10, timeout: 2000 });
 
       expect(result.current.event).toBe(null);
-      expect(result.current.error).toEqual(new Error('Event not found'));
+      expect(result.current.error?.message).toBe('Event not found');
     });
 
     it('should handle invalid event code', async () => {
@@ -210,22 +218,30 @@ describe('usePublicEvent', () => {
         event_email: 'event@example.com'
       };
 
-      mockSupabaseClient.rpc.mockResolvedValueOnce({
-        data: [mockEventData],
-        error: null
+      // usePublicEvent makes TWO queries: core_events + core_file_references (logo)
+      const mockEventQueryBuilder = createMockQueryBuilder({
+        ...mockEventData,
+        event_code: 'test-event',
+        is_visible: true,
+        created_at: '2024-01-01T00:00:00Z',
+        updated_at: '2024-01-01T00:00:00Z'
       });
+      const mockLogoQueryBuilder = createMockQueryBuilder(null, null);
+      mockSupabaseClient.from
+        .mockReturnValueOnce(mockEventQueryBuilder)
+        .mockReturnValueOnce(mockLogoQueryBuilder);
 
       const { result, rerender } = renderHook(() => usePublicEvent('test-event'));
 
       await waitFor(() => {
         expect(result.current.isLoading).toBe(false);
-      }, { interval: 10 });
+      }, { interval: 10, timeout: 2000 });
 
-      // Rerender with same event code - should use cache
+      // Rerender with same event code - should use cache (no new queries)
       rerender();
       
-      // Should not call RPC again
-      expect(mockSupabaseClient.rpc).toHaveBeenCalledTimes(1);
+      // Should not call query again (cached) - only initial fetch: 2 calls (event + logo)
+      expect(mockSupabaseClient.from).toHaveBeenCalledTimes(2);
     });
 
     it('should respect cache TTL', async () => {
@@ -248,28 +264,40 @@ describe('usePublicEvent', () => {
         event_email: 'event@example.com'
       };
 
-      mockSupabaseClient.rpc.mockResolvedValueOnce({
-        data: [mockEventData],
-        error: null
+      // usePublicEvent makes TWO queries: core_events + core_file_references (logo)
+      const mockEventQueryBuilder = createMockQueryBuilder({
+        ...mockEventData,
+        event_code: 'test-event',
+        is_visible: true,
+        created_at: '2024-01-01T00:00:00Z',
+        updated_at: '2024-01-01T00:00:00Z'
       });
+      const mockLogoQueryBuilder = createMockQueryBuilder(null, null); // No logo
+      // Need mocks for both hook instances: initial (2 calls) + after cache expires (2 calls) = 4 total
+      mockSupabaseClient.from
+        .mockReturnValueOnce(mockEventQueryBuilder) // First hook: event
+        .mockReturnValueOnce(mockLogoQueryBuilder)  // First hook: logo
+        .mockReturnValueOnce(mockEventQueryBuilder) // Second hook (after cache expires): event
+        .mockReturnValueOnce(mockLogoQueryBuilder); // Second hook (after cache expires): logo
 
       const { result } = renderHook(() => usePublicEvent('test-event', { cacheTtl: 100 }));
 
       await waitFor(() => {
         expect(result.current.isLoading).toBe(false);
-      }, { interval: 10 });
+      }, { interval: 10, timeout: 2000 });
 
       // Wait for cache to expire
       await new Promise(resolve => setTimeout(resolve, 150));
 
-      // Rerender should fetch again
+      // New hook instance should fetch again (cache expired)
       const { result: result2 } = renderHook(() => usePublicEvent('test-event', { cacheTtl: 100 }));
       
       await waitFor(() => {
         expect(result2.current.isLoading).toBe(false);
-      }, { interval: 10 });
+      }, { interval: 10, timeout: 2000 });
 
-      expect(mockSupabaseClient.rpc).toHaveBeenCalledTimes(2);
+      // Each fetch makes 2 calls (event + logo), so 2 fetches = 4 calls
+      expect(mockSupabaseClient.from).toHaveBeenCalledTimes(4);
     });
 
     it('should disable caching when requested', async () => {
@@ -297,14 +325,33 @@ describe('usePublicEvent', () => {
       const { clearPublicEventCache } = await import('../public/usePublicEvent');
       clearPublicEventCache();
 
-      // Use mockImplementation to handle multiple calls
+      // usePublicEvent makes TWO queries per fetch: core_events + core_file_references (logo)
       let callCount = 0;
-      mockSupabaseClient.rpc.mockImplementation(() => {
+      const mockEventQueryBuilder1 = createMockQueryBuilder({
+        ...mockEventData,
+        event_code: 'test-event',
+        is_visible: true,
+        created_at: '2024-01-01T00:00:00Z',
+        updated_at: '2024-01-01T00:00:00Z'
+      });
+      const mockLogoQueryBuilder1 = createMockQueryBuilder(null, null);
+      const mockEventQueryBuilder2 = createMockQueryBuilder({
+        ...mockEventData,
+        event_code: 'test-event-2',
+        is_visible: true,
+        created_at: '2024-01-01T00:00:00Z',
+        updated_at: '2024-01-01T00:00:00Z'
+      });
+      const mockLogoQueryBuilder2 = createMockQueryBuilder(null, null);
+      
+      mockSupabaseClient.from.mockImplementation(() => {
         callCount++;
-        return Promise.resolve({
-          data: [mockEventData],
-          error: null
-        });
+        // First fetch: event1 + logo1, Second fetch: event2 + logo2
+        if (callCount <= 2) {
+          return callCount === 1 ? mockEventQueryBuilder1 : mockLogoQueryBuilder1;
+        } else {
+          return callCount === 3 ? mockEventQueryBuilder2 : mockLogoQueryBuilder2;
+        }
       });
 
       const { result, rerender } = renderHook(
@@ -314,44 +361,39 @@ describe('usePublicEvent', () => {
 
       await waitFor(() => {
         expect(result.current.isLoading).toBe(false);
-      }, { interval: 10 });
+      }, { interval: 10, timeout: 2000 });
 
       // Change the event code to force a new fetch
       rerender({ eventCode: 'test-event-2' });
       
       await waitFor(() => {
         expect(result.current.isLoading).toBe(false);
-      }, { interval: 10 });
+      }, { interval: 10, timeout: 2000 });
 
-      expect(callCount).toBe(2);
+      // Each fetch makes 2 calls (event + logo), so 2 fetches = 4 calls
+      expect(callCount).toBe(4);
     });
   });
 
   describe('Error Handling', () => {
-    it('should handle RPC errors', async () => {
-      // Mock the RPC call to return an error object
+    it('should handle query errors', async () => {
+      // usePublicEvent uses table query, not RPC
       const testError = { message: 'Database error', details: 'Test error details', hint: null, code: 'TEST_ERROR' };
-      mockSupabaseClient.rpc.mockImplementation(() => 
-        Promise.resolve({
-          data: null,
-          error: testError
-        })
-      );
+      const mockQueryBuilder = createMockQueryBuilder(null, testError);
+      mockSupabaseClient.from.mockReturnValue(mockQueryBuilder);
 
       const { result } = renderHook(() => usePublicEvent('test-event'));
 
       await waitFor(() => {
         expect(result.current.isLoading).toBe(false);
-      }, { interval: 10 });
+      }, { interval: 10, timeout: 2000 });
 
       expect(result.current.error).toBeInstanceOf(Error);
       expect(result.current.error?.message).toBe('Database error');
       expect(result.current.event).toBe(null);
       
-      // Verify the mock was called
-      expect(mockSupabaseClient.rpc).toHaveBeenCalledWith('get_public_event_by_code', {
-        event_code_param: 'test-event'
-      });
+      // Verify the mock was called (usePublicEvent uses table queries, not RPC)
+      expect(mockSupabaseClient.from).toHaveBeenCalled();
     });
 
     it('should handle missing Supabase client', async () => {
@@ -411,16 +453,24 @@ describe('usePublicEvent', () => {
         event_logo: null
       };
 
-      mockSupabaseClient.rpc.mockResolvedValueOnce({
-        data: [mockEventData],
-        error: null
+      // usePublicEvent makes TWO queries: core_events + core_file_references (logo)
+      const mockEventQueryBuilder = createMockQueryBuilder({
+        ...mockEventData,
+        event_code: 'test-event',
+        is_visible: true,
+        created_at: '2024-01-01T00:00:00Z',
+        updated_at: '2024-01-01T00:00:00Z'
       });
+      const mockLogoQueryBuilder = createMockQueryBuilder(null, null);
+      mockSupabaseClient.from
+        .mockReturnValueOnce(mockEventQueryBuilder)
+        .mockReturnValueOnce(mockLogoQueryBuilder);
 
       const { result } = renderHook(() => usePublicEvent('test-event'));
 
       await waitFor(() => {
         expect(result.current.isLoading).toBe(false);
-      }, { interval: 10 });
+      }, { interval: 10, timeout: 2000 });
 
       expect(result.current.event).toBeTruthy();
     });
@@ -447,23 +497,34 @@ describe('usePublicEvent', () => {
         event_email: 'event@example.com'
       };
 
-      mockSupabaseClient.rpc.mockResolvedValue({
-        data: [mockEventData],
-        error: null
+      // usePublicEvent makes TWO queries per fetch: core_events + core_file_references (logo)
+      const mockEventQueryBuilder = createMockQueryBuilder({
+        ...mockEventData,
+        event_code: 'test-event',
+        is_visible: true,
+        created_at: '2024-01-01T00:00:00Z',
+        updated_at: '2024-01-01T00:00:00Z'
       });
+      const mockLogoQueryBuilder = createMockQueryBuilder(null, null);
+      mockSupabaseClient.from
+        .mockReturnValueOnce(mockEventQueryBuilder)
+        .mockReturnValueOnce(mockLogoQueryBuilder)
+        .mockReturnValueOnce(mockEventQueryBuilder) // Refetch: event
+        .mockReturnValueOnce(mockLogoQueryBuilder); // Refetch: logo
 
       const { result } = renderHook(() => usePublicEvent('test-event'));
 
       await waitFor(() => {
         expect(result.current.isLoading).toBe(false);
-      }, { interval: 10 });
+      }, { interval: 10, timeout: 2000 });
 
       // Call refetch
       await act(async () => {
         await result.current.refetch();
       });
 
-      expect(mockSupabaseClient.rpc).toHaveBeenCalledTimes(2);
+      // Initial fetch (2 calls) + refetch (2 calls) = 4 total
+      expect(mockSupabaseClient.from).toHaveBeenCalledTimes(4);
     });
 
     it('should clear cache when refetch is called', async () => {
@@ -486,24 +547,30 @@ describe('usePublicEvent', () => {
         event_email: 'event@example.com'
       };
 
-      mockSupabaseClient.rpc.mockResolvedValue({
-        data: [mockEventData],
-        error: null
+      // usePublicEvent uses table query, not RPC
+      const mockQueryBuilder = createMockQueryBuilder({
+        ...mockEventData,
+        event_code: 'test-event',
+        is_visible: true,
+        created_at: '2024-01-01T00:00:00Z',
+        updated_at: '2024-01-01T00:00:00Z'
       });
+      mockSupabaseClient.from.mockReturnValue(mockQueryBuilder);
 
       const { result } = renderHook(() => usePublicEvent('test-event'));
 
       await waitFor(() => {
         expect(result.current.isLoading).toBe(false);
-      }, { interval: 10 });
+      }, { interval: 10, timeout: 2000 });
 
       // Call refetch
       await act(async () => {
         await result.current.refetch();
       });
 
-      // Should call RPC again (cache was cleared)
-      expect(mockSupabaseClient.rpc).toHaveBeenCalledTimes(2);
+      // Should call query again (cache was cleared)
+      // Each fetch makes 2 calls (event + logo), so 2 fetches = 4 calls
+      expect(mockSupabaseClient.from).toHaveBeenCalledTimes(4);
     });
   });
 
@@ -531,7 +598,8 @@ describe('usePublicEvent', () => {
 
   describe('Edge Cases', () => {
     it('should handle null event data from RPC', async () => {
-      mockSupabaseClient.rpc.mockResolvedValueOnce({
+      // Use table query mock instead of RPC
+      const mockQueryBuilder = createMockQueryBuilder({
         data: null,
         error: null
       });
@@ -547,7 +615,8 @@ describe('usePublicEvent', () => {
     });
 
     it('should handle empty event data array from RPC', async () => {
-      mockSupabaseClient.rpc.mockResolvedValueOnce({
+      // Use table query mock instead of RPC
+      const mockQueryBuilder = createMockQueryBuilder({
         data: [],
         error: null
       });
@@ -563,7 +632,8 @@ describe('usePublicEvent', () => {
     });
 
     it('should handle undefined event data from RPC', async () => {
-      mockSupabaseClient.rpc.mockResolvedValueOnce({
+      // Use table query mock instead of RPC
+      const mockQueryBuilder = createMockQueryBuilder({
         data: [undefined],
         error: null
       });