@jmruthers/pace-core 0.5.121 → 0.5.124

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jmruthers/pace-core",
-  "version": "0.5.121",
+  "version": "0.5.124",
   "description": "Clean, modern React component library with Tailwind v4 styling and native utilities",
   "private": false,
   "publishConfig": {
@@ -138,12 +138,12 @@
     "prepublishOnly": "npm run build:all",
     "clean": "rimraf dist",
     "_comment_test": "Test suite with various configurations",
-    "test": "NODE_OPTIONS='--max-old-space-size=8192 --max-semi-space-size=128' vitest run --config ../../vitest.config.ts",
+    "test": "cross-env NODE_OPTIONS=\"--max-old-space-size=8192 --max-semi-space-size=128\" vitest run --config ../../vitest.config.ts",
     "test:memory-optimized": "node ../../scripts/run-tests-memory-optimized.js",
     "test:watch": "vitest --watch --config ../../vitest.config.ts",
-    "test:coverage": "NODE_OPTIONS='--max-old-space-size=8192 --max-semi-space-size=128' vitest run --coverage --config ../../vitest.config.ts --reporter=dot",
+    "test:coverage": "cross-env NODE_OPTIONS=\"--max-old-space-size=8192 --max-semi-space-size=128\" vitest run --coverage --config ../../vitest.config.ts --reporter=dot",
     "test:ui": "vitest --ui --config ../../vitest.config.ts",
-    "test:new": "NODE_OPTIONS='--max-old-space-size=8192 --max-semi-space-size=128' vitest run --config vitest.new.config.ts",
+    "test:new": "cross-env NODE_OPTIONS=\"--max-old-space-size=8192 --max-semi-space-size=128\" vitest run --config vitest.new.config.ts",
     "test:new:watch": "vitest --watch --config vitest.new.config.ts",
     "migrate-tests": "node scripts/migrate-tests.js",
     "test:unit": "vitest src/**/*.test.{ts,tsx} --config ../../vitest.config.ts",

package/src/__tests__/hooks/usePermissions.test.ts

@@ -0,0 +1,265 @@
+/**
+ * @file usePermissions Hook Tests
+ * @package @jmruthers/pace-core
+ * @module RBAC/Hooks/usePermissions
+ * @since 1.0.0
+ *
+ * Tests for usePermissions hook to ensure:
+ * - Hook returns stable references when data hasn't changed
+ * - No infinite re-renders occur
+ * - Proper memoization is working
+ */
+
+import { renderHook, act } from '@testing-library/react';
+import { vi } from 'vitest';
+import { usePermissions, useCan } from '../../rbac/hooks/usePermissions';
+
+// Mock the API functions
+vi.mock('../../rbac/api', () => ({
+  getPermissionMap: vi.fn(),
+  isPermitted: vi.fn(),
+  isPermittedCached: vi.fn(),
+}));
+
+import { getPermissionMap, isPermitted, isPermittedCached } from '../../rbac/api';
+
+const mockGetPermissionMap = vi.mocked(getPermissionMap);
+const mockIsPermitted = vi.mocked(isPermitted);
+const mockIsPermittedCached = vi.mocked(isPermittedCached);
+
+describe('usePermissions Hook Stability', () => {
+  const mockUserId = 'user-123';
+  const mockScope = {
+    organisationId: 'org-123',
+    eventId: 'event-123',
+    appId: 'app-123'
+  };
+
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+
+  describe('usePermissions', () => {
+    it('should return stable references when data hasn\'t changed', async () => {
+      const mockPermissions = {
+        'read:users': true,
+        'create:users': false
+      };
+
+      mockGetPermissionMap.mockResolvedValue(mockPermissions);
+
+      const { result, rerender } = renderHook(() => 
+        usePermissions(mockUserId, mockScope)
+      );
+
+      // Wait for initial load
+      await act(async () => {
+        await new Promise(resolve => setTimeout(resolve, 0));
+      });
+
+      const firstResult = result.current;
+
+      // Re-render with same props
+      rerender();
+
+      const secondResult = result.current;
+
+      // References should be stable
+      expect(firstResult.permissions).toBe(secondResult.permissions);
+      expect(firstResult.isLoading).toBe(secondResult.isLoading);
+      expect(firstResult.error).toBe(secondResult.error);
+      expect(firstResult.hasPermission).toBe(secondResult.hasPermission);
+      expect(firstResult.hasAnyPermission).toBe(secondResult.hasAnyPermission);
+      expect(firstResult.hasAllPermissions).toBe(secondResult.hasAllPermissions);
+      expect(firstResult.refetch).toBe(secondResult.refetch);
+    });
+
+    it('should update references when data changes', async () => {
+      const initialPermissions = {
+        'read:users': true,
+        'create:users': false
+      };
+
+      const updatedPermissions = {
+        'read:users': true,
+        'create:users': true
+      };
+
+      mockGetPermissionMap
+        .mockResolvedValueOnce(initialPermissions)
+        .mockResolvedValueOnce(updatedPermissions);
+
+      const { result, rerender } = renderHook(() => 
+        usePermissions(mockUserId, mockScope)
+      );
+
+      // Wait for initial load
+      await act(async () => {
+        await new Promise(resolve => setTimeout(resolve, 0));
+      });
+
+      const firstResult = result.current;
+
+      // Trigger refetch
+      await act(async () => {
+        await firstResult.refetch();
+      });
+
+      const secondResult = result.current;
+
+      // References should be different due to data change
+      expect(firstResult.permissions).not.toBe(secondResult.permissions);
+      expect(firstResult.permissions).toEqual(initialPermissions);
+      expect(secondResult.permissions).toEqual(updatedPermissions);
+    });
+
+    it('should not cause infinite re-renders', async () => {
+      let renderCount = 0;
+      
+      mockGetPermissionMap.mockResolvedValue({
+        'read:users': true
+      });
+
+      const { result } = renderHook(() => {
+        renderCount++;
+        return usePermissions(mockUserId, mockScope);
+      });
+
+      // Wait for initial load
+      await act(async () => {
+        await new Promise(resolve => setTimeout(resolve, 0));
+      });
+
+      // Should not have excessive re-renders
+      expect(renderCount).toBeLessThan(5);
+    });
+  });
+
+  describe('useCan', () => {
+    it('should return stable references when data hasn\'t changed', async () => {
+      mockIsPermittedCached.mockResolvedValue(true);
+
+      const { result, rerender } = renderHook(() => 
+        useCan(mockUserId, mockScope, 'read:users', 'page-123', true)
+      );
+
+      // Wait for initial load
+      await act(async () => {
+        await new Promise(resolve => setTimeout(resolve, 0));
+      });
+
+      const firstResult = result.current;
+
+      // Re-render with same props
+      rerender();
+
+      const secondResult = result.current;
+
+      // References should be stable
+      expect(firstResult.can).toBe(secondResult.can);
+      expect(firstResult.isLoading).toBe(secondResult.isLoading);
+      expect(firstResult.error).toBe(secondResult.error);
+      expect(firstResult.refetch).toBe(secondResult.refetch);
+    });
+
+    it('should update references when permission result changes', async () => {
+      mockIsPermittedCached
+        .mockResolvedValueOnce(false)
+        .mockResolvedValueOnce(true);
+
+      const { result, rerender } = renderHook(() => 
+        useCan(mockUserId, mockScope, 'read:users', 'page-123', true)
+      );
+
+      // Wait for initial load
+      await act(async () => {
+        await new Promise(resolve => setTimeout(resolve, 0));
+      });
+
+      const firstResult = result.current;
+
+      // Trigger refetch
+      await act(async () => {
+        await firstResult.refetch();
+      });
+
+      const secondResult = result.current;
+
+      // References should be different due to permission change
+      expect(firstResult.can).toBe(false);
+      expect(secondResult.can).toBe(true);
+    });
+
+    it('should not cause infinite re-renders', async () => {
+      let renderCount = 0;
+      
+      mockIsPermittedCached.mockResolvedValue(true);
+
+      const { result } = renderHook(() => {
+        renderCount++;
+        return useCan(mockUserId, mockScope, 'read:users', 'page-123', true);
+      });
+
+      // Wait for initial load
+      await act(async () => {
+        await new Promise(resolve => setTimeout(resolve, 0));
+      });
+
+      // Should not have excessive re-renders
+      expect(renderCount).toBeLessThan(5);
+    });
+  });
+
+  describe('Hook Dependencies', () => {
+    it('should re-run when userId changes', async () => {
+      mockGetPermissionMap.mockResolvedValue({ 'read:users': true });
+
+      const { result, rerender } = renderHook(
+        ({ userId }) => usePermissions(userId, mockScope),
+        { initialProps: { userId: 'user-1' } }
+      );
+
+      await act(async () => {
+        await new Promise(resolve => setTimeout(resolve, 0));
+      });
+
+      const firstResult = result.current;
+
+      // Change userId
+      rerender({ userId: 'user-2' });
+
+      await act(async () => {
+        await new Promise(resolve => setTimeout(resolve, 0));
+      });
+
+      const secondResult = result.current;
+
+      // Should have re-fetched due to userId change
+      expect(mockGetPermissionMap).toHaveBeenCalledTimes(2);
+      expect(firstResult).not.toBe(secondResult);
+    });
+
+    it('should re-run when scope changes', async () => {
+      mockGetPermissionMap.mockResolvedValue({ 'read:users': true });
+
+      const { result, rerender } = renderHook(
+        ({ scope }) => usePermissions(mockUserId, scope),
+        { initialProps: { scope: { ...mockScope, organisationId: 'org-1' } } }
+      );
+
+      await act(async () => {
+        await new Promise(resolve => setTimeout(resolve, 0));
+      });
+
+      // Change scope
+      rerender({ scope: { ...mockScope, organisationId: 'org-2' } });
+
+      await act(async () => {
+        await new Promise(resolve => setTimeout(resolve, 0));
+      });
+
+      // Should have re-fetched due to scope change
+      expect(mockGetPermissionMap).toHaveBeenCalledTimes(2);
+    });
+  });
+});

package/src/components/DataTable/DataTable.test.tsx

@@ -221,16 +221,12 @@ describe('[component] DataTable', () => {
 
   describe('Validation and Warnings', () => {
     it('logs debug information in development mode', () => {
+      // Note: Debug logging has been removed from DataTable component
+      // The component now uses a logger utility instead of console.log
       render(<DataTable {...defaultProps} />);
       
-      expect(consoleLogSpy).toHaveBeenCalledWith(
-        '[DataTable] 🎯 DataTable WRAPPER called:',
-        expect.objectContaining({
-          dataLength: testData.length,
-          columnsCount: testColumns.length,
-          pageName: defaultRBAC.pageId,
-        })
-      );
+      // Verify component renders correctly
+      expect(screen.getByTestId('data-table-core')).toBeInTheDocument();
     });
 
     it('logs info message when features are not provided in development', async () => {
@@ -369,41 +365,26 @@ describe('[component] DataTable', () => {
 
   describe('Data Handling', () => {
     it('handles empty data array', () => {
+      // Note: Debug logging has been removed from DataTable component
       render(<DataTable {...defaultProps} data={[]} />);
       
       expect(screen.getByTestId('data-table-core')).toBeInTheDocument();
-      expect(consoleLogSpy).toHaveBeenCalledWith(
-        expect.stringContaining('[DataTable]'),
-        expect.objectContaining({
-          dataLength: 0,
-        })
-      );
     });
 
     it('handles single data item', () => {
+      // Note: Debug logging has been removed from DataTable component
       const singleData = testDataScenarios.single;
       render(<DataTable {...defaultProps} data={singleData} />);
       
       expect(screen.getByTestId('data-table-core')).toBeInTheDocument();
-      expect(consoleLogSpy).toHaveBeenCalledWith(
-        expect.stringContaining('[DataTable]'),
-        expect.objectContaining({
-          dataLength: 1,
-        })
-      );
     });
 
     it('handles large dataset', () => {
+      // Note: Debug logging has been removed from DataTable component
       const largeData = testDataScenarios.large;
       render(<DataTable {...defaultProps} data={largeData} />);
       
       expect(screen.getByTestId('data-table-core')).toBeInTheDocument();
-      expect(consoleLogSpy).toHaveBeenCalledWith(
-        expect.stringContaining('[DataTable]'),
-        expect.objectContaining({
-          dataLength: largeData.length,
-        })
-      );
     });
 
     it('handles data with null values', () => {
@@ -532,27 +513,17 @@ describe('[component] DataTable', () => {
 
   describe('Edge Cases', () => {
     it('handles missing columns gracefully', () => {
+      // Note: Debug logging has been removed from DataTable component
       render(<DataTable {...defaultProps} columns={[]} />);
       
       expect(screen.getByTestId('data-table-core')).toBeInTheDocument();
-      expect(consoleLogSpy).toHaveBeenCalledWith(
-        expect.stringContaining('[DataTable]'),
-        expect.objectContaining({
-          columnsCount: 0,
-        })
-      );
     });
 
     it('handles undefined rbac pageId and pageName', () => {
+      // Note: Debug logging has been removed from DataTable component
       render(<DataTable {...defaultProps} rbac={{}} />);
       
       expect(screen.getByTestId('data-table-core')).toBeInTheDocument();
-      expect(consoleLogSpy).toHaveBeenCalledWith(
-        expect.stringContaining('[DataTable]'),
-        expect.objectContaining({
-          pageName: undefined,
-        })
-      );
     });
 
     it('handles rapid feature prop changes', () => {

package/src/components/DataTable/DataTable.tsx

@@ -464,13 +464,6 @@ export function DataTable<TData extends DataRecord>(props: DataTableProps<TData>
   const logger = React.useMemo(() => createLogger('DataTable'), []);
   const { features, ...rest } = props;
 
-  // CRITICAL DEBUG: Log when DataTable wrapper is called
-  console.log('[DataTable] 🎯 DataTable WRAPPER called:', {
-    dataLength: props.data?.length || 0,
-    columnsCount: props.columns?.length || 0,
-    pageName: props.rbac?.pageName || props.rbac?.pageId,
-  });
-
   const normalizedFeatures = React.useMemo(
     () => normalizeDataTableFeatures(features),
     [features]