@jmruthers/pace-core 0.6.10 → 0.6.11

package/src/components/DataTable/hooks/useDataTablePaginationSync.ts

@@ -0,0 +1,109 @@
+/**
+ * @file useDataTablePaginationSync
+ * @package @jmruthers/pace-core
+ * @module DataTable/hooks
+ *
+ * Computes validated initial page size, effective page size, and applies
+ * the pagination-fix effect so the table never uses an invalid pageSize or out-of-bounds pageIndex.
+ */
+
+import { useMemo, useEffect } from 'react';
+import type { DataTableState, DataTableStateActions } from './useDataTableState';
+import type { NormalizedDataTableFeatureConfig } from '../types';
+import type { createLogger } from '../../../utils/core/logger';
+
+export interface UseDataTablePaginationSyncParams {
+  secureFeatures: NormalizedDataTableFeatureConfig;
+  finalPageSizeOptions: number[];
+  state: DataTableState;
+  stateActions: DataTableStateActions;
+  finalDataCount: number;
+  initialPageSize: number;
+  logger: ReturnType<typeof createLogger>;
+}
+
+export interface UseDataTablePaginationSyncReturn {
+  validatedInitialPageSize: number;
+  effectivePageSize: number;
+}
+
+export function useDataTablePaginationSync(
+  params: UseDataTablePaginationSyncParams
+): UseDataTablePaginationSyncReturn {
+  const {
+    secureFeatures,
+    finalPageSizeOptions,
+    state,
+    stateActions,
+    finalDataCount,
+    initialPageSize,
+    logger,
+  } = params;
+
+  const validatedInitialPageSize = useMemo(() => {
+    if (!secureFeatures.pagination || !finalPageSizeOptions.length) {
+      return initialPageSize;
+    }
+    if (finalPageSizeOptions.includes(initialPageSize)) {
+      return initialPageSize;
+    }
+    const sortedOptions = [...finalPageSizeOptions].sort((a, b) => a - b);
+    const closestOption = sortedOptions.reduce((prev, curr) =>
+      Math.abs(curr - initialPageSize) < Math.abs(prev - initialPageSize)
+        ? curr
+        : prev
+    );
+    logger.warn(
+      `initialPageSize ${initialPageSize} is not available in page size options [${finalPageSizeOptions.join(', ')}]. Using closest option: ${closestOption}`
+    );
+    return closestOption;
+  }, [
+    initialPageSize,
+    finalPageSizeOptions,
+    secureFeatures.pagination,
+    logger,
+  ]);
+
+  const effectivePageSize = useMemo(() => {
+    if (!secureFeatures.pagination || !finalPageSizeOptions.length) {
+      return state.pagination.pageSize;
+    }
+    if (!finalPageSizeOptions.includes(state.pagination.pageSize)) {
+      return validatedInitialPageSize;
+    }
+    return state.pagination.pageSize;
+  }, [
+    state.pagination.pageSize,
+    validatedInitialPageSize,
+    secureFeatures.pagination,
+    finalPageSizeOptions,
+  ]);
+
+  useEffect(() => {
+    if (secureFeatures.pagination && finalPageSizeOptions.length > 0) {
+      const needsFix = !finalPageSizeOptions.includes(state.pagination.pageSize);
+      const currentPageSize = effectivePageSize || validatedInitialPageSize;
+      const totalPages =
+        currentPageSize > 0 ? Math.ceil(finalDataCount / currentPageSize) : 0;
+      const pageIndexOutOfBounds =
+        totalPages > 0 && state.pagination.pageIndex >= totalPages;
+      if (needsFix || pageIndexOutOfBounds) {
+        stateActions.setPagination({
+          pageSize: validatedInitialPageSize,
+          pageIndex: 0,
+        });
+      }
+    }
+  }, [
+    secureFeatures.pagination,
+    finalPageSizeOptions,
+    state.pagination.pageSize,
+    state.pagination.pageIndex,
+    validatedInitialPageSize,
+    stateActions,
+    effectivePageSize,
+    finalDataCount,
+  ]);
+
+  return { validatedInitialPageSize, effectivePageSize };
+}

package/src/components/DataTable/hooks/{__tests__/useDataTablePermissions.test.ts → useDataTablePermissions.test.ts}

@@ -1,12 +1,12 @@
 /**
  * @file Unit tests for useDataTablePermissions
  * @package @jmruthers/pace-core
- * @module Components/DataTable/Hooks/__tests__
+ * @module Components/DataTable/Hooks
  */
 
 import { renderHook, waitFor } from '@testing-library/react';
 import { beforeEach, describe, expect, it, vi } from 'vitest';
-import { useDataTablePermissions } from '../useDataTablePermissions';
+import { useDataTablePermissions } from './useDataTablePermissions';
 import type { DataTableFeatureConfig } from '../../types';
 
 type CanResult = { can: boolean; isLoading: boolean; error: null };
@@ -26,27 +26,27 @@ const mockUseResolvedScope = vi.fn(() => ({
 // Mock useCan - it takes (userId, scope, permission, pageId?, useCache?, precomputedSuperAdmin?, appName?)
 const mockUseCan = vi.fn<(...args: any[]) => CanResult>();
 
-vi.mock('../../../../providers/services/UnifiedAuthProvider', () => ({
+vi.mock('../../../providers/services/UnifiedAuthProvider', () => ({
   useUnifiedAuth: () => mockUseUnifiedAuth(),
   UnifiedAuthProvider: (props: { children: unknown }) => props.children,
 }));
 
 // Mock individual hook files since barrel was removed
-vi.mock('../../../../rbac/hooks/useResolvedScope', () => ({
+vi.mock('../../../rbac/hooks/useResolvedScope', () => ({
   useResolvedScope: (...args: unknown[]) => mockUseResolvedScope(...args),
 }));
 
-vi.mock('../../../../rbac/hooks/usePermissions', () => ({
+vi.mock('../../../rbac/hooks/usePermissions', () => ({
   useCan: (...args: Parameters<typeof mockUseCan>) => mockUseCan(...args),
 }));
 
-vi.mock('../../../../hooks/useToast', () => ({
+vi.mock('../../../hooks/useToast', () => ({
   useToast: () => ({
     toast: vi.fn(),
   }),
 }));
 
-vi.mock('../../../../utils/core/logger', () => {
+vi.mock('../../../utils/core/logger', () => {
   const mockLoggerInstance = {
     info: vi.fn(),
     warn: vi.fn(),
@@ -59,9 +59,9 @@ vi.mock('../../../../utils/core/logger', () => {
   };
 });
 
-const mockIsSuperAdmin = vi.fn().mockResolvedValue(false);
+const mockIsSuperAdmin = vi.fn().mockResolvedValue({ ok: true, data: false });
 
-vi.mock('../../../../rbac/api', () => ({
+vi.mock('../../../rbac/api', () => ({
   isSuperAdmin: (...args: unknown[]) => mockIsSuperAdmin(...args),
 }));
 
@@ -69,7 +69,7 @@ describe('useDataTablePermissions', () => {
   beforeEach(() => {
     vi.clearAllMocks();
     mockUseCan.mockImplementation(() => ({ can: false, isLoading: false, error: null }));
-    mockIsSuperAdmin.mockResolvedValue(false);
+    mockIsSuperAdmin.mockResolvedValue({ ok: true, data: false });
   });
 
   describe('Validation', () => {
@@ -174,7 +174,7 @@ describe('useDataTablePermissions', () => {
 
   describe('Super Admin Bypass', () => {
     it('bypasses all permission checks for super admin', async () => {
-      mockIsSuperAdmin.mockResolvedValue(true);
+      mockIsSuperAdmin.mockResolvedValue({ ok: true, data: true });
       mockUseCan.mockImplementation(() => ({ can: false, isLoading: false, error: null }));
 
       const { result } = renderHook(() =>

package/src/components/DataTable/hooks/useDataTablePermissions.ts

@@ -8,12 +8,9 @@
  * Handles scope resolution, permission checks, and secure feature configuration.
  */
 
-import { useMemo, useRef, useState, useEffect } from 'react';
+import { useMemo } from 'react';
 import { useUnifiedAuth } from '../../../providers/services/UnifiedAuthProvider';
 import { useCan } from '../../../rbac/hooks/usePermissions';
-import { useResolvedScope } from '../../../rbac/hooks/useResolvedScope';
-import { createLogger } from '../../../utils/core/logger';
-import { isSuperAdmin } from '../../../rbac/api';
 import {
   normalizeDataTableFeatures,
   type DataTableFeatureConfig,
@@ -22,6 +19,8 @@ import {
   type DataRecord,
 } from '../types';
 import type { Permission } from '../../../rbac/types';
+import { useDataTableSuperAdmin } from './useDataTableSuperAdmin';
+import { useDataTableScope } from './useDataTableScope';
 
 /**
  * Return value of the useDataTablePermissions hook.
@@ -40,6 +39,51 @@ export interface UseDataTablePermissionsReturn {
   effectivePageId: string | undefined;
 }
 
+type UseCanResult = ReturnType<typeof useCan>;
+
+/**
+ * Builds a permission result that bypasses checks for super admins.
+ * When super admin is confirmed, returns can: true; otherwise uses the useCan result.
+ */
+function toSuperAdminAwarePermission(
+  result: UseCanResult,
+  isSuperAdminUser: boolean | null,
+  isCheckingSuperAdmin: boolean
+): UseCanResult {
+  if (isSuperAdminUser === true) {
+    return {
+      can: true,
+      isLoading: false,
+      error: null,
+      refetch: result.refetch,
+    };
+  }
+  return {
+    can: result.can,
+    isLoading: (isSuperAdminUser === null && isCheckingSuperAdmin) || result.isLoading,
+    error: result.error,
+    refetch: result.refetch,
+  };
+}
+
+/**
+ * Applies permission flags to normalized features; disables features the user cannot perform.
+ */
+function applyPermissionsToFeatures(
+  normalizedFeatures: NormalizedDataTableFeatureConfig,
+  permissions: UseDataTablePermissionsReturn['permissions']
+): NormalizedDataTableFeatureConfig {
+  return {
+    ...normalizedFeatures,
+    creation: normalizedFeatures.creation && permissions.canCreate.can,
+    editing: normalizedFeatures.editing && permissions.canUpdate.can,
+    deletion: normalizedFeatures.deletion && permissions.canDelete.can,
+    deleteSelected: normalizedFeatures.deleteSelected && permissions.canDelete.can,
+    export: normalizedFeatures.export && permissions.canExport.can,
+    import: normalizedFeatures.import && permissions.canImport.can,
+  };
+}
+
 /**
  * Hook for managing RBAC permissions in DataTable components.
  * Handles scope resolution, permission checks, and secure feature configuration.
@@ -53,204 +97,30 @@ export function useDataTablePermissions<_TData extends DataRecord>(
   rbac: DataTableRBACConfig,
   features: DataTableFeatureConfig = {}
 ): UseDataTablePermissionsReturn {
-  const logger = createLogger('DataTablePermissions');
-  const authResult = useUnifiedAuth();
-  const user = authResult.user;
-
-  // Super admin status - check if user has super admin privileges
-  // Super admins bypass all permission checks (similar to PaceAppLayout)
-  // PERFORMANCE OPTIMIZATION: Check super admin once and share with all useCan hooks to avoid duplicate queries
-  // Use null to indicate "not checked yet" vs false which means "checked and not super admin"
-  const [isSuperAdminUser, setIsSuperAdminUser] = useState<boolean | null>(null);
-  const [isCheckingSuperAdmin, setIsCheckingSuperAdmin] = useState<boolean>(() => !!user?.id);
-  const lastCheckedUserIdRef = useRef<string | null>(null);
-  const isCheckingRef = useRef<boolean>(false);
-
-  useEffect(() => {
-    // Skip if already checked for this user ID
-    if (lastCheckedUserIdRef.current === user?.id && isSuperAdminUser !== null) {
-      return;
-    }
-
-    // Skip if already checking
-    if (isCheckingRef.current) {
-      return;
-    }
-
-    const checkSuperAdminStatus = async () => {
-      if (!user?.id) {
-        setIsSuperAdminUser(false); // No user = not super admin
-        setIsCheckingSuperAdmin(false);
-        lastCheckedUserIdRef.current = null;
-        return;
-      }
-
-      // Mark as checking and track user ID
-      isCheckingRef.current = true;
-      lastCheckedUserIdRef.current = user.id;
+  const { user, selectedOrganisation, selectedEvent, supabase } = useUnifiedAuth();
+  const { isSuperAdminUser, isCheckingSuperAdmin } = useDataTableSuperAdmin(user?.id);
 
-      const startTime = Date.now();
-      setIsCheckingSuperAdmin(true);
-      
-      // Add timeout to prevent infinite hanging
-      const timeoutId = setTimeout(() => {
-        logger.warn('useDataTablePermissions', 'Super admin check taking longer than 5 seconds', {
-          userId: user?.id,
-          elapsedMs: Date.now() - startTime,
-        });
-      }, 5000);
-
-      try {
-        const superAdminStatus = await isSuperAdmin(user.id);
-        setIsSuperAdminUser(superAdminStatus);
-      } catch (error) {
-        const elapsed = Date.now() - startTime;
-        logger.error('useDataTablePermissions', 'Error checking super admin status', {
-          userId: user?.id,
-          error,
-          elapsedMs: elapsed,
-        });
-        setIsSuperAdminUser(false); // Error = assume not super admin for security
-      } finally {
-        clearTimeout(timeoutId);
-        setIsCheckingSuperAdmin(false);
-        isCheckingRef.current = false;
-      }
-    };
-
-    checkSuperAdminStatus();
-  }, [user?.id, logger, isSuperAdminUser]);
-
-  // MANDATORY: Check all permissions upfront - ALWAYS enforce RBAC
-  // Use page-based permissions exclusively
   const pageId = rbac?.pageId;
   const pageName = rbac?.pageName;
-
-  // Early validation - need either pageId or pageName
   if (!pageId && !pageName) {
     throw new Error('DataTable requires either rbac.pageId or rbac.pageName for permission checking');
   }
-
-  // Use pageId if provided, otherwise use pageName (will be resolved by RBAC engine)
   const effectivePageId = pageId || pageName;
 
-  /**
-   * RBAC Scope Resolution
-   * 
-   * This section handles the complex task of determining the current organisational
-   * and event context for permission checks. The scope (org/event/app) changes
-   * dynamically based on what the user has selected in the UI.
-   * 
-   * Key complexity: Permission hooks (useCan) must not re-run on every render,
-   * but they need the latest scope. We use a ref to maintain a stable scope object
-   * that only changes when the actual scope values change, preventing infinite loops
-   * while ensuring permissions are always checked with current context.
-   */
-
-  // Use shared scope resolution hook for consistent RBAC scoping
-  const { selectedOrganisation, selectedEvent, supabase } = useUnifiedAuth();
-  
-  const { resolvedScope: rawResolvedScope, isLoading: scopeLoading } = useResolvedScope({
+  const { consistentScope } = useDataTableScope({
+    selectedOrganisation,
+    selectedEvent,
     supabase,
-    selectedOrganisationId: selectedOrganisation?.id || null,
-    selectedEventId: selectedEvent?.event_id || null,
-    selectedEventOrganisationId: selectedEvent?.organisation_id || null
+    pageId,
+    pageName,
   });
 
-  /**
-   * Stable scope ref to prevent permission hooks from re-running constantly.
-   * 
-   * Without this, every permission check would trigger on every render because
-   * the scope object gets a new reference on each render. By using a ref and
-   * only updating it when values actually change, we:
-   * 1. Prevent infinite loops in permission hooks
-   * 2. Maintain performance
-   * 3. Still ensure permissions check against the current scope
-   */
-  const stableScopeRef = useRef<{ organisationId?: string; appId?: string; eventId?: string }>({ 
-    organisationId: undefined, 
-    appId: undefined, 
-    eventId: undefined 
-  });
-
-  // Only update the stable scope if the resolved scope has actually changed
-  // This prevents unnecessary re-renders while maintaining up-to-date permission checks
-  // Allow scope updates even when organisationId is undefined (for users without orgs, like profile pages)
-  if (rawResolvedScope) {
-    const newScope = {
-      organisationId: rawResolvedScope.organisationId,
-      appId: rawResolvedScope.appId,
-      eventId: rawResolvedScope.eventId
-    };
-    
-    // Only update if the scope has actually changed
-    if (stableScopeRef.current.organisationId !== newScope.organisationId ||
-        stableScopeRef.current.eventId !== newScope.eventId ||
-        stableScopeRef.current.appId !== newScope.appId) {
-      stableScopeRef.current = {
-        organisationId: newScope.organisationId,
-        appId: newScope.appId,
-        eventId: newScope.eventId
-      };
-    }
-  } else if (!rawResolvedScope && !scopeLoading) {
-    // Reset to empty scope when no resolved scope and resolution is complete (e.g., user logged out)
-    stableScopeRef.current = { organisationId: undefined, appId: undefined, eventId: undefined };
-  }
-
-  const stableScope = stableScopeRef.current;
-
-  /**
-   * Effective scope for permission checks.
-   * 
-   * Use the resolved scope once scope resolution is complete, even if organisationId is undefined.
-   * This allows permission checks for users without organisations (e.g., profile pages).
-   * The database function rbac_check_permission_simplified can handle NULL organisation_id.
-   * 
-   * PERFORMANCE OPTIMIZATION: For page-level permissions with pageId (UUID), we don't need to wait
-   * for full scope resolution. The database function can handle page-level permissions without
-   * organisationId or appId. We only need to wait if:
-   * 1. We're using pageName (not UUID) and need appId to resolve it, OR
-   * 2. We need organisationId for resource-level permissions (but we're using page-level here)
-   * 
-   * This allows permission checks to proceed in parallel with scope resolution, reducing load time.
-   */
-  const isPageName = !pageId && !!pageName; // We're using pageName, not a UUID pageId
-  const needsAppIdForResolution = isPageName; // Only need appId if we're resolving a pageName
-  
-  // PERFORMANCE FIX: For page-level permissions with UUID pageId, we can proceed immediately
-  // The database function handles page-level permissions without requiring full scope
-  // Only wait if we're using pageName (which needs appId to resolve) or if scope is critical
-  // For page-level permissions, organisationId and appId are optional
-  const hasPageId = !!pageId && typeof pageId === 'string';
-  const canProceedWithoutFullScope = hasPageId && !isPageName; // UUID pageId doesn't need appId
-  
-  // Wait for scope resolution only if:
-  // 1. We're using pageName and don't have appId yet (needed to resolve pageName to pageId), OR
-  // 2. Scope is loading AND we don't have a UUID pageId (can't proceed without scope)
-  // This allows permission checks to start earlier for UUID pageIds, reducing load time
-  const shouldWaitForScope = (needsAppIdForResolution && !stableScope.appId) || 
-                             (scopeLoading && !canProceedWithoutFullScope);
-  
-  // Use available scope immediately if we can proceed, otherwise wait
-  // For page-level permissions, empty scope is acceptable (database handles it)
-  const effectiveScope = (!shouldWaitForScope && (stableScope.organisationId || stableScope.appId || stableScope.eventId || canProceedWithoutFullScope)) 
-    ? stableScope 
-    : (canProceedWithoutFullScope ? { organisationId: undefined, eventId: undefined, appId: undefined } : null);
-
-  // Always call hooks with consistent parameters to avoid React hooks order violations
   const userId = user?.id || '';
   const readPermission = `read:page.${effectivePageId}` as unknown as Permission;
   const createPermission = `create:page.${effectivePageId}` as unknown as Permission;
   const updatePermission = `update:page.${effectivePageId}` as unknown as Permission;
   const deletePermission = `delete:page.${effectivePageId}` as unknown as Permission;
 
-  // Always use a consistent scope object to prevent hooks order violations
-  // When scope is loading or we need appId for pageName resolution, use empty scope which will cause useCan to wait
-  // When scope resolution is complete (even with undefined organisationId), use the resolved scope
-  // This allows permission checks for users without organisations (e.g., profile pages)
-  const consistentScope = effectiveScope || { organisationId: undefined, eventId: undefined, appId: undefined };
-
   // Check permissions using useCan hooks
   // PERFORMANCE OPTIMIZATION: Pass precomputed super admin status to avoid duplicate checks
   // Each useCan hook would normally check super admin separately (6+ queries), but we check once here
@@ -267,74 +137,36 @@ export function useDataTablePermissions<_TData extends DataRecord>(
   const canExportResult = useCan(userId, consistentScope, readPermission, effectivePageId, true, isSuperAdminUser); // Use read permission for export
   const canImportResult = useCan(userId, consistentScope, createPermission, effectivePageId, true, isSuperAdminUser); // Use create permission for import
 
-  // Create permission wrappers that bypass checks for super admins
-  // Super admins get can: true for all permissions, but we preserve isLoading and error states
-  // to maintain consistent API with useCan return type
-  // React 19 fix: Read isLoading directly from result objects to ensure we get the latest state
-  // instead of relying on memoized object references which may not update properly in React 19
-  // CRITICAL FIX: When isSuperAdminUser is true, immediately grant all permissions without waiting
-  // for useCan results. This ensures super admins can use DataTable features immediately.
-  const permissions = useMemo(() => {
-    // Helper to create a permission result that bypasses for super admins
-    // If super admin check is still loading, we show loading state to prevent premature "Access Denied"
-    // Once super admin check completes, if user is super admin, all permissions are true
-    // Otherwise, use the normal permission check results
-    const createSuperAdminAwarePermission = (result: ReturnType<typeof useCan>) => {
-      // CRITICAL: If super admin is confirmed, immediately grant permission
-      // Don't wait for useCan results - super admins bypass all checks
-      if (isSuperAdminUser === true) {
-        return {
-          can: true,
-          isLoading: false,
-          error: null,
-          refetch: result.refetch,
-        };
-      }
-      
-      // For non-super-admins or while checking, use normal permission results
-      return {
-        can: result.can,
-        isLoading: (isSuperAdminUser === null && isCheckingSuperAdmin) || result.isLoading,
-        error: result.error,
-        refetch: result.refetch,
-      };
-    };
-
-    return {
-      canRead: createSuperAdminAwarePermission(canReadResult),
-      canCreate: createSuperAdminAwarePermission(canCreateResult),
-      canUpdate: createSuperAdminAwarePermission(canUpdateResult),
-      canDelete: createSuperAdminAwarePermission(canDeleteResult),
-      canExport: createSuperAdminAwarePermission(canExportResult),
-      canImport: createSuperAdminAwarePermission(canImportResult),
-    };
-  }, [
-    isSuperAdminUser,
-    isCheckingSuperAdmin,
-    // Include result objects - individual properties are already part of the objects
-    canReadResult,
-    canCreateResult,
-    canUpdateResult,
-    canDeleteResult,
-    canExportResult,
-    canImportResult,
-  ]);
+  const permissions = useMemo(
+    () => ({
+      canRead: toSuperAdminAwarePermission(canReadResult, isSuperAdminUser, isCheckingSuperAdmin),
+      canCreate: toSuperAdminAwarePermission(canCreateResult, isSuperAdminUser, isCheckingSuperAdmin),
+      canUpdate: toSuperAdminAwarePermission(canUpdateResult, isSuperAdminUser, isCheckingSuperAdmin),
+      canDelete: toSuperAdminAwarePermission(canDeleteResult, isSuperAdminUser, isCheckingSuperAdmin),
+      canExport: toSuperAdminAwarePermission(canExportResult, isSuperAdminUser, isCheckingSuperAdmin),
+      canImport: toSuperAdminAwarePermission(canImportResult, isSuperAdminUser, isCheckingSuperAdmin),
+    }),
+    [
+      isSuperAdminUser,
+      isCheckingSuperAdmin,
+      canReadResult,
+      canCreateResult,
+      canUpdateResult,
+      canDeleteResult,
+      canExportResult,
+      canImportResult,
+    ]
+  );
 
-  // MANDATORY: Features are automatically filtered by permissions
   const normalizedFeatures = useMemo(
     () => normalizeDataTableFeatures(features),
     [features]
   );
 
-  const secureFeatures: NormalizedDataTableFeatureConfig = useMemo(() => ({
-    ...normalizedFeatures,
-    creation: normalizedFeatures.creation && permissions.canCreate.can,
-    editing: normalizedFeatures.editing && permissions.canUpdate.can,
-    deletion: normalizedFeatures.deletion && permissions.canDelete.can,
-    deleteSelected: normalizedFeatures.deleteSelected && permissions.canDelete.can,
-    export: normalizedFeatures.export && permissions.canExport.can,
-    import: normalizedFeatures.import && permissions.canImport.can,
-  }), [normalizedFeatures, permissions.canCreate.can, permissions.canUpdate.can, permissions.canDelete.can, permissions.canExport.can, permissions.canImport.can]);
+  const secureFeatures = useMemo(
+    () => applyPermissionsToFeatures(normalizedFeatures, permissions),
+    [normalizedFeatures, permissions]
+  );
 
   return {
     permissions,