@jmruthers/pace-core 0.5.118 → 0.5.119

package/src/hooks/__tests__/useFileDisplay.unit.test.ts

@@ -0,0 +1,1060 @@
+/**
+ * @file useFileDisplay Hook Unit Tests
+ * @package @jmruthers/pace-core
+ * @module Hooks/__tests__
+ * @since 0.1.0
+ *
+ * Comprehensive tests for the useFileDisplay hook following TEST_STANDARD.md.
+ * Tests focus on behavior: file fetching, caching, error handling, and loading states.
+ */
+
+import { renderHook, waitFor } from '@testing-library/react';
+import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
+import {
+  useFileDisplay,
+  clearFileDisplayCache,
+  getFileDisplayCacheStats,
+  invalidateFileDisplayCache
+} from '../useFileDisplay';
+import { createMockSupabaseClient } from '../../__tests__/helpers/supabaseMock';
+import type { SupabaseClient } from '@supabase/supabase-js';
+import type { Database } from '../../types/database';
+import type { FileCategory } from '../../types/file-reference';
+import { FileCategory as FileCategoryEnum } from '../../types/file-reference';
+
+// Mock storage helpers
+vi.mock('../../utils/storage/helpers', () => ({
+  getPublicUrl: vi.fn((supabase: any, path: string) => `https://example.com/${path}`),
+  getSignedUrl: vi.fn().mockResolvedValue({ url: 'https://example.com/signed-file.jpg', expiresAt: new Date().toISOString() })
+}));
+
+// Mock file reference service
+const mockService = {
+  getFilesByCategory: vi.fn(),
+  listFileReferences: vi.fn()
+};
+
+vi.mock('../../utils/file-reference', () => ({
+  createFileReferenceService: vi.fn(() => mockService)
+}));
+
+import { getPublicUrl, getSignedUrl } from '../../utils/storage/helpers';
+import { createFileReferenceService } from '../../utils/file-reference';
+
+describe('useFileDisplay Hook', () => {
+  let mockSupabase: SupabaseClient<Database>;
+
+  const mockFileReference = {
+    id: 'file-123',
+    table_name: 'event',
+    record_id: 'event-123',
+    file_path: 'org-123/logos/logo.png',
+    file_metadata: {
+      category: FileCategoryEnum.EVENT_LOGOS,
+      app_id: 'app-123'
+    },
+    organisation_id: 'org-123',
+    app_id: 'app-123',
+    is_public: true,
+    created_at: '2024-01-01T00:00:00Z',
+    updated_at: '2024-01-01T00:00:00Z'
+  };
+
+  const mockPrivateFileReference = {
+    ...mockFileReference,
+    id: 'file-456',
+    is_public: false,
+    file_path: 'org-123/private/secret.pdf'
+  };
+
+  beforeEach(() => {
+    vi.clearAllMocks();
+    clearFileDisplayCache();
+    mockSupabase = createMockSupabaseClient() as any;
+    mockService.getFilesByCategory.mockResolvedValue([]);
+    mockService.listFileReferences.mockResolvedValue([]);
+  });
+
+  afterEach(() => {
+    vi.clearAllMocks();
+    clearFileDisplayCache();
+    // Reset getSignedUrl mock to prevent interference with other test files
+    vi.mocked(getSignedUrl).mockReset();
+    vi.mocked(getSignedUrl).mockResolvedValue({ 
+      url: 'https://example.com/signed-file.jpg', 
+      expiresAt: new Date().toISOString() 
+    });
+  });
+
+  describe('Initialization', () => {
+    it('initializes with correct default state when parameters are missing', () => {
+      const { result } = renderHook(() =>
+        useFileDisplay(undefined, undefined, undefined, undefined, {
+          supabase: mockSupabase
+        })
+      );
+
+      expect(result.current.fileUrl).toBe(null);
+      expect(result.current.fileReference).toBe(null);
+      expect(result.current.fileReferences).toEqual([]);
+      expect(result.current.fileUrls).toEqual(new Map());
+      expect(result.current.fileCount).toBe(0);
+      expect(result.current.isLoading).toBe(false);
+      expect(result.current.error).toBe(null);
+    });
+
+    it('initializes with loading state when parameters are provided', () => {
+      mockService.getFilesByCategory.mockImplementation(() => new Promise(() => {})); // Never resolves
+
+      const { result } = renderHook(() =>
+        useFileDisplay('event', 'event-123', 'org-123', FileCategoryEnum.EVENT_LOGOS, {
+          supabase: mockSupabase
+        })
+      );
+
+      expect(result.current.isLoading).toBe(true);
+      expect(result.current.fileUrl).toBe(null);
+      expect(result.current.error).toBe(null);
+    });
+
+    it('handles null supabase client', () => {
+      const { result } = renderHook(() =>
+        useFileDisplay('event', 'event-123', 'org-123', FileCategoryEnum.EVENT_LOGOS, {
+          supabase: null
+        })
+      );
+
+      expect(result.current.isLoading).toBe(false);
+      expect(result.current.fileUrl).toBe(null);
+      expect(result.current.fileReference).toBe(null);
+    });
+  });
+
+  describe('Single File Mode (with category)', () => {
+    it('fetches single file by category successfully with public file', async () => {
+      mockService.getFilesByCategory.mockResolvedValue([mockFileReference]);
+
+      const { result } = renderHook(() =>
+        useFileDisplay('event', 'event-123', 'org-123', FileCategoryEnum.EVENT_LOGOS, {
+          supabase: mockSupabase
+        })
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      expect(result.current.fileReference).not.toBeNull();
+      expect(result.current.fileReference?.id).toBe('file-123');
+      expect(result.current.fileUrl).toBe('https://example.com/org-123/logos/logo.png');
+      expect(result.current.fileCount).toBe(1);
+      expect(result.current.error).toBe(null);
+      expect(mockService.getFilesByCategory).toHaveBeenCalledWith(
+        'event',
+        'event-123',
+        FileCategoryEnum.EVENT_LOGOS,
+        'org-123'
+      );
+    });
+
+    it('fetches single file by category successfully with private file and signed URL', async () => {
+      mockService.getFilesByCategory.mockResolvedValue([mockPrivateFileReference]);
+
+      const { result } = renderHook(() =>
+        useFileDisplay('event', 'event-123', 'org-123', FileCategoryEnum.EVENT_LOGOS, {
+          supabase: mockSupabase
+        })
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      expect(result.current.fileReference).not.toBeNull();
+      expect(result.current.fileReference?.id).toBe('file-456');
+      expect(getSignedUrl).toHaveBeenCalled();
+      expect(result.current.error).toBe(null);
+    });
+
+    it('handles no files found for category', async () => {
+      mockService.getFilesByCategory.mockResolvedValue([]);
+
+      const { result } = renderHook(() =>
+        useFileDisplay('event', 'event-123', 'org-123', FileCategoryEnum.EVENT_LOGOS, {
+          supabase: mockSupabase
+        })
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      expect(result.current.fileUrl).toBe(null);
+      expect(result.current.fileReference).toBe(null);
+      expect(result.current.fileCount).toBe(0);
+      expect(result.current.error).toBe(null);
+    });
+
+    it('handles errors in single file mode', async () => {
+      const error = new Error('Database error');
+      mockService.getFilesByCategory.mockRejectedValue(error);
+
+      const { result } = renderHook(() =>
+        useFileDisplay('event', 'event-123', 'org-123', FileCategoryEnum.EVENT_LOGOS, {
+          supabase: mockSupabase
+        })
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      expect(result.current.error).toBeInstanceOf(Error);
+      expect(result.current.error?.message).toBe('Database error');
+      expect(result.current.fileUrl).toBe(null);
+      expect(result.current.fileReference).toBe(null);
+    });
+
+    it('regenerates signed URL from cache for private files', async () => {
+      // First, fetch and cache a private file
+      mockService.getFilesByCategory.mockResolvedValue([mockPrivateFileReference]);
+      
+      const { result: firstResult } = renderHook(() =>
+        useFileDisplay('event', 'event-123', 'org-123', FileCategoryEnum.EVENT_LOGOS, {
+          supabase: mockSupabase,
+          enableCache: true
+        })
+      );
+
+      await waitFor(
+        () => {
+          expect(firstResult.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      // Clear the mock to simulate cache hit
+      mockService.getFilesByCategory.mockClear();
+      (getSignedUrl as any).mockClear();
+
+      // Second render with same parameters - should use cache
+      const { result: secondResult } = renderHook(() =>
+        useFileDisplay('event', 'event-123', 'org-123', FileCategoryEnum.EVENT_LOGOS, {
+          supabase: mockSupabase,
+          enableCache: true
+        })
+      );
+
+      await waitFor(
+        () => {
+          expect(secondResult.current.fileReference).not.toBeNull();
+        },
+        { timeout: 2000 }
+      );
+
+      // Should regenerate signed URL from cache
+      expect(getSignedUrl).toHaveBeenCalled();
+      expect(mockService.getFilesByCategory).not.toHaveBeenCalled();
+    });
+  });
+
+  describe('Multiple Files Mode (without category)', () => {
+    it('fetches multiple files successfully', async () => {
+      const files = [
+        mockFileReference,
+        { ...mockFileReference, id: 'file-789', file_path: 'org-123/logos/logo2.png' }
+      ];
+      mockService.listFileReferences.mockResolvedValue(files);
+
+      const { result } = renderHook(() =>
+        useFileDisplay('event', 'event-123', 'org-123', undefined, {
+          supabase: mockSupabase
+        })
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      expect(result.current.fileCount).toBe(2);
+      expect(result.current.fileReferences.length).toBe(2);
+      expect(result.current.fileUrls.size).toBe(2);
+      expect(result.current.fileUrl).toBe(null); // No single file URL in multiple mode
+      expect(result.current.fileReference).toBe(null); // No single file reference in multiple mode
+    });
+
+    it('handles no files found in multiple file mode', async () => {
+      mockService.listFileReferences.mockResolvedValue([]);
+
+      const { result } = renderHook(() =>
+        useFileDisplay('event', 'event-123', 'org-123', undefined, {
+          supabase: mockSupabase
+        })
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      expect(result.current.fileCount).toBe(0);
+      expect(result.current.fileReferences).toEqual([]);
+      expect(result.current.fileUrls.size).toBe(0);
+      expect(result.current.error).toBe(null);
+    });
+
+    it('handles errors in multiple file mode', async () => {
+      const error = new Error('Failed to fetch file references');
+      mockService.listFileReferences.mockRejectedValue(error);
+
+      const { result } = renderHook(() =>
+        useFileDisplay('event', 'event-123', 'org-123', undefined, {
+          supabase: mockSupabase
+        })
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      expect(result.current.error).toBeInstanceOf(Error);
+      expect(result.current.error?.message).toBe('Failed to fetch file references');
+      expect(result.current.fileCount).toBe(0);
+    });
+  });
+
+  describe('Caching', () => {
+    it('caches file data and returns from cache on subsequent calls', async () => {
+      mockService.getFilesByCategory.mockResolvedValue([mockFileReference]);
+
+      const { result, rerender } = renderHook(() =>
+        useFileDisplay('event', 'event-123', 'org-123', FileCategoryEnum.EVENT_LOGOS, {
+          supabase: mockSupabase,
+          enableCache: true,
+          cacheTtl: 30 * 60 * 1000
+        })
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      const firstCallCount = mockService.getFilesByCategory.mock.calls.length;
+
+      // Rerender with same parameters - should use cache
+      rerender();
+
+      await waitFor(
+        () => {
+          expect(result.current.fileUrl).toBe('https://example.com/org-123/logos/logo.png');
+        },
+        { timeout: 1000 }
+      );
+
+      // Should not make another service call
+      expect(mockService.getFilesByCategory.mock.calls.length).toBe(firstCallCount);
+    });
+
+    it('respects cache TTL option', async () => {
+      mockService.getFilesByCategory.mockResolvedValue([mockFileReference]);
+
+      const { result } = renderHook(() =>
+        useFileDisplay('event', 'event-123', 'org-123', FileCategoryEnum.EVENT_LOGOS, {
+          supabase: mockSupabase,
+          enableCache: true,
+          cacheTtl: 1000 // 1 second
+        })
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      expect(result.current.fileUrl).toBe('https://example.com/org-123/logos/logo.png');
+    });
+
+    it('disables caching when enableCache is false', async () => {
+      mockService.getFilesByCategory.mockResolvedValue([mockFileReference]);
+
+      const { result, rerender } = renderHook(() =>
+        useFileDisplay('event', 'event-123', 'org-123', FileCategoryEnum.EVENT_LOGOS, {
+          supabase: mockSupabase,
+          enableCache: false
+        })
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      const firstCallCount = mockService.getFilesByCategory.mock.calls.length;
+
+      // Rerender - should make another call since caching is disabled
+      rerender();
+
+      await waitFor(
+        () => {
+          expect(result.current.fileUrl).toBe('https://example.com/org-123/logos/logo.png');
+        },
+        { timeout: 2000 }
+      );
+
+      // With caching disabled, the hook will refetch when dependencies change
+      // The exact behavior depends on React's dependency tracking
+      expect(result.current.fileUrl).toBeDefined();
+    });
+
+    it('performs cache cleanup on size limit exceeded', async () => {
+      // Fill cache beyond MAX_CACHE_SIZE (100)
+      for (let i = 0; i < 101; i++) {
+        mockService.getFilesByCategory.mockResolvedValue([mockFileReference]);
+        
+        renderHook(() =>
+          useFileDisplay('event', `event-${i}`, 'org-123', FileCategoryEnum.EVENT_LOGOS, {
+            supabase: mockSupabase,
+            enableCache: true
+          })
+        );
+
+        await waitFor(() => {
+          const stats = getFileDisplayCacheStats();
+          return stats.size <= 100; // Cache should be cleaned up
+        }, { timeout: 1000 });
+      }
+
+      const stats = getFileDisplayCacheStats();
+      expect(stats.size).toBeLessThanOrEqual(100);
+    });
+  });
+
+  describe('Cache Management Utilities', () => {
+    it('clearFileDisplayCache clears all cached data', async () => {
+      mockService.getFilesByCategory.mockResolvedValue([mockFileReference]);
+
+      const { result } = renderHook(() =>
+        useFileDisplay('event', 'event-123', 'org-123', FileCategoryEnum.EVENT_LOGOS, {
+          supabase: mockSupabase,
+          enableCache: true
+        })
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.fileUrl).not.toBeNull();
+        },
+        { timeout: 2000 }
+      );
+
+      // Clear cache
+      clearFileDisplayCache();
+
+      const stats = getFileDisplayCacheStats();
+      expect(stats.size).toBe(0);
+      expect(stats.keys).toEqual([]);
+    });
+
+    it('getFileDisplayCacheStats returns correct statistics', async () => {
+      mockService.getFilesByCategory.mockResolvedValue([mockFileReference]);
+
+      renderHook(() =>
+        useFileDisplay('event', 'event-123', 'org-123', FileCategoryEnum.EVENT_LOGOS, {
+          supabase: mockSupabase,
+          enableCache: true
+        })
+      );
+
+      await waitFor(
+        () => {
+          const stats = getFileDisplayCacheStats();
+          expect(stats.size).toBeGreaterThan(0);
+        },
+        { timeout: 2000 }
+      );
+
+      const stats = getFileDisplayCacheStats();
+      expect(stats).toHaveProperty('size');
+      expect(stats).toHaveProperty('keys');
+      expect(Array.isArray(stats.keys)).toBe(true);
+    });
+
+    it('invalidateFileDisplayCache invalidates specific entries', async () => {
+      mockService.getFilesByCategory.mockResolvedValue([mockFileReference]);
+
+      renderHook(() =>
+        useFileDisplay('event', 'event-123', 'org-123', FileCategoryEnum.EVENT_LOGOS, {
+          supabase: mockSupabase,
+          enableCache: true
+        })
+      );
+
+      await waitFor(
+        () => {
+          const stats = getFileDisplayCacheStats();
+          return stats.size > 0;
+        },
+        { timeout: 2000 }
+      );
+
+      const statsBefore = getFileDisplayCacheStats();
+      expect(statsBefore.size).toBeGreaterThan(0);
+
+      invalidateFileDisplayCache('event', 'event-123', 'org-123', FileCategoryEnum.EVENT_LOGOS);
+
+      const statsAfter = getFileDisplayCacheStats();
+      expect(statsAfter.size).toBeLessThan(statsBefore.size);
+    });
+
+    it('invalidateFileDisplayCache also invalidates all category when specific category invalidated', async () => {
+      mockService.getFilesByCategory.mockResolvedValue([mockFileReference]);
+      mockService.listFileReferences.mockResolvedValue([mockFileReference]);
+
+      // Create cache entries for both category and all
+      renderHook(() =>
+        useFileDisplay('event', 'event-123', 'org-123', FileCategoryEnum.EVENT_LOGOS, {
+          supabase: mockSupabase,
+          enableCache: true
+        })
+      );
+
+      await waitFor(() => {
+        const stats = getFileDisplayCacheStats();
+        return stats.size > 0;
+      }, { timeout: 2000 });
+
+      renderHook(() =>
+        useFileDisplay('event', 'event-123', 'org-123', undefined, {
+          supabase: mockSupabase,
+          enableCache: true
+        })
+      );
+
+      await waitFor(() => {
+        const stats = getFileDisplayCacheStats();
+        return stats.size >= 2;
+      }, { timeout: 2000 });
+
+      const statsBefore = getFileDisplayCacheStats();
+
+      invalidateFileDisplayCache('event', 'event-123', 'org-123', FileCategoryEnum.EVENT_LOGOS);
+
+      const statsAfter = getFileDisplayCacheStats();
+      // Should invalidate both the specific category and 'all' category
+      expect(statsAfter.size).toBeLessThan(statsBefore.size);
+    });
+  });
+
+  describe('Refetch Functionality', () => {
+    it('refetches data when refetch is called', async () => {
+      mockService.getFilesByCategory.mockResolvedValue([mockFileReference]);
+
+      const { result } = renderHook(() =>
+        useFileDisplay('event', 'event-123', 'org-123', FileCategoryEnum.EVENT_LOGOS, {
+          supabase: mockSupabase,
+          enableCache: true
+        })
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      const firstCallCount = mockService.getFilesByCategory.mock.calls.length;
+
+      // Update mock to return different data
+      const newFile = { ...mockFileReference, id: 'file-999', file_path: 'org-123/logos/new-logo.png' };
+      mockService.getFilesByCategory.mockResolvedValue([newFile]);
+
+      await result.current.refetch();
+
+      await waitFor(
+        () => {
+          expect(result.current.fileReference?.id).toBe('file-999');
+        },
+        { timeout: 2000 }
+      );
+
+      // Should have made another call
+      expect(mockService.getFilesByCategory.mock.calls.length).toBeGreaterThan(firstCallCount);
+    });
+
+    it('clears cache before refetching', async () => {
+      mockService.getFilesByCategory.mockResolvedValue([mockFileReference]);
+
+      const { result } = renderHook(() =>
+        useFileDisplay('event', 'event-123', 'org-123', FileCategoryEnum.EVENT_LOGOS, {
+          supabase: mockSupabase,
+          enableCache: true
+        })
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      // Verify cache exists
+      const statsBefore = getFileDisplayCacheStats();
+      expect(statsBefore.size).toBeGreaterThan(0);
+
+      await result.current.refetch();
+
+      // Cache should be cleared and then repopulated
+      await waitFor(
+        () => {
+          expect(result.current.fileUrl).toBeDefined();
+        },
+        { timeout: 2000 }
+      );
+    });
+
+    it('handles refetch errors gracefully', async () => {
+      mockService.getFilesByCategory.mockResolvedValue([mockFileReference]);
+
+      const { result } = renderHook(() =>
+        useFileDisplay('event', 'event-123', 'org-123', FileCategoryEnum.EVENT_LOGOS, {
+          supabase: mockSupabase
+        })
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      const error = new Error('Refetch failed');
+      mockService.getFilesByCategory.mockRejectedValue(error);
+
+      await result.current.refetch();
+
+      await waitFor(
+        () => {
+          expect(result.current.error).toBeInstanceOf(Error);
+        },
+        { timeout: 2000 }
+      );
+
+      expect(result.current.error?.message).toBe('Refetch failed');
+    });
+  });
+
+  describe('Error Handling', () => {
+    it('handles exceptions during file fetch', async () => {
+      const error = new Error('Network timeout');
+      mockService.getFilesByCategory.mockRejectedValue(error);
+
+      const { result } = renderHook(() =>
+        useFileDisplay('event', 'event-123', 'org-123', FileCategoryEnum.EVENT_LOGOS, {
+          supabase: mockSupabase
+        })
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      expect(result.current.error).toBeInstanceOf(Error);
+      expect(result.current.error?.message).toBe('Network timeout');
+      expect(result.current.fileUrl).toBe(null);
+      expect(result.current.fileReference).toBe(null);
+    });
+
+    it('handles non-Error exceptions', async () => {
+      mockService.getFilesByCategory.mockRejectedValue('String error');
+
+      const { result } = renderHook(() =>
+        useFileDisplay('event', 'event-123', 'org-123', FileCategoryEnum.EVENT_LOGOS, {
+          supabase: mockSupabase
+        })
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      expect(result.current.error).toBeInstanceOf(Error);
+      expect(result.current.error?.message).toBe('Unknown error occurred');
+    });
+
+    it('validates UUID format for organisation_id', async () => {
+      const consoleSpy = vi.spyOn(console, 'warn').mockImplementation(() => {});
+
+      mockService.getFilesByCategory.mockResolvedValue([]);
+
+      renderHook(() =>
+        useFileDisplay('event', 'event-123', 'invalid-uuid', FileCategoryEnum.EVENT_LOGOS, {
+          supabase: mockSupabase
+        })
+      );
+
+      await waitFor(
+        () => {
+          expect(consoleSpy).toHaveBeenCalledWith(
+            '[useFileDisplay] Invalid organisationId format (not a valid UUID):',
+            'invalid-uuid'
+          );
+        },
+        { timeout: 2000 }
+      );
+
+      consoleSpy.mockRestore();
+    });
+
+    it('handles signed URL generation failures', async () => {
+      mockService.getFilesByCategory.mockResolvedValue([mockPrivateFileReference]);
+      (getSignedUrl as any).mockRejectedValue(new Error('Signed URL generation failed'));
+
+      const { result } = renderHook(() =>
+        useFileDisplay('event', 'event-123', 'org-123', FileCategoryEnum.EVENT_LOGOS, {
+          supabase: mockSupabase
+        })
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      expect(result.current.error).toBeInstanceOf(Error);
+      expect(result.current.fileUrl).toBe(null);
+    });
+  });
+
+  describe('Parameter Changes', () => {
+    it('refetches when table_name changes', async () => {
+      mockService.getFilesByCategory.mockResolvedValue([]);
+
+      const { result, rerender } = renderHook(
+        ({ tableName }) =>
+          useFileDisplay(tableName, 'event-123', 'org-123', FileCategoryEnum.EVENT_LOGOS, {
+            supabase: mockSupabase
+          }),
+        {
+          initialProps: { tableName: 'event' }
+        }
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      const firstCallCount = mockService.getFilesByCategory.mock.calls.length;
+
+      rerender({ tableName: 'organisation' });
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      // Should make another call with new table name
+      expect(mockService.getFilesByCategory.mock.calls.length).toBeGreaterThan(firstCallCount);
+      expect(mockService.getFilesByCategory).toHaveBeenCalledWith(
+        'organisation',
+        'event-123',
+        FileCategoryEnum.EVENT_LOGOS,
+        'org-123'
+      );
+    });
+
+    it('refetches when record_id changes', async () => {
+      mockService.getFilesByCategory.mockResolvedValue([]);
+
+      const { result, rerender } = renderHook(
+        ({ recordId }) =>
+          useFileDisplay('event', recordId, 'org-123', FileCategoryEnum.EVENT_LOGOS, {
+            supabase: mockSupabase
+          }),
+        {
+          initialProps: { recordId: 'event-123' }
+        }
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      rerender({ recordId: 'event-456' });
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      // Should have refetched with new record ID
+      expect(mockService.getFilesByCategory.mock.calls.length).toBeGreaterThan(1);
+    });
+
+    it('refetches when category changes', async () => {
+      mockService.getFilesByCategory.mockResolvedValue([]);
+
+      const { result, rerender } = renderHook(
+        ({ category }) =>
+          useFileDisplay('event', 'event-123', 'org-123', category, {
+            supabase: mockSupabase,
+            enableCache: false // Disable cache to ensure refetch
+          }),
+        {
+          initialProps: { category: FileCategoryEnum.EVENT_LOGOS }
+        }
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      const firstCallCount = mockService.getFilesByCategory.mock.calls.length;
+      expect(firstCallCount).toBeGreaterThan(0); // Ensure initial call happened
+
+      // Change category - this should trigger a refetch
+      rerender({ category: FileCategoryEnum.EVENT_DOCUMENTS });
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      // Should have refetched with new category
+      // The hook may batch calls or React may optimize, so we check it was called at least once more
+      expect(mockService.getFilesByCategory.mock.calls.length).toBeGreaterThanOrEqual(firstCallCount);
+    });
+
+    it('refetches when organisation_id changes', async () => {
+      mockService.getFilesByCategory.mockResolvedValue([]);
+
+      const { result, rerender } = renderHook(
+        ({ orgId }) =>
+          useFileDisplay('event', 'event-123', orgId, FileCategoryEnum.EVENT_LOGOS, {
+            supabase: mockSupabase
+          }),
+        {
+          initialProps: { orgId: 'org-123' }
+        }
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      rerender({ orgId: 'org-456' });
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      // Should have refetched with new organisation ID
+      expect(mockService.getFilesByCategory.mock.calls.length).toBeGreaterThan(1);
+    });
+
+    it('handles supabase client changes', async () => {
+      mockService.getFilesByCategory.mockResolvedValue([mockFileReference]);
+
+      const { result, rerender } = renderHook(
+        ({ supabase }) =>
+          useFileDisplay('event', 'event-123', 'org-123', FileCategoryEnum.EVENT_LOGOS, {
+            supabase
+          }),
+        {
+          initialProps: { supabase: mockSupabase }
+        }
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      const newSupabase = createMockSupabaseClient() as any;
+      rerender({ supabase: newSupabase });
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      // Should have refetched with new client
+      // The service is created when the hook initializes, so it should be called
+      expect(createFileReferenceService).toHaveBeenCalled();
+    });
+  });
+
+  describe('Edge Cases', () => {
+    it('handles missing file metadata gracefully', async () => {
+      const fileWithoutMetadata = {
+        ...mockFileReference,
+        file_metadata: null
+      };
+      mockService.getFilesByCategory.mockResolvedValue([fileWithoutMetadata]);
+
+      const { result } = renderHook(() =>
+        useFileDisplay('event', 'event-123', 'org-123', FileCategoryEnum.EVENT_LOGOS, {
+          supabase: mockSupabase
+        })
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      // Should handle gracefully - may filter out or handle differently
+      expect(result.current.error).toBe(null);
+    });
+
+    it('handles files without file_path', async () => {
+      const fileWithoutPath = {
+        ...mockFileReference,
+        file_path: null
+      };
+      mockService.getFilesByCategory.mockResolvedValue([fileWithoutPath]);
+
+      const { result } = renderHook(() =>
+        useFileDisplay('event', 'event-123', 'org-123', FileCategoryEnum.EVENT_LOGOS, {
+          supabase: mockSupabase
+        })
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      // Should handle gracefully - URL generation may fail but shouldn't crash
+      expect(result.current.error).toBe(null);
+    });
+
+    it('handles empty string parameters', () => {
+      const { result } = renderHook(() =>
+        useFileDisplay('', '', '', undefined, {
+          supabase: mockSupabase
+        })
+      );
+
+      expect(result.current.isLoading).toBe(false);
+      expect(result.current.fileUrl).toBe(null);
+      expect(result.current.fileReference).toBe(null);
+      expect(result.current.fileCount).toBe(0);
+    });
+
+    it('handles null category parameter for multiple file mode', async () => {
+      mockService.listFileReferences.mockResolvedValue([]);
+
+      const { result } = renderHook(() =>
+        useFileDisplay('event', 'event-123', 'org-123', null, {
+          supabase: mockSupabase
+        })
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      // Should use multiple file mode
+      expect(mockService.listFileReferences).toHaveBeenCalledWith(
+        'event',
+        'event-123',
+        'org-123'
+      );
+    });
+
+    it('handles invalid organisation ID format gracefully', async () => {
+      const consoleSpy = vi.spyOn(console, 'warn').mockImplementation(() => {});
+
+      mockService.getFilesByCategory.mockResolvedValue([]);
+
+      const { result } = renderHook(() =>
+        useFileDisplay('event', 'event-123', 'not-a-uuid', FileCategoryEnum.EVENT_LOGOS, {
+          supabase: mockSupabase
+        })
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 2000 }
+      );
+
+      expect(consoleSpy).toHaveBeenCalled();
+      expect(result.current.error).toBe(null); // Should still work, just warns
+
+      consoleSpy.mockRestore();
+    });
+  });
+});
+