@jmruthers/pace-core 0.5.136 → 0.5.139

package/src/hooks/__tests__/useFileUrl.unit.test.ts

@@ -299,97 +299,95 @@ describe('useFileUrl Hook', () => {
     });
 
     it.skip('handles signed URL generation failure', async () => {
-      // SKIPPED: This test fails when run with other test files due to mock isolation issues.
-      // The test passes when run in isolation, but when useFileDisplay.unit.test.ts runs first,
-      // its mock setup for getSignedUrl interferes with this test's mock override.
-      // TODO: Refactor to use vi.spyOn or improve mock isolation between test files.
+      // SKIPPED: This test has issues with async promise rejection handling in the test environment.
+      // The mock is being called correctly, but the promise rejection isn't being caught by the hook's
+      // error handling. This may be due to:
+      // - Timing issues between beforeEach mock reset and test mock setup
+      // - The hook's useEffect dependencies causing callback recreation
+      // - How vitest handles promise rejections in this specific scenario
+      // 
+      // TODO: Investigate hook's async error handling and test environment setup.
+      // Consider manually triggering loadUrl() instead of relying on autoLoad, or using act() to wrap async operations.
+      
       const error = new Error('Failed to generate signed URL');
-      // Completely reset and override the mock to reject for this test
-      // IMPORTANT: Must clear, reset, and set new implementation before renderHook
-      vi.mocked(getSignedUrl).mockClear();
-      vi.mocked(getSignedUrl).mockReset();
-      // Force a new implementation that rejects - use mockRejectedValue for clarity
-      vi.mocked(getSignedUrl).mockRejectedValue(error);
+      
+      // Override both mocks to reject - use the same pattern as success test
+      // The hoisted mock is what the module uses, but we also update the imported one
+      mockGetSignedUrl.mockImplementation(() => Promise.reject(error));
+      (getSignedUrl as any).mockImplementation(() => Promise.reject(error));
 
-      await act(async () => {
-        const { result } = renderHook(() =>
-          useFileUrl(mockPrivateFileReference, {
-            organisation_id: 'org-123',
-            supabase: mockSupabase,
-            autoLoad: true
-          })
-        );
-
-        // Wait for the error to be set - give it enough time for the async operation
-        await waitFor(
-          () => {
-            expect(result.current.error).toBeInstanceOf(Error);
-          },
-          { timeout: 5000 }
-        );
-
-        // Verify getSignedUrl was called with correct arguments
-        expect(getSignedUrl).toHaveBeenCalledWith(
-          mockSupabase,
-          mockPrivateFileReference.file_path,
-          expect.objectContaining({
-            appName: 'file-reference',
-            orgId: 'org-123',
-            expiresIn: 3600
-          })
-        );
-
-        // Then verify loading is false - when an Error is thrown, the hook preserves the original error message
-        expect(result.current.isLoading).toBe(false);
-        expect(result.current.error?.message).toBe('Failed to generate signed URL');
-        expect(result.current.url).toBe(null);
-      });
+      const { result } = renderHook(() =>
+        useFileUrl(mockPrivateFileReference, {
+          organisation_id: 'org-123',
+          supabase: mockSupabase,
+          autoLoad: true
+        })
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.error).toBeInstanceOf(Error);
+          expect(result.current.isLoading).toBe(false);
+        },
+        { timeout: 5000 }
+      );
+      
+      expect(mockGetSignedUrl).toHaveBeenCalledWith(
+        mockSupabase,
+        mockPrivateFileReference.file_path,
+        expect.objectContaining({
+          appName: 'file-reference',
+          orgId: 'org-123',
+          expiresIn: 3600
+        })
+      );
+      expect(result.current.error?.message).toBe('Failed to generate signed URL');
+      expect(result.current.url).toBe(null);
     });
 
     it.skip('handles null signed URL result', async () => {
-      // SKIPPED: This test fails when run with other test files due to mock isolation issues.
-      // The test passes when run in isolation, but when useFileDisplay.unit.test.ts runs first,
-      // its mock setup for getSignedUrl interferes with this test's mock override.
-      // TODO: Refactor to use vi.spyOn or improve mock isolation between test files.
-      // Completely reset and override the mock to return null URL for this test
-      // IMPORTANT: Must clear, reset, and set new implementation before renderHook
-      vi.mocked(getSignedUrl).mockClear();
-      vi.mocked(getSignedUrl).mockReset();
-      // Force a new implementation that resolves with null - use mockResolvedValue for clarity
-      vi.mocked(getSignedUrl).mockResolvedValue({ url: null, expiresAt: null });
+      // SKIPPED: This test has issues with async promise resolution handling in the test environment.
+      // The mock is being called correctly, but the promise resolution isn't completing properly,
+      // causing isLoading to remain true. This may be due to:
+      // - Timing issues between beforeEach mock reset and test mock setup
+      // - The hook's useEffect dependencies causing callback recreation
+      // - How vitest handles promise resolutions when mockImplementation is overridden
+      //
+      // TODO: Investigate hook's async state management and test environment setup.
+      // Consider manually triggering loadUrl() instead of relying on autoLoad, or using act() to wrap async operations.
+      
+      // Clear and override both mocks - beforeEach sets mockImplementation, so we need to reset first
+      mockGetSignedUrl.mockReset();
+      mockGetSignedUrl.mockResolvedValue({ url: null, expiresAt: null });
+      (getSignedUrl as any).mockReset();
+      (getSignedUrl as any).mockResolvedValue({ url: null, expiresAt: null });
 
-      await act(async () => {
-        const { result } = renderHook(() =>
-          useFileUrl(mockPrivateFileReference, {
-            organisation_id: 'org-123',
-            supabase: mockSupabase,
-            autoLoad: true
-          })
-        );
-
-        // Wait for loading to complete - check loading state first
-        await waitFor(
-          () => {
-            expect(result.current.isLoading).toBe(false);
-          },
-          { timeout: 5000 }
-        );
-
-        // Verify getSignedUrl was called with correct arguments
-        expect(getSignedUrl).toHaveBeenCalledWith(
-          mockSupabase,
-          mockPrivateFileReference.file_path,
-          expect.objectContaining({
-            appName: 'file-reference',
-            orgId: 'org-123',
-            expiresIn: 3600
-          })
-        );
-
-        // URL should be null when getSignedUrl returns null
-        expect(result.current.url).toBe(null);
-        expect(result.current.error).toBe(null);
-      });
+      const { result } = renderHook(() =>
+        useFileUrl(mockPrivateFileReference, {
+          organisation_id: 'org-123',
+          supabase: mockSupabase,
+          autoLoad: true
+        })
+      );
+
+      await waitFor(
+        () => {
+          expect(result.current.isLoading).toBe(false);
+          expect(result.current.url).toBe(null);
+        },
+        { timeout: 5000 }
+      );
+
+      expect(getSignedUrl).toHaveBeenCalledWith(
+        mockSupabase,
+        mockPrivateFileReference.file_path,
+        expect.objectContaining({
+          appName: 'file-reference',
+          orgId: 'org-123',
+          expiresIn: 3600
+        })
+      );
+      expect(result.current.error).toBe(null);
     });
   });
 

package/src/index.ts

@@ -79,6 +79,9 @@ export type { LabelProps } from './components/Label/Label';
 export { Alert, AlertTitle, AlertDescription } from './components/Alert/Alert';
 export { Avatar, AvatarImage, AvatarFallback } from './components/Avatar/Avatar';
 
+export { Badge } from './components/Badge/Badge';
+export type { BadgeProps, BadgeVariant } from './components/Badge/Badge';
+
 export { Checkbox } from './components/Checkbox/Checkbox';
 export { Switch } from './components/Switch/Switch';
 export type { SwitchProps } from './components/Switch/Switch';
@@ -141,6 +144,7 @@ export {
   type AggregateConfig,
   type EmptyStateConfig,
   type GetRowId,
+  type DataTableFeatureConfig,
   ColumnFactory
 } from './components/DataTable';
 

package/src/rbac/hooks/useCan.test.ts

@@ -679,6 +679,30 @@ describe('useCan Hook', () => {
         expect(mockIsPermitted).not.toHaveBeenCalled();
       });
     });
+
+    it('handles undefined scope gracefully', async () => {
+      const { result } = renderHook(() => 
+        useCan(mockUserId, undefined as any, mockPermission, undefined, false)
+      );
+
+      await waitFor(() => {
+        expect(result.current.isLoading).toBe(true);
+        expect(result.current.can).toBe(false);
+        expect(mockIsPermitted).not.toHaveBeenCalled();
+      });
+    });
+
+    it('handles null scope gracefully', async () => {
+      const { result } = renderHook(() => 
+        useCan(mockUserId, null as any, mockPermission, undefined, false)
+      );
+
+      await waitFor(() => {
+        expect(result.current.isLoading).toBe(true);
+        expect(result.current.can).toBe(false);
+        expect(mockIsPermitted).not.toHaveBeenCalled();
+      });
+    });
   });
 
   describe('Performance', () => {

package/src/rbac/hooks/usePermissions.ts

@@ -228,9 +228,15 @@ export function useCan(
   const [isLoading, setIsLoading] = useState(true);
   const [error, setError] = useState<Error | null>(null);
 
+  // Validate scope parameter - handle undefined/null scope gracefully
+  const isValidScope = scope && typeof scope === 'object';
+  const organisationId = isValidScope ? scope.organisationId : undefined;
+  const eventId = isValidScope ? scope.eventId : undefined;
+  const appId = isValidScope ? scope.appId : undefined;
+
   // Add timeout for missing organisation context (3 seconds)
   useEffect(() => {
-    if (!scope.organisationId || scope.organisationId === null || (typeof scope.organisationId === 'string' && scope.organisationId.trim() === '')) {
+    if (!isValidScope || !organisationId || organisationId === null || (typeof organisationId === 'string' && organisationId.trim() === '')) {
       const timeoutId = setTimeout(() => {
         setError(new Error('Organisation context is required for permission checks'));
         setIsLoading(false);
@@ -243,7 +249,7 @@ export function useCan(
     if (error?.message === 'Organisation context is required for permission checks') {
       setError(null);
     }
-  }, [scope.organisationId, error]);
+  }, [isValidScope, organisationId, error]);
 
   // Use refs to track the last values to prevent unnecessary re-runs
   const lastUserIdRef = useRef<UUID | null>(null);
@@ -253,8 +259,8 @@ export function useCan(
   const lastUseCacheRef = useRef<boolean | null>(null);
 
   useEffect(() => {
-    // Create a scope key to track changes
-    const scopeKey = `${scope.organisationId}-${scope.eventId}-${scope.appId}`;
+    // Create a scope key to track changes - use safe property access
+    const scopeKey = isValidScope ? `${organisationId}-${eventId}-${appId}` : 'invalid-scope';
     
     // Only run if something has actually changed
     if (
@@ -278,9 +284,18 @@ export function useCan(
           return;
         }
 
+        // Validate scope before accessing properties
+        if (!isValidScope) {
+          setIsLoading(true);
+          setCan(false);
+          setError(null);
+          // Timeout is handled in separate useEffect
+          return;
+        }
+
         // Don't check permissions if scope is invalid (e.g., organisationId is null/empty)
         // Wait for organisation context to resolve
-        if (!scope.organisationId || scope.organisationId === null || (typeof scope.organisationId === 'string' && scope.organisationId.trim() === '')) {
+        if (!organisationId || organisationId === null || (typeof organisationId === 'string' && organisationId.trim() === '')) {
           setIsLoading(true);
           setCan(false);
           setError(null);
@@ -292,9 +307,16 @@ export function useCan(
           setIsLoading(true);
           setError(null);
           
+          // Create a valid scope object for the API call
+          const validScope: Scope = {
+            organisationId,
+            ...(eventId ? { eventId } : {}),
+            ...(appId ? { appId } : {})
+          };
+          
           const result = useCache 
-            ? await isPermittedCached({ userId, scope, permission, pageId })
-            : await isPermitted({ userId, scope, permission, pageId });
+            ? await isPermittedCached({ userId, scope: validScope, permission, pageId })
+            : await isPermitted({ userId, scope: validScope, permission, pageId });
           
           setCan(result);
         } catch (err) {
@@ -309,7 +331,7 @@ export function useCan(
       
       checkPermission();
     }
-  }, [userId, scope.organisationId, scope.eventId, scope.appId, permission, pageId, useCache]);
+  }, [userId, isValidScope, organisationId, eventId, appId, permission, pageId, useCache]);
 
   const refetch = useCallback(async () => {
     if (!userId) {
@@ -318,8 +340,16 @@ export function useCan(
       return;
     }
 
+    // Validate scope before accessing properties
+    if (!isValidScope) {
+      setCan(false);
+      setIsLoading(true);
+      setError(null);
+      return;
+    }
+
     // Don't check permissions if scope is invalid (e.g., organisationId is null/empty)
-    if (!scope.organisationId || scope.organisationId === null || (typeof scope.organisationId === 'string' && scope.organisationId.trim() === '')) {
+    if (!organisationId || organisationId === null || (typeof organisationId === 'string' && organisationId.trim() === '')) {
       setCan(false);
       setIsLoading(true);
       setError(null);
@@ -330,9 +360,16 @@ export function useCan(
       setIsLoading(true);
       setError(null);
       
+      // Create a valid scope object for the API call
+      const validScope: Scope = {
+        organisationId,
+        ...(eventId ? { eventId } : {}),
+        ...(appId ? { appId } : {})
+      };
+      
       const result = useCache 
-        ? await isPermittedCached({ userId, scope, permission, pageId })
-        : await isPermitted({ userId, scope, permission, pageId });
+        ? await isPermittedCached({ userId, scope: validScope, permission, pageId })
+        : await isPermitted({ userId, scope: validScope, permission, pageId });
       
       setCan(result);
     } catch (err) {
@@ -341,7 +378,7 @@ export function useCan(
     } finally {
       setIsLoading(false);
     }
-  }, [userId, scope.organisationId, scope.eventId, scope.appId, permission, pageId, useCache]);
+  }, [userId, isValidScope, organisationId, eventId, appId, permission, pageId, useCache]);
 
   // Memoize the return object to prevent unnecessary re-renders
   return useMemo(() => ({

package/src/styles/core.css

@@ -7,6 +7,8 @@
   --font-serif: "Open Sans", sans-serif;
   --font-mono: "Reddit Mono", monospace;
   --font-heading: "Georama", sans-serif;
+  --shadow-badge-soft: 0 0 0 0.1rem var(--color-main-600),  0 0 0 5rem var(--color-main-600) inset,  0 0 0.25rem 0.25rem var(--color-main-600);
+  --shadow-badge-soft-xl: 0 0 0 0.1rem var(--color-main-600),  0 0 0 5rem var(--color-main-600) inset,  0 0 0.25rem 0.75rem var(--color-main-600);
 }
 
 @layer base {
@@ -237,6 +239,7 @@
 @layer utilities {
   /* Custom utility styles go here */
   
+  
   /* Hide spinner arrows on number inputs in DataTable */
   .datatable-number-no-spinners::-webkit-inner-spin-button,
   .datatable-number-no-spinners::-webkit-outer-spin-button {

package/src/utils/appConfig.ts

@@ -0,0 +1,47 @@
+
+/**
+ * Application configuration utilities
+ */
+
+export interface AppConfig {
+  appName: string;
+  appId: string;
+}
+
+let currentAppConfig: AppConfig | null = null;
+
+/**
+ * Set the current application configuration
+ */
+export function setAppConfig(config: AppConfig) {
+  currentAppConfig = config;
+}
+
+/**
+ * Get the current application configuration
+ */
+export function getAppConfig(): AppConfig {
+  if (!currentAppConfig) {
+    // Fallback to environment or default
+    const appName = import.meta.env.REACT_APP_NAME || 'PACE';
+    return {
+      appName,
+      appId: appName
+    };
+  }
+  return currentAppConfig;
+}
+
+/**
+ * Get the current app name
+ */
+export function getCurrentAppName(): string {
+  return getAppConfig().appName;
+}
+
+/**
+ * Get the current app ID
+ */
+export function getCurrentAppId(): string {
+  return getAppConfig().appId;
+}