@jmruthers/pace-core 0.6.10 → 0.6.11

package/src/components/FileUpload/useFileUploadManager.ts

@@ -0,0 +1,454 @@
+/**
+ * @file useFileUploadManager Hook
+ * @package @jmruthers/pace-core
+ * @module Components/FileUpload
+ *
+ * Manages upload state, validation, progress simulation, and sequential file uploads.
+ */
+
+import { 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 { assertAppId } from '../../types/core';
+
+export interface FileUploadState {
+  file: File;
+  progress: UploadProgress;
+  preview?: string;
+  result?: FileUploadResult;
+}
+
+function validateFile(
+  file: File,
+  accept: string,
+  maxSize: number
+): string | null {
+  if (file.size > maxSize) {
+    return `File "${file.name}" exceeds maximum size of ${Math.round(maxSize / 1024 / 1024)}MB`;
+  }
+  if (accept === '*/*') return null;
+  const acceptedTypes = accept.split(',').map((t) => t.trim());
+  const fileExtension = '.' + file.name.split('.').pop()?.toLowerCase();
+  const fileMimeType = file.type;
+  const isAccepted = acceptedTypes.some((accepted) => {
+    if (accepted.startsWith('.')) return accepted === fileExtension;
+    if (accepted.includes('/*')) {
+      const baseType = accepted.split('/')[0];
+      return fileMimeType.startsWith(baseType + '/');
+    }
+    return accepted === fileMimeType;
+  });
+  if (!isAccepted) {
+    return `File "${file.name}" is not an accepted format. Accepted: ${accept}`;
+  }
+  return null;
+}
+
+function validateAndPartitionFiles(
+  files: File[],
+  accept: string,
+  maxSize: number,
+  onUploadError?: (error: string, file?: File) => void
+): File[] {
+  const validFiles: File[] = [];
+  for (const file of files) {
+    const error = validateFile(file, accept, maxSize);
+    if (error) {
+      onUploadError?.(error, file);
+    } else {
+      validFiles.push(file);
+    }
+  }
+  return validFiles;
+}
+
+function generatePreview(file: File): Promise<string | null> {
+  return new Promise((resolve) => {
+    if (!file.type.startsWith('image/')) {
+      resolve(null);
+      return;
+    }
+    const reader = new FileReader();
+    reader.onload = (e) => {
+      resolve((e.target?.result as string) || null);
+    };
+    reader.onerror = () => resolve(null);
+    reader.readAsDataURL(file);
+  });
+}
+
+async function buildInitialUploadStates(
+  validFiles: File[],
+  showPreview: boolean
+): Promise<Map<string, FileUploadState>> {
+  const newUploadStates = new Map<string, FileUploadState>();
+  for (const file of validFiles) {
+    const fileId = `${file.name}-${file.size}-${Date.now()}`;
+    const preview = showPreview
+      ? (await generatePreview(file)) || undefined
+      : undefined;
+    const progress: UploadProgress = {
+      loaded: 0,
+      total: file.size,
+      percentage: 0,
+      fileName: file.name,
+      status: 'idle'
+    };
+    newUploadStates.set(fileId, { file, progress, preview });
+  }
+  return newUploadStates;
+}
+
+/** Upload opts for uploadFile (ISP). */
+interface UploadSingleFileOpts {
+  table_name: string;
+  record_id: string;
+  organisation_id: string | null;
+  userId?: string;
+  app_id: ReturnType<typeof assertAppId>;
+  category: FileCategory;
+  folder: string;
+  pageContext: string;
+  event_id?: string;
+  is_public?: boolean;
+}
+
+/** Upload function slice of UploadSingleFileContext (ISP). */
+interface UploadSingleFileContextUpload {
+  uploadFile: (opts: UploadSingleFileOpts, file: File) => Promise<FileUploadResult | null>;
+}
+
+/** Params slice of UploadSingleFileContext (ISP). */
+interface UploadSingleFileContextParams {
+  resolvedAppId: string | null;
+  appIdError: string | null;
+  pageContext: string;
+  table_name: string;
+  record_id: string;
+  organisation_id: string | null;
+  userId?: string;
+  category: FileCategory;
+  folder: string;
+  event_id?: string;
+  isPublic: boolean;
+}
+
+/** Callbacks slice of UploadSingleFileContext (ISP). */
+interface UploadSingleFileContextCallbacks {
+  onProgress?: (progress: UploadProgress) => void;
+  onUploadSuccess?: (result: FileUploadResult) => void;
+  onUploadError?: (error: string, file?: File) => void;
+}
+
+/** State slice of UploadSingleFileContext (ISP). */
+interface UploadSingleFileContextState {
+  setUploadStates: React.Dispatch<React.SetStateAction<Map<string, FileUploadState>>>;
+  progressIntervalsRef: React.MutableRefObject<Map<string, NodeJS.Timeout>>;
+}
+
+/** Context passed to uploadSingleFile (ISP: composed from focused interfaces). */
+type UploadSingleFileContext = UploadSingleFileContextUpload
+  & UploadSingleFileContextParams
+  & UploadSingleFileContextCallbacks
+  & UploadSingleFileContextState;
+
+async function uploadSingleFile(
+  fileId: string,
+  uploadState: FileUploadState,
+  ctx: UploadSingleFileContext
+): Promise<void> {
+  const { file } = uploadState;
+
+  ctx.setUploadStates((prev) => {
+    const updated = new Map(prev);
+    const state = updated.get(fileId);
+    if (state) {
+      updated.set(fileId, {
+        ...state,
+        progress: { ...state.progress, status: 'uploading' }
+      });
+    }
+    return updated;
+  });
+
+  const progressInterval = setInterval(() => {
+    ctx.setUploadStates((prev) => {
+      const updated = new Map(prev);
+      const state = updated.get(fileId);
+      if (state && state.progress.status === 'uploading') {
+        const estimatedProgress = Math.min(state.progress.percentage + 10, 90);
+        const newProgress: UploadProgress = {
+          ...state.progress,
+          percentage: estimatedProgress,
+          loaded: Math.floor((estimatedProgress / 100) * file.size)
+        };
+        ctx.onProgress?.(newProgress);
+        updated.set(fileId, { ...state, progress: newProgress });
+      }
+      return updated;
+    });
+  }, 200);
+  ctx.progressIntervalsRef.current.set(fileId, progressInterval);
+
+  const clearIntervalForFile = () => {
+    clearInterval(progressInterval);
+    ctx.progressIntervalsRef.current.delete(fileId);
+  };
+
+  try {
+    if (!ctx.resolvedAppId) {
+      clearIntervalForFile();
+      throw new Error(
+        ctx.appIdError || 'App ID not available. Please provide app_id prop or set app name.'
+      );
+    }
+    if (!ctx.pageContext) {
+      clearIntervalForFile();
+      throw new Error('pageContext is required for file upload. This is used for permission checks.');
+    }
+
+    const result = await ctx.uploadFile(
+      {
+        table_name: ctx.table_name,
+        record_id: ctx.record_id,
+        organisation_id: ctx.organisation_id,
+        userId: ctx.userId,
+        app_id: assertAppId(ctx.resolvedAppId),
+        category: ctx.category,
+        folder: ctx.folder,
+        pageContext: ctx.pageContext,
+        event_id: ctx.event_id,
+        is_public: ctx.isPublic
+      },
+      file
+    );
+
+    clearIntervalForFile();
+
+    if (result) {
+      ctx.setUploadStates((prev) => {
+        const updated = new Map(prev);
+        const state = updated.get(fileId);
+        if (state) {
+          updated.set(fileId, {
+            ...state,
+            progress: {
+              ...state.progress,
+              status: 'completed',
+              percentage: 100,
+              loaded: file.size
+            },
+            result
+          });
+        }
+        return updated;
+      });
+      ctx.onProgress?.({
+        loaded: file.size,
+        total: file.size,
+        percentage: 100,
+        fileName: file.name,
+        status: 'completed'
+      });
+      ctx.onUploadSuccess?.(result);
+    } else {
+      ctx.setUploadStates((prev) => {
+        const updated = new Map(prev);
+        const state = updated.get(fileId);
+        if (state) {
+          updated.set(fileId, {
+            ...state,
+            progress: { ...state.progress, status: 'error', error: 'Upload failed' }
+          });
+        }
+        return updated;
+      });
+      ctx.onProgress?.({
+        loaded: 0,
+        total: file.size,
+        percentage: 0,
+        fileName: file.name,
+        status: 'error',
+        error: 'Upload failed'
+      });
+      ctx.onUploadError?.('Upload failed', file);
+    }
+  } catch (err) {
+    const interval = ctx.progressIntervalsRef.current.get(fileId);
+    if (interval) {
+      clearInterval(interval);
+      ctx.progressIntervalsRef.current.delete(fileId);
+    }
+    const errorMessage = err instanceof Error ? err.message : 'Upload failed';
+    ctx.setUploadStates((prev) => {
+      const updated = new Map(prev);
+      const state = updated.get(fileId);
+      if (state) {
+        updated.set(fileId, {
+          ...state,
+          progress: { ...state.progress, status: 'error', error: errorMessage }
+        });
+      }
+      return updated;
+    });
+    ctx.onProgress?.({
+      loaded: 0,
+      total: file.size,
+      percentage: 0,
+      fileName: file.name,
+      status: 'error',
+      error: errorMessage
+    });
+    ctx.onUploadError?.(errorMessage, file);
+  }
+}
+
+export interface UseFileUploadManagerParams {
+  supabase: SupabaseClient;
+  table_name: string;
+  record_id: string;
+  organisation_id?: string | null;
+  userId?: string;
+  resolvedAppId: string | null;
+  appIdError: string | null;
+  category: FileCategory;
+  folder: string;
+  pageContext: string;
+  event_id?: string;
+  isPublic?: boolean;
+  accept: string;
+  maxSize: number;
+  showPreview: boolean;
+  onUploadSuccess?: (result: FileUploadResult) => void;
+  onUploadError?: (error: string, file?: File) => void;
+  onProgress?: (progress: UploadProgress) => void;
+}
+
+export interface UseFileUploadManagerReturn {
+  uploadStates: Map<string, FileUploadState>;
+  setUploadStates: React.Dispatch<React.SetStateAction<Map<string, FileUploadState>>>;
+  isUploading: boolean;
+  handleFileSelect: (files: FileList | null) => Promise<void>;
+  fileInputRef: React.RefObject<HTMLInputElement | null>;
+}
+
+export function useFileUploadManager(
+  params: UseFileUploadManagerParams
+): UseFileUploadManagerReturn {
+  const {
+    supabase,
+    table_name,
+    record_id,
+    organisation_id = null,
+    userId,
+    resolvedAppId,
+    appIdError,
+    category,
+    folder,
+    pageContext,
+    event_id,
+    isPublic = false,
+    accept,
+    maxSize,
+    showPreview,
+    onUploadSuccess,
+    onUploadError,
+    onProgress
+  } = params;
+
+  const [uploadStates, setUploadStates] = useState<Map<string, FileUploadState>>(new Map());
+  const progressIntervalsRef = useRef<Map<string, NodeJS.Timeout>>(new Map());
+  const fileInputRef = useRef<HTMLInputElement>(null);
+  const { uploadFile } = useFileReference(supabase);
+
+  useEffect(() => {
+    const intervals = progressIntervalsRef.current;
+    return () => {
+      intervals.forEach((id) => clearInterval(id));
+      intervals.clear();
+    };
+  }, []);
+
+  const isUploading = useMemo(
+    () =>
+      uploadStates.size > 0 &&
+      Array.from(uploadStates.values()).some(
+        (s) => s.progress.status === 'uploading' || s.progress.status === 'processing'
+      ),
+    [uploadStates]
+  );
+
+  const handleFileSelect = useCallback(
+    async (files: FileList | null) => {
+      if (!files || files.length === 0) return;
+      const fileArray = Array.from(files);
+      const validFiles = validateAndPartitionFiles(
+        fileArray,
+        accept,
+        maxSize,
+        onUploadError
+      );
+      if (validFiles.length === 0) return;
+
+      const newUploadStates = await buildInitialUploadStates(validFiles, showPreview);
+      setUploadStates(newUploadStates);
+
+      const context: UploadSingleFileContext = {
+        uploadFile,
+        resolvedAppId,
+        appIdError,
+        pageContext,
+        table_name,
+        record_id,
+        organisation_id: organisation_id ?? null,
+        userId,
+        category,
+        folder,
+        event_id,
+        isPublic,
+        onProgress,
+        onUploadSuccess,
+        onUploadError,
+        setUploadStates,
+        progressIntervalsRef
+      };
+
+      for (const [fileId, uploadState] of newUploadStates.entries()) {
+        await uploadSingleFile(fileId, uploadState, context);
+      }
+    },
+    [
+      accept,
+      maxSize,
+      showPreview,
+      onUploadError,
+      onProgress,
+      onUploadSuccess,
+      uploadFile,
+      resolvedAppId,
+      appIdError,
+      pageContext,
+      table_name,
+      record_id,
+      organisation_id,
+      userId,
+      category,
+      folder,
+      event_id,
+      isPublic
+    ]
+  );
+
+  return {
+    uploadStates,
+    setUploadStates,
+    isUploading,
+    handleFileSelect,
+    fileInputRef
+  };
+}

package/src/components/FileUpload/useResolvedAppId.test.ts

@@ -0,0 +1,102 @@
+/**
+ * @file useResolvedAppId Hook Tests
+ * @package @jmruthers/pace-core
+ * @module Components/FileUpload
+ *
+ * Tests for useResolvedAppId: provided app_id, resolution from app name, error paths.
+ */
+
+import { renderHook, waitFor } from '@testing-library/react';
+import { vi, describe, it, expect, beforeEach, afterEach } from 'vitest';
+import { useResolvedAppId } from './useResolvedAppId';
+import type { SupabaseClient } from '@supabase/supabase-js';
+
+import * as appNameResolver from '../../utils/app/appNameResolver';
+import * as appIdResolver from '../../utils/app/appIdResolver';
+
+vi.mock('../../utils/app/appNameResolver', () => ({
+  getCurrentAppName: vi.fn(),
+}));
+vi.mock('../../utils/app/appIdResolver', () => ({
+  getAppId: vi.fn(),
+}));
+
+describe('useResolvedAppId', () => {
+  const mockSupabase = {} as SupabaseClient;
+
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+
+  afterEach(() => {
+    vi.restoreAllMocks();
+  });
+
+  it('returns provided app_id immediately and does not resolve', () => {
+    const { result } = renderHook(() => useResolvedAppId(mockSupabase, 'provided-id'));
+
+    expect(result.current.resolvedAppId).toBe('provided-id');
+    expect(result.current.isResolvingAppId).toBe(false);
+    expect(result.current.appIdError).toBe(null);
+    expect(appNameResolver.getCurrentAppName).not.toHaveBeenCalled();
+    expect(appIdResolver.getAppId).not.toHaveBeenCalled();
+  });
+
+  it('resolves app_id from app name when app_id is not provided', async () => {
+    vi.mocked(appNameResolver.getCurrentAppName).mockReturnValue('test-app');
+    vi.mocked(appIdResolver.getAppId).mockResolvedValue({ ok: true, data: 'resolved-app-id' });
+
+    const { result } = renderHook(() => useResolvedAppId(mockSupabase, undefined));
+
+    await waitFor(() => {
+      expect(result.current.isResolvingAppId).toBe(false);
+    });
+
+    expect(result.current.resolvedAppId).toBe('resolved-app-id');
+    expect(result.current.appIdError).toBe(null);
+    expect(appNameResolver.getCurrentAppName).toHaveBeenCalled();
+    expect(appIdResolver.getAppId).toHaveBeenCalledWith(mockSupabase, 'test-app');
+  });
+
+  it('sets appIdError when getCurrentAppName returns undefined', async () => {
+    vi.mocked(appNameResolver.getCurrentAppName).mockReturnValue(undefined);
+
+    const { result } = renderHook(() => useResolvedAppId(mockSupabase, undefined));
+
+    await waitFor(() => {
+      expect(result.current.isResolvingAppId).toBe(false);
+    });
+
+    expect(result.current.resolvedAppId).toBe(null);
+    expect(result.current.appIdError).toMatch(/App ID is required/i);
+    expect(appIdResolver.getAppId).not.toHaveBeenCalled();
+  });
+
+  it('sets appIdError when getAppId returns not ok', async () => {
+    vi.mocked(appNameResolver.getCurrentAppName).mockReturnValue('test-app');
+    vi.mocked(appIdResolver.getAppId).mockResolvedValue({ ok: false, error: { message: 'App not found' } });
+
+    const { result } = renderHook(() => useResolvedAppId(mockSupabase, undefined));
+
+    await waitFor(() => {
+      expect(result.current.isResolvingAppId).toBe(false);
+    });
+
+    expect(result.current.resolvedAppId).toBe(null);
+    expect(result.current.appIdError).toBe('App not found');
+  });
+
+  it('sets appIdError when getAppId returns null data', async () => {
+    vi.mocked(appNameResolver.getCurrentAppName).mockReturnValue('test-app');
+    vi.mocked(appIdResolver.getAppId).mockResolvedValue({ ok: true, data: null });
+
+    const { result } = renderHook(() => useResolvedAppId(mockSupabase, undefined));
+
+    await waitFor(() => {
+      expect(result.current.isResolvingAppId).toBe(false);
+    });
+
+    expect(result.current.resolvedAppId).toBe(null);
+    expect(result.current.appIdError).toMatch(/Failed to resolve app ID/i);
+  });
+});

package/src/components/FileUpload/useResolvedAppId.ts

@@ -0,0 +1,77 @@
+/**
+ * @file useResolvedAppId Hook
+ * @package @jmruthers/pace-core
+ * @module Components/FileUpload
+ *
+ * Resolves app_id from app name when not provided as a prop.
+ */
+
+import { useState, useEffect } from 'react';
+import { SupabaseClient } from '@supabase/supabase-js';
+import { getCurrentAppName } from '../../utils/app/appNameResolver';
+import { getAppId } from '../../utils/app/appIdResolver';
+
+export interface UseResolvedAppIdReturn {
+  resolvedAppId: string | null;
+  isResolvingAppId: boolean;
+  appIdError: string | null;
+}
+
+export function useResolvedAppId(
+  supabase: SupabaseClient,
+  app_id: string | undefined
+): UseResolvedAppIdReturn {
+  const [resolvedAppId, setResolvedAppId] = useState<string | null>(app_id ?? null);
+  const [isResolvingAppId, setIsResolvingAppId] = useState(!app_id);
+  const [appIdError, setAppIdError] = useState<string | null>(null);
+
+  useEffect(() => {
+    if (app_id) {
+      setResolvedAppId(app_id);
+      setIsResolvingAppId(false);
+      setAppIdError(null);
+      return;
+    }
+
+    const resolveAppId = async () => {
+      setIsResolvingAppId(true);
+      setAppIdError(null);
+
+      try {
+        const appName = getCurrentAppName();
+        if (!appName) {
+          const errorMsg =
+            'App ID is required. Either provide app_id prop or set app name via setRBACAppName()';
+          setAppIdError(errorMsg);
+          setIsResolvingAppId(false);
+          return;
+        }
+
+        const result = await getAppId(supabase, appName);
+        if (!result.ok) {
+          setAppIdError(result.error.message);
+          setIsResolvingAppId(false);
+          return;
+        }
+        const resolvedId = result.data;
+        if (!resolvedId) {
+          const errorMsg = `Failed to resolve app ID for app name "${appName}". Make sure the app is registered in rbac_apps table.`;
+          setAppIdError(errorMsg);
+          setIsResolvingAppId(false);
+          return;
+        }
+
+        setResolvedAppId(resolvedId);
+        setIsResolvingAppId(false);
+      } catch (err) {
+        const errorMessage = err instanceof Error ? err.message : 'Failed to resolve app ID';
+        setAppIdError(errorMessage);
+        setIsResolvingAppId(false);
+      }
+    };
+
+    resolveAppId();
+  }, [app_id, supabase]);
+
+  return { resolvedAppId, isResolvingAppId, appIdError };
+}