@jmruthers/pace-core 0.5.86 → 0.5.88

package/src/components/SuperAdminGuard.tsx

@@ -1,116 +0,0 @@
-/**
- * Super Admin Guard Component
- * @package @jmruthers/pace-core
- * @module Components/SuperAdminGuard
- * @since 1.0.0
- * 
- * A reusable component for protecting content that should only be visible to super admins.
- */
-
-import React from 'react';
-import { useRBAC } from '../rbac/hooks/useRBAC';
-
-export interface SuperAdminGuardProps {
-  children: React.ReactNode;
-  fallback?: React.ReactNode;
-  showDebugInfo?: boolean;
-}
-
-/**
- * Super Admin Guard Component
- * 
- * Renders children only if the current user is a super admin.
- * Provides a fallback for non-super admin users.
- * 
- * @param children - Content to render for super admins
- * @param fallback - Content to render for non-super admins (optional)
- * @param showDebugInfo - Whether to show debug information (optional)
- */
-export function SuperAdminGuard({ 
-  children, 
-  fallback = null, 
-  showDebugInfo = false 
-}: SuperAdminGuardProps) {
-  const { isSuperAdmin, hasGlobalPermission, isLoading } = useRBAC();
-
-  // Show loading state
-  if (isLoading) {
-    return (
-      <div className="super-admin-guard-loading">
-        <div className="loading-spinner" />
-        <span>Checking permissions...</span>
-      </div>
-    );
-  }
-
-  // Show debug info if enabled
-  if (showDebugInfo) {
-    console.log('[SuperAdminGuard] Debug Info:', {
-      isSuperAdmin,
-      isLoading
-    });
-  }
-
-  // Render children for super admins
-  if (isSuperAdmin) {
-    return (
-      <div className="super-admin-content">
-        {children}
-      </div>
-    );
-  }
-
-  // Render fallback for non-super admins
-  return (
-    <div className="super-admin-fallback">
-      {fallback}
-    </div>
-  );
-}
-
-/**
- * Super Admin Badge Component
- * 
- * Shows a visual indicator when the current user is a super admin.
- */
-export function SuperAdminBadge() {
-  const { isSuperAdmin } = useRBAC();
-
-  if (!isSuperAdmin) {
-    return null;
-  }
-
-  return (
-    <div className="super-admin-badge">
-      <span className="badge-text">SUPER ADMIN</span>
-    </div>
-  );
-}
-
-/**
- * Super Admin Debug Panel
- * 
- * Shows debug information about the current user's permissions.
- * Only visible to super admins and in development mode.
- */
-export function SuperAdminDebugPanel() {
-  const { isSuperAdmin, isLoading } = useRBAC();
-
-  // Only show in development or for super admins
-  if (import.meta.env.MODE !== 'development' && !isSuperAdmin) {
-    return null;
-  }
-
-  return (
-    <div className="super-admin-debug-panel">
-      <h4>Super Admin Debug Info</h4>
-      <div className="debug-info">
-        <p><strong>Is Super Admin:</strong> {isSuperAdmin ? 'Yes' : 'No'}</p>
-        <p><strong>Is Loading:</strong> {isLoading ? 'Yes' : 'No'}</p>
-        <p><strong>Environment:</strong> {import.meta.env.MODE}</p>
-      </div>
-    </div>
-  );
-}
-
-export default SuperAdminGuard;

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

@@ -1,575 +0,0 @@
-/**
- * @file FileDisplay Component Tests
- * @description Comprehensive test suite for FileDisplay component
- * @package @jmruthers/pace-core
- * @module Components/FileDisplay
- * @since 1.0.0
- */
-
-import React from 'react';
-import { screen, waitFor, fireEvent } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
-import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
-import { FileDisplay } from '../FileDisplay';
-import { renderWithProviders, createMockSupabaseClient } from '../../__tests__/helpers/test-utils';
-import { FileCategory } from '../../types/file-reference';
-
-// Mock the useFileReferenceForRecord hook
-const mockUseFileReferenceForRecord = vi.fn();
-vi.mock('../../hooks/useFileReference', () => ({
-  useFileReferenceForRecord: () => mockUseFileReferenceForRecord(),
-}));
-
-// Mock window.confirm
-const mockConfirm = vi.fn();
-Object.defineProperty(window, 'confirm', {
-  value: mockConfirm,
-  writable: true,
-});
-
-describe('FileDisplay Component', () => {
-  const defaultProps = {
-    supabase: createMockSupabaseClient(),
-    table_name: 'test_table',
-    record_id: 'test_record_123',
-    organisation_id: 'test_org_123',
-  };
-
-  const mockFileReference = {
-    id: 'file_123',
-    table_name: 'test_table',
-    record_id: 'test_record_123',
-    file_path: 'uploads/test-file.jpg',
-    file_metadata: {
-      fileName: 'test-file.jpg',
-      fileType: 'image/jpeg',
-      fileSize: 1024000,
-      category: FileCategory.IMAGES,
-    },
-    organisation_id: 'test_org_123',
-    app_id: 'test_app',
-    is_public: true,
-    created_at: '2023-01-01T00:00:00Z',
-    updated_at: '2023-01-01T00:00:00Z',
-  };
-
-  const mockFileReferences = [
-    mockFileReference,
-    {
-      ...mockFileReference,
-      id: 'file_456',
-      file_metadata: {
-        ...mockFileReference.file_metadata,
-        fileName: 'document.pdf',
-        fileType: 'application/pdf',
-        fileSize: 2048000,
-      },
-    },
-  ];
-
-  beforeEach(() => {
-    vi.clearAllMocks();
-    mockConfirm.mockReturnValue(true);
-    
-    // Default mock implementation
-    mockUseFileReferenceForRecord.mockReturnValue({
-      isLoading: false,
-      error: null,
-      fileUrl: 'https://example.com/test-file.jpg',
-      fileReference: null,
-      fileReferences: [],
-      fileCount: 0,
-      loadFileReference: vi.fn(),
-      loadFileUrl: vi.fn(),
-      loadFileReferences: vi.fn(),
-      loadFileCount: vi.fn(),
-      deleteFile: vi.fn().mockResolvedValue(true),
-      clearError: vi.fn(),
-    });
-  });
-
-    describe('Rendering', () => {
-    it('renders with basic props', () => {
-      renderWithProviders(<FileDisplay {...defaultProps} />);
-      expect(screen.getByText('No files found')).toBeInTheDocument();
-    });
-
-    it('renders with custom className', () => {
-      const { container } = renderWithProviders(
-        <FileDisplay {...defaultProps} className="custom-class" />
-      );
-      expect(container.firstChild).toHaveClass('custom-class');
-    });
-
-    it('renders with children', () => {
-      renderWithProviders(
-        <FileDisplay {...defaultProps}>
-          <div data-testid="custom-child">Custom content</div>
-        </FileDisplay>
-      );
-      expect(screen.getByTestId('custom-child')).toBeInTheDocument();
-    });
-  });
-
-  describe('Loading State', () => {
-    it('shows loading spinner when isLoading is true', () => {
-      mockUseFileReferenceForRecord.mockReturnValue({
-        ...mockUseFileReferenceForRecord(),
-        isLoading: true,
-      });
-
-      renderWithProviders(<FileDisplay {...defaultProps} />);
-      
-      const spinner = document.querySelector('.animate-spin');
-      expect(spinner).toBeInTheDocument();
-      expect(spinner).toHaveClass('animate-spin');
-    });
-  });
-
-  describe('Error State', () => {
-    it('displays error message when error occurs', () => {
-      const errorMessage = 'Failed to load files';
-      mockUseFileReferenceForRecord.mockReturnValue({
-        ...mockUseFileReferenceForRecord(),
-        error: errorMessage,
-      });
-
-      renderWithProviders(<FileDisplay {...defaultProps} />);
-      
-      expect(screen.getByText(`Error loading file: ${errorMessage}`)).toBeInTheDocument();
-    });
-
-    it('calls clearError when try again button is clicked', async () => {
-      const clearError = vi.fn();
-      mockUseFileReferenceForRecord.mockReturnValue({
-        ...mockUseFileReferenceForRecord(),
-        error: 'Test error',
-        clearError,
-      });
-
-      const user = userEvent.setup();
-      renderWithProviders(<FileDisplay {...defaultProps} />);
-      
-      await user.click(screen.getByText('Try again'));
-      expect(clearError).toHaveBeenCalledTimes(1);
-    });
-  });
-
-  describe('Empty State', () => {
-    it('shows no files found when fileCount is 0', () => {
-      mockUseFileReferenceForRecord.mockReturnValue({
-        ...mockUseFileReferenceForRecord(),
-        fileCount: 0,
-      });
-
-      renderWithProviders(<FileDisplay {...defaultProps} />);
-      expect(screen.getByText('No files found')).toBeInTheDocument();
-    });
-  });
-
-  describe('Single File Display', () => {
-    beforeEach(() => {
-      mockUseFileReferenceForRecord.mockReturnValue({
-        ...mockUseFileReferenceForRecord(),
-        fileReference: mockFileReference,
-        fileCount: 1,
-      });
-    });
-
-    it('displays image file with image element', () => {
-      renderWithProviders(
-        <FileDisplay {...defaultProps} category={FileCategory.IMAGES} />
-      );
-      
-      const image = screen.getByRole('img');
-      expect(image).toBeInTheDocument();
-      expect(image).toHaveAttribute('src', 'https://example.com/test-file.jpg');
-      expect(image).toHaveAttribute('alt', 'test-file.jpg');
-    });
-
-    it('displays non-image file with file icon and metadata', () => {
-      const pdfFileReference = {
-        ...mockFileReference,
-        file_metadata: {
-          ...mockFileReference.file_metadata,
-          fileName: 'document.pdf',
-          fileType: 'application/pdf',
-          fileSize: 2048000,
-        },
-      };
-
-      mockUseFileReferenceForRecord.mockReturnValue({
-        ...mockUseFileReferenceForRecord(),
-        fileReference: pdfFileReference,
-        fileCount: 1,
-      });
-
-      renderWithProviders(
-        <FileDisplay {...defaultProps} category={FileCategory.GENERAL_DOCUMENTS} />
-      );
-      
-      expect(screen.getByText('document.pdf')).toBeInTheDocument();
-      expect(screen.getAllByText((content, element) => 
-        element?.textContent?.includes('1.95 MB') && element?.textContent?.includes('application/pdf') || false
-      )[0]).toBeInTheDocument();
-      expect(screen.getByText('📄')).toBeInTheDocument(); // PDF icon
-    });
-
-    it('handles image load error by showing file icon', async () => {
-      const user = userEvent.setup();
-      renderWithProviders(
-        <FileDisplay {...defaultProps} category={FileCategory.IMAGES} />
-      );
-      
-      const image = screen.getByRole('img');
-      await user.click(image); // Trigger error by clicking
-      
-      // Simulate image error
-      fireEvent.error(image);
-      
-      await waitFor(() => {
-        expect(screen.queryByRole('img')).not.toBeInTheDocument();
-        // Check if the file is still displayed (either as img or text)
-        const imgElement = screen.queryByRole('img', { name: 'test-file.jpg' });
-        const textElement = screen.queryByText('test-file.jpg');
-        expect(imgElement || textElement).toBeInTheDocument();
-      });
-    });
-
-    it('shows delete button when showDelete is true', () => {
-      renderWithProviders(
-        <FileDisplay {...defaultProps} category={FileCategory.IMAGES} showDelete />
-      );
-      
-      const deleteButton = screen.getByTitle('Delete file');
-      expect(deleteButton).toBeInTheDocument();
-    });
-
-    it('does not show delete button when showDelete is false', () => {
-      renderWithProviders(
-        <FileDisplay {...defaultProps} category={FileCategory.IMAGES} showDelete={false} />
-      );
-      
-      expect(screen.queryByTitle('Delete file')).not.toBeInTheDocument();
-    });
-
-    it('calls deleteFile when delete button is clicked and confirmed', async () => {
-      const deleteFile = vi.fn().mockResolvedValue(true);
-      mockUseFileReferenceForRecord.mockReturnValue({
-        ...mockUseFileReferenceForRecord(),
-        fileReference: mockFileReference,
-        fileCount: 1,
-        deleteFile,
-      });
-
-      const user = userEvent.setup();
-      renderWithProviders(
-        <FileDisplay {...defaultProps} category={FileCategory.IMAGES} showDelete />
-      );
-      
-      await user.click(screen.getByTitle('Delete file'));
-      
-      expect(mockConfirm).toHaveBeenCalledWith('Are you sure you want to delete this file?');
-      expect(deleteFile).toHaveBeenCalledWith(true);
-    });
-
-    it('does not delete file when user cancels confirmation', async () => {
-      mockConfirm.mockReturnValue(false);
-      const deleteFile = vi.fn();
-      mockUseFileReferenceForRecord.mockReturnValue({
-        ...mockUseFileReferenceForRecord(),
-        fileReference: mockFileReference,
-        fileCount: 1,
-        deleteFile,
-      });
-
-      const user = userEvent.setup();
-      renderWithProviders(
-        <FileDisplay {...defaultProps} category={FileCategory.IMAGES} showDelete />
-      );
-      
-      await user.click(screen.getByTitle('Delete file'));
-      
-      expect(mockConfirm).toHaveBeenCalledWith('Are you sure you want to delete this file?');
-      expect(deleteFile).not.toHaveBeenCalled();
-    });
-  });
-
-  describe('Multiple Files Display', () => {
-    beforeEach(() => {
-      mockUseFileReferenceForRecord.mockReturnValue({
-        ...mockUseFileReferenceForRecord(),
-        fileReferences: mockFileReferences,
-        fileCount: 2,
-      });
-    });
-
-    it('displays multiple files in a list', () => {
-      renderWithProviders(<FileDisplay {...defaultProps} />);
-      
-      expect(screen.getByText('test-file.jpg')).toBeInTheDocument();
-      expect(screen.getByText('document.pdf')).toBeInTheDocument();
-      expect(screen.getAllByText((content, element) => 
-        element?.textContent?.includes('1000 KB') && element?.textContent?.includes('image/jpeg') || false
-      )[0]).toBeInTheDocument();
-      expect(screen.getAllByText((content, element) => 
-        element?.textContent?.includes('1.95 MB') && element?.textContent?.includes('application/pdf') || false
-      )[0]).toBeInTheDocument();
-    });
-
-    it('shows delete buttons for each file when showDelete is true', () => {
-      renderWithProviders(<FileDisplay {...defaultProps} showDelete />);
-      
-      const deleteButtons = screen.getAllByTitle('Delete file');
-      expect(deleteButtons).toHaveLength(2);
-    });
-
-    it('calls deleteFile for specific file when delete button is clicked', async () => {
-      const deleteFile = vi.fn().mockResolvedValue(true);
-      mockUseFileReferenceForRecord.mockReturnValue({
-        ...mockUseFileReferenceForRecord(),
-        fileReferences: mockFileReferences,
-        fileCount: 2,
-        deleteFile,
-      });
-
-      const user = userEvent.setup();
-      renderWithProviders(<FileDisplay {...defaultProps} showDelete />);
-      
-      const deleteButtons = screen.getAllByTitle('Delete file');
-      await user.click(deleteButtons[0]);
-      
-      expect(deleteFile).toHaveBeenCalledWith(true);
-    });
-  });
-
-  describe('File Icons', () => {
-    it('shows correct icon for different file types', () => {
-      const testCases = [
-        { fileType: 'image/jpeg', expectedIcon: '🖼️' },
-        { fileType: 'video/mp4', expectedIcon: '🎥' },
-        { fileType: 'audio/mp3', expectedIcon: '🎵' },
-        { fileType: 'application/pdf', expectedIcon: '📄' },
-        { fileType: 'application/msword', expectedIcon: '📝' },
-        { fileType: 'application/vnd.ms-excel', expectedIcon: '📊' },
-        { fileType: 'application/vnd.ms-powerpoint', expectedIcon: '📊' },
-        { fileType: 'text/plain', expectedIcon: '📁' },
-      ];
-
-      testCases.forEach(({ fileType, expectedIcon }) => {
-        const fileRef = {
-          ...mockFileReference,
-          file_metadata: {
-            ...mockFileReference.file_metadata,
-            fileType,
-          },
-        };
-
-        mockUseFileReferenceForRecord.mockReturnValue({
-          ...mockUseFileReferenceForRecord(),
-          fileReference: fileRef,
-          fileCount: 1,
-        });
-
-        const { unmount } = renderWithProviders(
-          <FileDisplay {...defaultProps} category={FileCategory.GENERAL_DOCUMENTS} />
-        );
-        
-        // For image files, check if it's an img element or icon
-        if (fileType.startsWith('image/')) {
-          const imgElement = screen.queryByRole('img');
-          if (imgElement) {
-            expect(imgElement).toBeInTheDocument();
-          } else {
-            expect(screen.getByText(expectedIcon)).toBeInTheDocument();
-          }
-        } else {
-          expect(screen.getByText(expectedIcon)).toBeInTheDocument();
-        }
-        unmount();
-      });
-    });
-  });
-
-  describe('File Size Formatting', () => {
-    it('formats file sizes correctly', () => {
-      const testCases = [
-        { size: 0, expected: '0 Bytes' },
-        { size: 1024, expected: '1 KB' },
-        { size: 1024 * 1024, expected: '1 MB' },
-        { size: 1024 * 1024 * 1024, expected: '1 GB' },
-        { size: 1536, expected: '1.5 KB' },
-      ];
-
-      testCases.forEach(({ size, expected }) => {
-        const fileRef = {
-          ...mockFileReference,
-          file_metadata: {
-            ...mockFileReference.file_metadata,
-            fileSize: size,
-          },
-        };
-
-        mockUseFileReferenceForRecord.mockReturnValue({
-          ...mockUseFileReferenceForRecord(),
-          fileReference: fileRef,
-          fileCount: 1,
-        });
-
-        const { unmount } = renderWithProviders(
-          <FileDisplay {...defaultProps} category={FileCategory.GENERAL_DOCUMENTS} />
-        );
-        
-        // For image files, check if it's an img element or text
-        if (fileRef.file_metadata.fileType.startsWith('image/')) {
-          const imgElement = screen.queryByRole('img');
-          if (imgElement) {
-            expect(imgElement).toBeInTheDocument();
-          } else {
-            expect(screen.getByText(expected)).toBeInTheDocument();
-          }
-        } else {
-          expect(screen.getByText(expected)).toBeInTheDocument();
-        }
-        unmount();
-      });
-    });
-  });
-
-  describe('Accessibility', () => {
-    it('has proper alt text for images', () => {
-      mockUseFileReferenceForRecord.mockReturnValue({
-        ...mockUseFileReferenceForRecord(),
-        fileReference: mockFileReference,
-        fileCount: 1,
-      });
-
-      renderWithProviders(
-        <FileDisplay {...defaultProps} category={FileCategory.IMAGES} />
-      );
-      
-      const image = screen.getByRole('img');
-      expect(image).toHaveAttribute('alt', 'test-file.jpg');
-    });
-
-    it('has proper title attributes for delete buttons', () => {
-      mockUseFileReferenceForRecord.mockReturnValue({
-        ...mockUseFileReferenceForRecord(),
-        fileReference: mockFileReference,
-        fileCount: 1,
-      });
-
-      renderWithProviders(
-        <FileDisplay {...defaultProps} category={FileCategory.IMAGES} showDelete />
-      );
-      
-      const deleteButton = screen.getByTitle('Delete file');
-      expect(deleteButton).toBeInTheDocument();
-    });
-  });
-
-  describe('Integration', () => {
-    it('loads file data on mount', () => {
-      const loadFileCount = vi.fn();
-      const loadFileReference = vi.fn();
-      const loadFileReferences = vi.fn();
-
-      mockUseFileReferenceForRecord.mockReturnValue({
-        ...mockUseFileReferenceForRecord(),
-        loadFileCount,
-        loadFileReference,
-        loadFileReferences,
-      });
-
-      renderWithProviders(
-        <FileDisplay {...defaultProps} category={FileCategory.IMAGES} />
-      );
-      
-      expect(loadFileCount).toHaveBeenCalledTimes(1);
-      expect(loadFileReference).toHaveBeenCalledTimes(1);
-      expect(loadFileReferences).not.toHaveBeenCalled();
-    });
-
-    it('loads file references when no category is specified', () => {
-      const loadFileCount = vi.fn();
-      const loadFileReference = vi.fn();
-      const loadFileReferences = vi.fn();
-
-      mockUseFileReferenceForRecord.mockReturnValue({
-        ...mockUseFileReferenceForRecord(),
-        loadFileCount,
-        loadFileReference,
-        loadFileReferences,
-      });
-
-      renderWithProviders(<FileDisplay {...defaultProps} />);
-      
-      expect(loadFileCount).toHaveBeenCalledTimes(1);
-      expect(loadFileReferences).toHaveBeenCalledTimes(1);
-      expect(loadFileReference).not.toHaveBeenCalled();
-    });
-
-    it('loads file URL when file reference is available', () => {
-      const loadFileUrl = vi.fn();
-      mockUseFileReferenceForRecord.mockReturnValue({
-        ...mockUseFileReferenceForRecord(),
-        fileReference: mockFileReference,
-        fileCount: 1,
-        loadFileUrl,
-      });
-
-      renderWithProviders(
-        <FileDisplay {...defaultProps} category={FileCategory.IMAGES} />
-      );
-      
-      expect(loadFileUrl).toHaveBeenCalledTimes(1);
-    });
-  });
-
-  describe('Error Handling', () => {
-    it('handles missing file metadata gracefully', () => {
-      const fileRefWithoutMetadata = {
-        ...mockFileReference,
-        file_metadata: {
-          fileName: undefined,
-          fileType: undefined,
-          fileSize: undefined,
-          category: FileCategory.IMAGES,
-        },
-      };
-
-      mockUseFileReferenceForRecord.mockReturnValue({
-        ...mockUseFileReferenceForRecord(),
-        fileReference: fileRefWithoutMetadata,
-        fileCount: 1,
-      });
-
-      renderWithProviders(
-        <FileDisplay {...defaultProps} category={FileCategory.IMAGES} />
-      );
-      
-      expect(screen.getByText('Unknown file')).toBeInTheDocument();
-    });
-
-    it('handles delete failure gracefully', async () => {
-      const deleteFile = vi.fn().mockResolvedValue(false);
-      mockUseFileReferenceForRecord.mockReturnValue({
-        ...mockUseFileReferenceForRecord(),
-        fileReference: mockFileReference,
-        fileCount: 1,
-        deleteFile,
-      });
-
-      const user = userEvent.setup();
-      renderWithProviders(
-        <FileDisplay {...defaultProps} category={FileCategory.IMAGES} showDelete />
-      );
-      
-      await user.click(screen.getByTitle('Delete file'));
-      
-      expect(deleteFile).toHaveBeenCalledWith(true);
-      // File should still be displayed since deletion failed
-      expect(screen.getByRole('img', { name: 'test-file.jpg' })).toBeInTheDocument();
-    });
-  });
-});