@jmruthers/pace-core 0.5.135 → 0.5.137

package/src/components/Dialog/utils/__tests__/safeHtml.unit.test.ts

@@ -13,7 +13,14 @@ const originalConsoleLog = console.log;
 const originalConsoleWarn = console.warn;
 
 describe('Safe HTML Utilities', () => {
-    afterEach(() => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+    // Mock console methods
+    console.log = vi.fn();
+    console.warn = vi.fn();
+  });
+
+  afterEach(() => {
     // Restore console methods
     console.log = originalConsoleLog;
     console.warn = originalConsoleWarn;

package/src/components/ErrorBoundary/ErrorBoundary.test.tsx

@@ -12,7 +12,7 @@ import { ErrorBoundary } from './ErrorBoundary';
 import { renderWithProviders } from '../../__tests__/helpers/test-utils';
 
 // Mock the performance budget monitor
-vi.mock('../../utils/performanceBudgets', () => ({
+vi.mock('../../utils/performance/performanceBudgets', () => ({
   performanceBudgetMonitor: {
     measure: vi.fn()
   }
@@ -76,7 +76,21 @@ const RecoverableComponent = ({ shouldThrow = true }: { shouldThrow?: boolean })
 };
 
 describe('ErrorBoundary Component', () => {
+  let originalMode: string | undefined;
+
   beforeEach(() => {
+    // Ensure logger is enabled by setting MODE to development
+    originalMode = import.meta.env.MODE;
+    (import.meta.env as any).MODE = 'development';
+    
+    import('../../utils/core/logger').then(({ Logger, LogLevel }) => {
+      Logger.configure({
+        level: LogLevel.DEBUG,
+        includeTimestamp: false,
+        includeComponent: true,
+      });
+    });
+    
     vi.clearAllMocks();
     // Mock console methods to avoid noise in tests
     vi.spyOn(console, 'error').mockImplementation(() => {});
@@ -354,7 +368,7 @@ describe('ErrorBoundary Component', () => {
 
     it('calls performance monitor when error occurs', async () => {
       const consoleSpy = vi.spyOn(console, 'error').mockImplementation(() => {});
-      const { performanceBudgetMonitor } = await import('../../utils/performanceBudgets');
+      const { performanceBudgetMonitor } = await import('../../utils/performance/performanceBudgets');
       
       renderWithProviders(
         <ErrorBoundary componentName="TestComponent">
@@ -387,12 +401,18 @@ describe('ErrorBoundary Component', () => {
       );
       
       await waitFor(() => {
-        expect(consoleSpy).toHaveBeenCalledWith(
-          expect.stringContaining('ErrorBoundary [TestComponent] caught error'),
-          expect.any(Error),
-          expect.any(Object)
+        // React logs its own error message first, then our logger logs
+        // Check that our logger was called with the correct format
+        const calls = consoleSpy.mock.calls;
+        const ourLogCall = calls.find(call => 
+          call[0] && typeof call[0] === 'string' && 
+          call[0].includes('[ERROR] [ErrorBoundary]') &&
+          call[0].includes('[TestComponent] Caught error')
         );
-      }, { interval: 10 });
+        expect(ourLogCall).toBeDefined();
+        expect(ourLogCall![1]).toBeInstanceOf(Error);
+        expect(ourLogCall![2]).toBeDefined();
+      }, { timeout: 2000 });
       
       consoleSpy.mockRestore();
     });
@@ -745,4 +765,12 @@ describe('ErrorBoundary Component', () => {
       consoleSpy.mockRestore();
     });
   });
+
+  afterEach(() => {
+    // Restore original mode
+    if (originalMode !== undefined) {
+      (import.meta.env as any).MODE = originalMode;
+    }
+    vi.clearAllMocks();
+  });
 });

package/src/components/ErrorBoundary/ErrorBoundary.tsx

@@ -81,7 +81,8 @@
  */
 
 import React, { Component, ReactNode } from 'react';
-import { performanceBudgetMonitor } from '../../utils/performanceBudgets';
+import { performanceBudgetMonitor } from '../../utils/performance/performanceBudgets';
+import { logger } from '../../utils/core/logger';
 
 /**
  * State interface for the ErrorBoundary component
@@ -165,7 +166,7 @@ export class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundarySt
     this.setState({ errorInfo });
     
     // Enhanced logging with component name and error ID
-    console.error(`ErrorBoundary [${componentName}] caught error ${errorId}:`, error, errorInfo);
+    logger.error('ErrorBoundary', `[${componentName}] Caught error ${errorId}:`, error, errorInfo);
     
     // Performance monitoring - track error occurrence
     performanceBudgetMonitor.measure('ERROR_BOUNDARY_TRIGGER', 1, {
@@ -191,7 +192,7 @@ export class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundarySt
     if (import.meta.env.MODE === 'production') {
       // Example: Send to error reporting service
       // errorReportingService.report({ error, errorInfo, errorId, componentName });
-      console.warn('Error reporting would be triggered in production:', { errorId, componentName });
+      logger.warn('ErrorBoundary', 'Error reporting would be triggered in production:', { errorId, componentName });
     }
   };
 
@@ -200,7 +201,7 @@ export class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundarySt
     const { retryCount } = this.state;
 
     if (retryCount < maxRetries) {
-      console.log(`Retrying component render (attempt ${retryCount + 1}/${maxRetries})`);
+      logger.debug('ErrorBoundary', `Retrying component render (attempt ${retryCount + 1}/${maxRetries})`);
       
       this.setState(prevState => ({
         hasError: false,

package/src/components/EventSelector/EventSelector.tsx

@@ -92,7 +92,8 @@ import { RefreshCw, AlertCircle, Lock, Calendar, Star } from 'lucide-react';
 import { useEvents } from '../../hooks/useEvents';
 import { Event } from '../../types';
 import { useEffect, useMemo } from 'react';
-import { cn } from '../../utils/cn';
+import { cn } from '../../utils/core/cn';
+import { logger } from '../../utils/core/logger';
 
 export interface EventSelectorProps {
   /** Placeholder text for the dropdown */
@@ -145,7 +146,7 @@ export function EventSelector({
     refreshEvents,
   } = useEvents();
 
-  console.log('[EventSelector] Component render:', {
+  logger.debug('EventSelector', 'Component render:', {
     eventsCount: events.length,
     events: events.map(e => ({ id: e.event_id, name: e.event_name })),
     selectedEvent: selectedEvent ? { id: selectedEvent.event_id, name: selectedEvent.event_name } : null,

package/src/components/FileDisplay/FileDisplay.tsx

@@ -7,6 +7,7 @@ import { PublicPageContext, useIsPublicPage } from '../PublicLayout/PublicPagePr
 import { useUnifiedAuth } from '../../providers/services/UnifiedAuthProvider';
 import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogBody, DialogFooter } from '../Dialog/Dialog';
 import { Button } from '../Button/Button';
+import { logger } from '../../utils/core/logger';
 
 /**
  * Size classes for fallback display
@@ -502,21 +503,6 @@ function FileDisplayPublic({
   const publicPageContext = useContext(PublicPageContext);
   const supabase = publicPageContext?.supabase ?? null;
 
-  // Step 4: Log Supabase client context
-  console.log('[FileDisplayPublic] Supabase Client Context:', {
-    hasPublicPageContext: !!publicPageContext,
-    hasSupabaseClient: !!supabase,
-    supabaseUrl: publicPageContext?.environment?.supabaseUrl || 'not available',
-    hasAnonKey: !!publicPageContext?.environment?.supabaseKey,
-    hasAuth: !!supabase?.auth,
-    organisation_id,
-    table_name,
-    record_id,
-    category,
-    context: 'public_page_anonymous_user',
-    note: 'Public pages use anonymous Supabase client (no user session)'
-  });
-
   if (!supabase) {
     // If fallback is enabled, show fallback UI instead of error
     if (showFallback) {
@@ -573,7 +559,7 @@ function FileDisplayPublic({
 
   // Log errors for debugging public file display issues
   if (error) {
-    console.error('[FileDisplayPublic] Error fetching file:', {
+    logger.error('FileDisplayPublic', 'Error fetching file', {
       table_name,
       record_id,
       organisation_id,
@@ -583,26 +569,6 @@ function FileDisplayPublic({
     });
   }
 
-  // Log when file is successfully loaded
-  if (fileUrl && !isLoading && !error) {
-    console.log('[FileDisplayPublic] File loaded successfully:', {
-      table_name,
-      record_id,
-      category,
-      fileUrl: fileUrl.substring(0, 50) + '...' // Truncate URL for logging
-    });
-  }
-
-  // Log when no file is found (but not an error - might be expected)
-  if (!isLoading && !error && !fileUrl && !fileReference) {
-    console.log('[FileDisplayPublic] No file found (will show fallback if enabled):', {
-      table_name,
-      record_id,
-      category,
-      showFallback
-    });
-  }
-
   // Public context doesn't support delete operations
   const handleDelete = async () => {
     // Delete operations are not available in public context for security reasons

package/src/components/FileUpload/FileUpload.test.tsx

@@ -161,8 +161,8 @@ import { renderWithProviders, createMockSupabaseClient } from '../../__tests__/h
 
 // Mock dependencies
 import * as useFileReferenceModule from '../../hooks/useFileReference';
-import * as appNameResolver from '../../utils/appNameResolver';
-import * as appIdResolver from '../../utils/appIdResolver';
+import * as appNameResolver from '../../utils/app/appNameResolver';
+import * as appIdResolver from '../../utils/app/appIdResolver';
 
 const mockUseFileReference = vi.fn();
 const mockGetCurrentAppName = vi.fn();

package/src/components/FileUpload/FileUpload.tsx

@@ -5,8 +5,8 @@ import React, { useState, useCallback, useRef, useEffect, useMemo } from 'react'
 import { SupabaseClient } from '@supabase/supabase-js';
 import { FileCategory, FileUploadResult, UploadProgress } from '../../types/file-reference';
 import { useFileReference } from '../../hooks/useFileReference';
-import { getCurrentAppName } from '../../utils/appNameResolver';
-import { getAppId } from '../../utils/appIdResolver';
+import { getCurrentAppName } from '../../utils/app/appNameResolver';
+import { getAppId } from '../../utils/app/appIdResolver';
 
 export interface FileUploadProps {
   supabase: SupabaseClient;

package/src/components/Footer/Footer.test.tsx

@@ -15,7 +15,7 @@ import { renderWithProviders } from '../../__tests__/helpers/test-utils';
 
 // Mock the current year for consistent testing
 const mockCurrentYear = 2024;
-vi.mock('../../utils/cn', () => ({
+vi.mock('../../utils/core/cn', () => ({
   cn: (...classes: (string | undefined)[]) => classes.filter(Boolean).join(' ')
 }));
 

package/src/components/Footer/Footer.tsx

@@ -85,7 +85,7 @@
  * - Tailwind CSS - Styling
  */
 import React from 'react';
-import { cn } from '../../utils/cn';
+import { cn } from '../../utils/core/cn';
 
 export interface FooterProps {
   /**