@jmruthers/pace-core 0.5.181 → 0.5.182

package/src/components/FileDisplay/FileDisplay.test.tsx

@@ -3,14 +3,23 @@ import { renderWithProviders, screen, userEvent, act, waitFor } from '../../__te
 import { FileDisplay } from './FileDisplay';
 import { createMockSupabaseClient } from '../../__tests__/helpers/test-utils';
 import { UnifiedAuthProvider } from '../../providers/services/UnifiedAuthProvider';
+import { FileCategory } from '../../types/file-reference';
+import type { SupabaseClient } from '@supabase/supabase-js';
+import { vi } from 'vitest';
 
-const supabase = createMockSupabaseClient() as any;
+const supabase = createMockSupabaseClient() as unknown as SupabaseClient;
 
-// Mock useIsPublicPage to return false so FileDisplay uses authenticated version
-vi.mock('../PublicLayout/PublicPageProvider', () => ({
-  useIsPublicPage: vi.fn(() => false),
-  PublicPageContext: React.createContext(null)
-}));
+const mockUseIsPublicPage = vi.hoisted(() => vi.fn(() => false));
+const publicPageContextStore = vi.hoisted(() => ({ value: null as React.Context<any> | null }));
+
+// Mock useIsPublicPage to return false so FileDisplay uses authenticated version by default
+vi.mock('../PublicLayout/PublicPageProvider', () => {
+  publicPageContextStore.value = React.createContext(null);
+  return {
+    useIsPublicPage: (...args: unknown[]) => mockUseIsPublicPage(...args),
+    PublicPageContext: publicPageContextStore.value,
+  };
+});
 
 vi.mock('../../hooks/useFileReference', () => ({
   useFileReferenceForRecord: vi.fn(),
@@ -26,15 +35,19 @@ vi.mock('../../hooks/useFileDisplay', () => ({
   useFileDisplay: vi.fn()
 }));
 
+vi.mock('../../hooks/public/usePublicFileDisplay', () => ({
+  usePublicFileDisplay: vi.fn()
+}));
+
 vi.mock('../../utils/storage/helpers', () => ({
   getPublicUrl: vi.fn((_, path: string) => `https://example.com/${path}`),
-  getSignedUrl: vi.fn(async (_: any, path: string) => ({ url: `https://signed.example.com/${path}` })),
+  getSignedUrl: vi.fn(async (_: unknown, path: string) => ({ url: `https://signed.example.com/${path}` })),
 }));
 
 // Helper to render with UnifiedAuthProvider
 const renderWithUnifiedAuth = (ui: React.ReactElement) => {
   return renderWithProviders(
-    <UnifiedAuthProvider 
+    <UnifiedAuthProvider
       supabaseClient={supabase} 
       appName="test-app"
       idleTimeoutMs={30 * 60 * 1000}
@@ -47,6 +60,16 @@ const renderWithUnifiedAuth = (ui: React.ReactElement) => {
   );
 };
 
+const renderWithPublicContext = (ui: React.ReactElement, value: any = null) => {
+  const Context = publicPageContextStore.value ?? React.createContext(null);
+
+  return renderWithProviders(
+    <Context.Provider value={value}>
+      {ui}
+    </Context.Provider>
+  );
+};
+
 const baseProps = {
   supabase,
   table_name: 'person',
@@ -69,6 +92,18 @@ describe('[component] FileDisplay', () => {
       fileUrls: new Map(),
       refetch: vi.fn(),
     });
+
+    const usePublicFileDisplay = (await import('../../hooks/public/usePublicFileDisplay')).usePublicFileDisplay as unknown as vi.Mock;
+    usePublicFileDisplay.mockReturnValue({
+      isLoading: false,
+      error: null,
+      fileUrl: null,
+      fileReference: null,
+      fileReferences: [],
+      fileCount: 0,
+      fileUrls: new Map(),
+      refetch: vi.fn(),
+    });
   });
 
   it('renders error state and clears error on retry', async () => {
@@ -88,7 +123,7 @@ describe('[component] FileDisplay', () => {
     renderWithUnifiedAuth(<FileDisplay {...baseProps} />);
 
     expect(screen.getByText(/Error loading file: boom/i)).toBeInTheDocument();
-    const retry = screen.getByRole('button', { name: /Try again/i });
+    const retry = screen.getByRole('button', { name: /Retry loading file/i });
     await userEvent.click(retry);
     expect(refetch).toHaveBeenCalled();
   });
@@ -139,7 +174,7 @@ describe('[component] FileDisplay', () => {
     // Confirm dialog needs to be accepted for deletion
     const confirmSpy = vi.spyOn(window, 'confirm').mockReturnValue(true);
 
-    renderWithUnifiedAuth(<FileDisplay {...baseProps} showDelete category={1 as any} />);
+    renderWithUnifiedAuth(<FileDisplay {...baseProps} showDelete category={FileCategory.IMAGES} />);
 
     const image = await screen.findByRole('img', { name: /file\.png/i });
     expect(image).toBeInTheDocument();
@@ -178,7 +213,7 @@ describe('[component] FileDisplay', () => {
       refetch: vi.fn(),
     });
 
-    renderWithUnifiedAuth(<FileDisplay {...baseProps} category={1 as any} />);
+    renderWithUnifiedAuth(<FileDisplay {...baseProps} category={FileCategory.IMAGES} />);
     expect(await screen.findByText('report.pdf')).toBeInTheDocument();
     expect(screen.getByText(/application\/pdf/i)).toBeInTheDocument();
   });
@@ -378,87 +413,110 @@ describe('[component] FileDisplay', () => {
       expect(screen.queryByRole('img', { name: /image\.png/i })).toBeInTheDocument();
     }, { timeout: 3000 });
   });
-});
 
-/**
- * @file FileDisplay Component Tests (moved into component directory)
- */
+  it('renders fallback UI when showFallback is enabled and an error occurs', async () => {
+    const useFileDisplay = (await import('../../hooks/useFileDisplay')).useFileDisplay as unknown as vi.Mock;
+    useFileDisplay.mockReturnValue({
+      isLoading: false,
+      error: new Error('explode'),
+      fileUrl: null,
+      fileReference: null,
+      fileReferences: [],
+      fileCount: 0,
+      fileUrls: new Map(),
+      refetch: vi.fn(),
+    });
+
+    renderWithUnifiedAuth(
+      <FileDisplay {...baseProps} showFallback fallbackText="ERR" />
+    );
 
-import React from 'react';
-import { screen, waitFor, fireEvent } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
-import { vi } from 'vitest';
-import { FileDisplay } from './index';
-import { FileCategory } from '../../types/file-reference';
-import { renderWithProviders, createMockSupabaseClient } from '../../__tests__/helpers/test-utils';
-
-// Mock dependencies
-import * as useFileReferenceModule from '../../hooks/useFileReference';
-import * as storageHelpers from '../../utils/storage/helpers';
-
-const mockUseFileReferenceForRecord = vi.fn();
-const mockUseFileReference = vi.fn();
-const mockGetPublicUrl = vi.fn();
-const mockGetSignedUrl = vi.fn();
-
-beforeEach(async () => {
-  vi.clearAllMocks();
-  // Set up default mock for useFileDisplay
-  const useFileDisplay = (await import('../../hooks/useFileDisplay')).useFileDisplay as unknown as vi.Mock;
-  useFileDisplay.mockReturnValue({
-    isLoading: false,
-    error: null,
-    fileUrl: null,
-    fileReference: null,
-    fileReferences: [],
-    fileCount: 0,
-    fileUrls: new Map(),
-    refetch: vi.fn(),
+    expect(screen.getByText('ERR')).toBeInTheDocument();
+    expect(screen.queryByText(/Error loading file/)).not.toBeInTheDocument();
   });
-  mockUseFileReferenceForRecord.mockReturnValue({
-    isLoading: false,
-    error: null,
-    fileUrl: null,
-    fileReference: null,
-    fileReferences: [],
-    fileCount: 0,
-    loadFileReference: vi.fn(),
-    loadFileUrl: vi.fn(),
-    loadFileReferences: vi.fn(),
-    loadFileCount: vi.fn(),
-    deleteFile: vi.fn(),
-    clearError: vi.fn()
-  });
-  mockUseFileReference.mockReturnValue({
-    getFilesByCategory: vi.fn(() => Promise.resolve([])),
-    isLoading: false,
-    error: null,
+
+  it('uses custom fallback text for non-image displayOnly entries', async () => {
+    const pdfFile = {
+      id: 'fr-pdf',
+      table_name: 'person',
+      record_id: 'rec-1',
+      organisation_id: 'org-1',
+      file_path: 'bucket/path/doc.pdf',
+      is_public: false,
+      file_metadata: { fileName: 'doc.pdf', fileSize: 1024, fileType: 'application/pdf' },
+    };
+
+    const useFileDisplay = (await import('../../hooks/useFileDisplay')).useFileDisplay as unknown as vi.Mock;
+    useFileDisplay.mockReturnValue({
+      isLoading: false,
+      error: null,
+      fileUrl: null,
+      fileReference: pdfFile,
+      fileReferences: [pdfFile],
+      fileCount: 1,
+      fileUrls: new Map(),
+      refetch: vi.fn(),
+    });
+
+    const fallbackGenerator = vi.fn(() => 'DOC');
+
+    renderWithUnifiedAuth(
+      <FileDisplay
+        {...baseProps}
+        displayOnly
+        showFallback
+        generateFallbackText={fallbackGenerator}
+      />
+    );
+
+    expect(await screen.findByText('DOC')).toBeInTheDocument();
+    expect(fallbackGenerator).toHaveBeenCalledWith('doc.pdf');
   });
-  mockGetPublicUrl.mockReturnValue('https://example.com/public-file.jpg');
-  mockGetSignedUrl.mockResolvedValue({ url: 'https://example.com/signed-file.jpg' });
-  vi.spyOn(useFileReferenceModule, 'useFileReferenceForRecord').mockImplementation(mockUseFileReferenceForRecord as any);
-  vi.spyOn(useFileReferenceModule, 'useFileReference').mockImplementation(mockUseFileReference as any);
-  vi.spyOn(storageHelpers, 'getPublicUrl').mockImplementation(mockGetPublicUrl as any);
-  vi.spyOn(storageHelpers, 'getSignedUrl').mockImplementation(mockGetSignedUrl as any);
-});
 
-afterEach(() => {
-  vi.restoreAllMocks();
-});
+  it('renders fallback UI in public context when supabase is unavailable', async () => {
+    mockUseIsPublicPage.mockReturnValueOnce(true);
 
-const defaultProps = {
-  supabase: createMockSupabaseClient(),
-  table_name: 'test_table',
-  record_id: 'test-record-123',
-  organisation_id: 'test-org-123'
-};
+    renderWithPublicContext(
+      <FileDisplay {...baseProps} showFallback fallbackText="PUB" />, 
+      null
+    );
 
-describe('FileDisplay Component (relocated)', () => {
-  it('renders with default props', async () => {
-    const useFileDisplay = (await import('../../hooks/useFileDisplay')).useFileDisplay as unknown as vi.Mock;
-    renderWithUnifiedAuth(<FileDisplay {...defaultProps} />);
-    expect(useFileDisplay).toHaveBeenCalled();
+    expect(screen.getByText('PUB')).toBeInTheDocument();
   });
-});
 
+  it('uses public file display hook and disables delete actions on public pages', async () => {
+    mockUseIsPublicPage.mockReturnValueOnce(true);
+
+    const publicFile = {
+      id: 'pub-1',
+      table_name: 'event',
+      record_id: 'event-1',
+      organisation_id: 'org-1',
+      file_path: 'bucket/path/hero.png',
+      is_public: true,
+      file_metadata: { fileName: 'hero.png', fileSize: 512, fileType: 'image/png' },
+    };
+
+    const fileUrlsMap = new Map<string, string>([['pub-1', 'https://public.example.com/hero.png']]);
+    const usePublicFileDisplay = (await import('../../hooks/public/usePublicFileDisplay')).usePublicFileDisplay as unknown as vi.Mock;
+    usePublicFileDisplay.mockReturnValue({
+      isLoading: false,
+      error: null,
+      fileUrl: 'https://public.example.com/hero.png',
+      fileReference: publicFile,
+      fileReferences: [publicFile],
+      fileCount: 1,
+      fileUrls: fileUrlsMap,
+      refetch: vi.fn(),
+    });
+
+    renderWithPublicContext(
+      <FileDisplay {...baseProps} showDelete displayOnly />, 
+      { supabase }
+    );
 
+    const image = await screen.findByRole('img', { name: /hero\.png/i });
+    expect(image).toBeInTheDocument();
+    expect(screen.queryByRole('button', { name: /Delete file/i })).toBeNull();
+  });
+});

package/src/components/FileDisplay/FileDisplay.tsx

@@ -225,6 +225,7 @@ function FileDisplayContent({
           <button
             onClick={clearError}
             className="mt-2 text-sm text-acc-700 hover:text-acc-800 underline"
+            aria-label="Retry loading file"
           >
             Try again
           </button>