@jmruthers/pace-core 0.5.110 → 0.5.111

package/src/components/PaceAppLayout/PaceAppLayout.test.tsx

@@ -54,13 +54,91 @@ vi.mock('../../providers/UnifiedAuthProvider', () => ({
   useUnifiedAuth: vi.fn(() => mockUnifiedAuth),
 }));
 
+// Mock useOrganisations hook
+const mockSelectedOrganisation = {
+  id: 'org-123',
+  name: 'Test Organisation',
+  display_name: 'Test Organisation',
+  slug: 'test-org',
+  description: 'Test organisation',
+  subscription_tier: 'basic',
+  settings: {},
+  is_active: true,
+  created_at: '2023-01-01T00:00:00Z',
+  updated_at: '2023-01-01T00:00:00Z',
+};
+
+vi.mock('../../hooks/useOrganisations', () => ({
+  useOrganisations: vi.fn(() => ({
+    selectedOrganisation: mockSelectedOrganisation,
+    organisations: [mockSelectedOrganisation],
+    userMemberships: [],
+    isLoading: false,
+    error: null,
+    hasValidOrganisationContext: true,
+    setSelectedOrganisation: vi.fn(),
+    switchOrganisation: vi.fn().mockResolvedValue(undefined),
+    getUserRole: vi.fn().mockReturnValue('member'),
+    validateOrganisationAccess: vi.fn().mockReturnValue(true),
+    ensureOrganisationContext: vi.fn().mockReturnValue(mockSelectedOrganisation),
+    refreshOrganisations: vi.fn().mockResolvedValue(undefined),
+    getPrimaryOrganisation: vi.fn().mockReturnValue(mockSelectedOrganisation),
+    isOrganisationSecure: vi.fn().mockReturnValue(true),
+  })),
+}));
+
+// Mock useEvents hook (optional - wrapped in try/catch in component)
+vi.mock('../../providers/EventsProvider', () => ({
+  useEvents: vi.fn(() => ({
+    selectedEvent: { event_id: 'event-123' },
+    events: [],
+    isLoading: false,
+    error: null,
+  })),
+}));
+
 // Mock RBAC functions
+const mockIsPermitted = vi.fn().mockResolvedValue(true);
+const mockIsPermittedCached = vi.fn().mockResolvedValue(true);
+
 vi.mock('../../rbac/api', () => ({
-  isPermitted: vi.fn().mockResolvedValue(true),
+  isPermitted: vi.fn(),
+  isPermittedCached: vi.fn(),
   isSuperAdmin: vi.fn().mockResolvedValue(false),
   setupRBAC: vi.fn(),
 }));
 
+// Mock useCan hook - this is what PaceAppLayout actually uses
+const mockUseCan = vi.fn(() => ({
+  can: true,
+  isLoading: false,
+  error: null,
+  refetch: vi.fn().mockResolvedValue(undefined),
+}));
+
+// Mock RBAC hooks
+const mockHasPermissionFn = vi.fn().mockResolvedValue(true);
+vi.mock('../../rbac/hooks', () => ({
+  useRBAC: vi.fn(() => ({
+    hasPermission: mockHasPermissionFn,
+    isLoading: false,
+    error: null,
+    hasGlobalPermission: vi.fn().mockResolvedValue(true),
+    hasOrganisationPermission: vi.fn().mockResolvedValue(true),
+    hasEventPermission: vi.fn().mockResolvedValue(true),
+    globalRole: null,
+    organisationRoles: [],
+    eventRoles: [],
+    permissionMap: {},
+  })),
+  useCan: (...args: any[]) => mockUseCan(...args),
+  useResolvedScope: vi.fn(() => ({
+    resolvedScope: { organisationId: 'org-123', eventId: 'event-123', appId: 'app-123' },
+    isLoading: false,
+    error: null,
+  })),
+}));
+
 // Mock Header component
 vi.mock('../Header', () => ({
   Header: ({ 
@@ -151,10 +229,21 @@ describe('PaceAppLayout Component', () => {
     vi.clearAllMocks();
     // Reset location mock
     mockLocation.pathname = '/dashboard';
-    // Reset RBAC mocks
-    const { isPermitted, isSuperAdmin } = await import('../../rbac/api');
+    // Reset RBAC hook mocks
+    mockHasPermissionFn.mockClear();
+    mockHasPermissionFn.mockResolvedValue(true);
+    mockUseCan.mockReturnValue({
+      can: true,
+      isLoading: false,
+      error: null,
+      refetch: vi.fn().mockResolvedValue(undefined),
+    });
+    // Reset RBAC API mocks
+    const { isPermitted, isPermittedCached, isSuperAdmin } = await import('../../rbac/api');
     vi.mocked(isPermitted).mockReset();
     vi.mocked(isPermitted).mockResolvedValue(true);
+    vi.mocked(isPermittedCached).mockReset();
+    vi.mocked(isPermittedCached).mockResolvedValue(true);
     vi.mocked(isSuperAdmin).mockReset();
     vi.mocked(isSuperAdmin).mockResolvedValue(false);
   });
@@ -360,8 +449,13 @@ describe('PaceAppLayout Component', () => {
     });
 
     it('shows loading state when checking permissions', async () => {
-      const { isPermitted } = await import('../../rbac/api');
-      vi.mocked(isPermitted).mockImplementation(() => new Promise(resolve => setTimeout(() => resolve(true), 100)));
+      // Mock useCan to return loading state
+      mockUseCan.mockReturnValueOnce({
+        can: false,
+        isLoading: true,
+        error: null,
+        refetch: vi.fn().mockResolvedValue(undefined),
+      });
       
       renderWithProviders(
         <TestWrapper>
@@ -374,8 +468,13 @@ describe('PaceAppLayout Component', () => {
     });
 
     it('shows permission error when check fails', async () => {
-      const { isPermitted } = await import('../../rbac/api');
-      vi.mocked(isPermitted).mockRejectedValue(new Error('Permission check failed'));
+      // Mock useCan to return an error state
+      mockUseCan.mockReturnValueOnce({
+        can: false,
+        isLoading: false,
+        error: new Error('Permission check failed'),
+        refetch: vi.fn().mockResolvedValue(undefined),
+      });
       
       renderWithProviders(
         <TestWrapper>
@@ -390,8 +489,13 @@ describe('PaceAppLayout Component', () => {
     });
 
     it('shows access denied when user lacks permission', async () => {
-      const { isPermitted } = await import('../../rbac/api');
-      vi.mocked(isPermitted).mockResolvedValue(false);
+      // Mock useCan to return false (no permission)
+      mockUseCan.mockReturnValueOnce({
+        can: false,
+        isLoading: false,
+        error: null,
+        refetch: vi.fn().mockResolvedValue(undefined),
+      });
       
       renderWithProviders(
         <TestWrapper>
@@ -406,11 +510,16 @@ describe('PaceAppLayout Component', () => {
     });
 
     it('shows custom permission fallback when provided', async () => {
-      const { isPermitted } = await import('../../rbac/api');
-      vi.mocked(isPermitted).mockResolvedValue(false);
-      
+      // Arrange
+      mockUseCan.mockReturnValueOnce({
+        can: false,
+        isLoading: false,
+        error: null,
+        refetch: vi.fn().mockResolvedValue(undefined),
+      });
       const customFallback = <div data-testid="custom-fallback">Custom Access Denied</div>;
       
+      // Act
       renderWithProviders(
         <TestWrapper>
           <PaceAppLayout 
@@ -421,17 +530,23 @@ describe('PaceAppLayout Component', () => {
         </TestWrapper>
       );
       
+      // Assert - No need to wait for loading since mock returns immediately
       await waitFor(() => {
         expect(screen.getByTestId('custom-fallback')).toBeInTheDocument();
-      }, { timeout: 3000 });
+      });
     });
 
     it('shows page permission fallback when enforcePagePermissions is true', async () => {
-      const { isPermitted } = await import('../../rbac/api');
-      vi.mocked(isPermitted).mockResolvedValue(false);
-      
+      // Arrange
+      mockUseCan.mockReturnValueOnce({
+        can: false,
+        isLoading: false,
+        error: null,
+        refetch: vi.fn().mockResolvedValue(undefined),
+      });
       const pageFallback = <div data-testid="page-fallback">Page Access Denied</div>;
       
+      // Act
       renderWithProviders(
         <TestWrapper>
           <PaceAppLayout 
@@ -443,9 +558,10 @@ describe('PaceAppLayout Component', () => {
         </TestWrapper>
       );
       
+      // Assert - No need to wait for loading since mock returns immediately
       await waitFor(() => {
         expect(screen.getByTestId('page-fallback')).toBeInTheDocument();
-      }, { timeout: 3000 });
+      });
     });
   });
 
@@ -514,9 +630,6 @@ describe('PaceAppLayout Component', () => {
 
   describe('Route-Specific Permissions', () => {
     it('uses route-specific permissions when provided', async () => {
-      const { isPermitted } = await import('../../rbac/api');
-      vi.mocked(isPermitted).mockResolvedValue(true);
-      
       renderWithProviders(
         <TestWrapper>
           <PaceAppLayout 
@@ -533,23 +646,18 @@ describe('PaceAppLayout Component', () => {
       );
       
       await waitFor(() => {
-        expect(vi.mocked(isPermitted)).toHaveBeenCalledWith({
-          userId: 'user-123',
-          scope: {
-            organisationId: 'org-123',
-            eventId: 'event-123',
-            appId: 'app-123',
-          },
-          permission: 'update:page.dashboard-page',
-          pageId: 'dashboard-page',
-        });
-      }, { timeout: 3000 });
-    });
+        // useCan is called with userId, scope, permission, pageId, useCache
+        expect(mockUseCan).toHaveBeenCalledWith(
+          'user-123',
+          expect.objectContaining({ organisationId: 'org-123' }),
+          'update:page.dashboard-page',
+          'dashboard-page',
+          true
+        );
+      }, { timeout: 5000 });
+    }, { timeout: 6000 });
 
     it('uses default permission when route not in routePermissions', async () => {
-      const { isPermitted } = await import('../../rbac/api');
-      vi.mocked(isPermitted).mockResolvedValue(true);
-      
       renderWithProviders(
         <TestWrapper>
           <PaceAppLayout 
@@ -564,18 +672,17 @@ describe('PaceAppLayout Component', () => {
       );
       
       await waitFor(() => {
-        expect(vi.mocked(isPermitted)).toHaveBeenCalledWith({
-          userId: 'user-123',
-          scope: {
-            organisationId: 'org-123',
-            eventId: 'event-123',
-            appId: 'app-123',
-          },
-          permission: 'create:page.dashboard',
-          pageId: 'dashboard',
-        });
-      }, { timeout: 3000 });
-    });
+        // useCan is called with userId, scope, permission, pageId, useCache
+        // Uses defaultPermission "create" since /dashboard is not in routePermissions
+        expect(mockUseCan).toHaveBeenCalledWith(
+          'user-123',
+          expect.objectContaining({ organisationId: 'org-123' }),
+          'create:page.dashboard',
+          'dashboard',
+          true
+        );
+      }, { timeout: 5000 });
+    }, { timeout: 6000 });
   });
 
   describe('Super Admin Bypass', () => {
@@ -601,11 +708,16 @@ describe('PaceAppLayout Component', () => {
 
   describe('Callbacks and Event Handling', () => {
     it('calls onPageAccessDenied when access is denied', async () => {
-      const { isPermitted } = await import('../../rbac/api');
-      vi.mocked(isPermitted).mockResolvedValue(false);
-      
+      // Arrange
       const onPageAccessDenied = vi.fn();
+      mockUseCan.mockReturnValueOnce({
+        can: false,
+        isLoading: false,
+        error: null,
+        refetch: vi.fn().mockResolvedValue(undefined),
+      });
       
+      // Act
       renderWithProviders(
         <TestWrapper>
           <PaceAppLayout 
@@ -616,17 +728,23 @@ describe('PaceAppLayout Component', () => {
         </TestWrapper>
       );
       
+      // Assert - Callback should be called immediately when can is false
       await waitFor(() => {
         expect(onPageAccessDenied).toHaveBeenCalledWith('dashboard', 'read');
-      }, { timeout: 3000 });
+      });
     });
 
     it('calls onStrictModeViolation when strict mode is violated', async () => {
-      const { isPermitted } = await import('../../rbac/api');
-      vi.mocked(isPermitted).mockResolvedValue(false);
-      
+      // Arrange
       const onStrictModeViolation = vi.fn();
+      mockUseCan.mockReturnValueOnce({
+        can: false,
+        isLoading: false,
+        error: null,
+        refetch: vi.fn().mockResolvedValue(undefined),
+      });
       
+      // Act
       renderWithProviders(
         <TestWrapper>
           <PaceAppLayout 
@@ -638,9 +756,10 @@ describe('PaceAppLayout Component', () => {
         </TestWrapper>
       );
       
+      // Assert - Callback should be called immediately when can is false
       await waitFor(() => {
         expect(onStrictModeViolation).toHaveBeenCalledWith('dashboard', 'read');
-      }, { timeout: 3000 });
+      });
     });
   });
 
@@ -714,8 +833,14 @@ describe('PaceAppLayout Component', () => {
       // Mock the useUnifiedAuth hook to return null user
       vi.mocked(useUnifiedAuth).mockReturnValue(mockAuthWithoutUser);
       
-      const { isPermitted } = await import('../../rbac/api');
-      vi.mocked(isPermitted).mockResolvedValue(false);
+      // When there's no user, useCan is called with empty string userId
+      // and will return false (no permission)
+      mockUseCan.mockReturnValueOnce({
+        can: false,
+        isLoading: false,
+        error: null,
+        refetch: vi.fn().mockResolvedValue(undefined),
+      });
       
       renderWithProviders(
         <TestWrapper>
@@ -732,6 +857,7 @@ describe('PaceAppLayout Component', () => {
     });
 
     it('handles missing organisation context', async () => {
+      // Arrange
       const mockUserWithoutOrg = {
         ...mockUser,
         user_metadata: {},
@@ -743,12 +869,15 @@ describe('PaceAppLayout Component', () => {
         user: mockUserWithoutOrg,
       };
       
-      // Mock the useUnifiedAuth hook to return user without org context
       vi.mocked(useUnifiedAuth).mockReturnValue(mockAuthWithoutOrg);
+      mockUseCan.mockReturnValueOnce({
+        can: false,
+        isLoading: false,
+        error: null,
+        refetch: vi.fn().mockResolvedValue(undefined),
+      });
       
-      const { isPermitted } = await import('../../rbac/api');
-      vi.mocked(isPermitted).mockResolvedValue(false);
-      
+      // Act
       renderWithProviders(
         <TestWrapper>
           <PaceAppLayout 
@@ -758,9 +887,10 @@ describe('PaceAppLayout Component', () => {
         </TestWrapper>
       );
       
+      // Assert - Component should show access denied
       await waitFor(() => {
-        expect(screen.getByText('Access Denied')).toBeInTheDocument();
-      }, { timeout: 3000 });
+        expect(screen.getByRole('heading', { name: 'Access Denied' })).toBeInTheDocument();
+      });
     });
   });