Merge branch 'V2' into posthog

frontend/public/locales/en-GB/translation.json

@@ -50,6 +50,7 @@
     "title": "Files",
     "placeholder": "Select a PDF file in the main view to get started",
     "upload": "Upload",
+    "uploadFiles": "Upload Files",
     "addFiles": "Add files",
     "selectFromWorkbench": "Select files from the workbench or "
   },
@@ -2068,7 +2069,7 @@
     "loading": "Loading...",
     "or": "or",
     "dropFileHere": "Drop file here or click to upload",
-    "dropFilesHere": "Drop files here or click to upload",
+    "dropFilesHere": "Drop files here or click the upload button",
     "pdfFilesOnly": "PDF files only",
     "supportedFileTypes": "Supported file types",
     "upload": "Upload",

frontend/src/components/fileEditor/FileEditor.tsx

@@ -16,6 +16,7 @@ import styles from './FileEditor.module.css';
 import FileEditorThumbnail from './FileEditorThumbnail';
 import FilePickerModal from '../shared/FilePickerModal';
 import SkeletonLoader from '../shared/SkeletonLoader';
+import { FileId } from '../../types/file';
 
 
 interface FileEditorProps {
@@ -88,7 +89,7 @@ const FileEditor = ({
   const contextSelectedIds = Array.isArray(selectedFileIds) ? selectedFileIds : [];
 
   // Create refs for frequently changing values to stabilize callbacks
-  const contextSelectedIdsRef = useRef<string[]>([]);
+  const contextSelectedIdsRef = useRef<FileId[]>([]);
   contextSelectedIdsRef.current = contextSelectedIds;
 
   // Use activeFileRecords directly - no conversion needed
@@ -166,7 +167,7 @@ const FileEditor = ({
                 id: operationId,
                 type: 'convert',
                 timestamp: Date.now(),
-                fileIds: extractionResult.extractedFiles.map(f => f.name),
+                fileIds: extractionResult.extractedFiles.map(f => f.name) as FileId[] /* FIX ME: This doesn't seem right */,
                 status: 'pending',
                 metadata: {
                   originalFileName: file.name,
@@ -219,7 +220,7 @@ const FileEditor = ({
             id: operationId,
             type: 'upload',
             timestamp: Date.now(),
-            fileIds: [file.name],
+            fileIds: [file.name as FileId /* This doesn't seem right */],
             status: 'pending',
             metadata: {
               originalFileName: file.name,
@@ -268,7 +269,7 @@ const FileEditor = ({
     setSelectedFiles([]);
   }, [activeFileRecords, removeFiles, setSelectedFiles]);
 
-  const toggleFile = useCallback((fileId: string) => {
+  const toggleFile = useCallback((fileId: FileId) => {
     const currentSelectedIds = contextSelectedIdsRef.current;
 
     const targetRecord = activeFileRecords.find(r => r.id === fileId);
@@ -277,7 +278,7 @@ const FileEditor = ({
     const contextFileId = fileId; // No need to create a new ID
     const isSelected = currentSelectedIds.includes(contextFileId);
 
-    let newSelection: string[];
+    let newSelection: FileId[];
 
     if (isSelected) {
       // Remove file from selection
@@ -314,7 +315,7 @@ const FileEditor = ({
   }, [setSelectedFiles]);
 
   // File reordering handler for drag and drop
-  const handleReorderFiles = useCallback((sourceFileId: string, targetFileId: string, selectedFileIds: string[]) => {
+  const handleReorderFiles = useCallback((sourceFileId: FileId, targetFileId: FileId, selectedFileIds: FileId[]) => {
     const currentIds = activeFileRecords.map(r => r.id);
 
     // Find indices
@@ -372,7 +373,7 @@ const FileEditor = ({
 
 
   // File operations using context
-  const handleDeleteFile = useCallback((fileId: string) => {
+  const handleDeleteFile = useCallback((fileId: FileId) => {
     const record = activeFileRecords.find(r => r.id === fileId);
     const file = record ? selectors.getFile(record.id) : null;
 
@@ -385,7 +386,7 @@ const FileEditor = ({
         id: operationId,
         type: 'remove',
         timestamp: Date.now(),
-        fileIds: [fileName],
+        fileIds: [fileName as FileId /* FIX ME: This doesn't seem right */],
         status: 'pending',
         metadata: {
           originalFileName: fileName,
@@ -406,7 +407,7 @@ const FileEditor = ({
     }
   }, [activeFileRecords, selectors, removeFiles, setSelectedFiles, selectedFileIds]);
 
-  const handleViewFile = useCallback((fileId: string) => {
+  const handleViewFile = useCallback((fileId: FileId) => {
     const record = activeFileRecords.find(r => r.id === fileId);
     if (record) {
       // Set the file as selected in context and switch to viewer for preview
@@ -415,7 +416,7 @@ const FileEditor = ({
     }
   }, [activeFileRecords, setSelectedFiles, navActions.setWorkbench]);
 
-  const handleMergeFromHere = useCallback((fileId: string) => {
+  const handleMergeFromHere = useCallback((fileId: FileId) => {
     const startIndex = activeFileRecords.findIndex(r => r.id === fileId);
     if (startIndex === -1) return;
 
@@ -426,14 +427,14 @@ const FileEditor = ({
     }
   }, [activeFileRecords, selectors, onMergeFiles]);
 
-  const handleSplitFile = useCallback((fileId: string) => {
+  const handleSplitFile = useCallback((fileId: FileId) => {
     const file = selectors.getFile(fileId);
     if (file && onOpenPageEditor) {
       onOpenPageEditor(file);
     }
   }, [selectors, onOpenPageEditor]);
 
-  const handleLoadFromStorage = useCallback(async (selectedFiles: any[]) => {
+  const handleLoadFromStorage = useCallback(async (selectedFiles: File[]) => {
     if (selectedFiles.length === 0) return;
 
     try {

frontend/src/components/fileEditor/FileEditorThumbnail.tsx

@@ -11,9 +11,10 @@ import { draggable, dropTargetForElements } from '@atlaskit/pragmatic-drag-and-d
 
 import styles from './FileEditor.module.css';
 import { useFileContext } from '../../contexts/FileContext';
+import { FileId } from '../../types/file';
 
 interface FileItem {
-  id: string;
+  id: FileId;
   name: string;
   pageCount: number;
   thumbnail: string | null;
@@ -25,14 +26,14 @@ interface FileEditorThumbnailProps {
   file: FileItem;
   index: number;
   totalFiles: number;
-  selectedFiles: string[];
+  selectedFiles: FileId[];
   selectionMode: boolean;
-  onToggleFile: (fileId: string) => void;
+  onToggleFile: (fileId: FileId) => void;
-  onDeleteFile: (fileId: string) => void;
+  onDeleteFile: (fileId: FileId) => void;
-  onViewFile: (fileId: string) => void;
+  onViewFile: (fileId: FileId) => void;
   onSetStatus: (status: string) => void;
-  onReorderFiles?: (sourceFileId: string, targetFileId: string, selectedFileIds: string[]) => void;
+  onReorderFiles?: (sourceFileId: FileId, targetFileId: FileId, selectedFileIds: FileId[]) => void;
-  onDownloadFile?: (fileId: string) => void;
+  onDownloadFile?: (fileId: FileId) => void;
   toolMode?: boolean;
   isSupported?: boolean;
 }
@@ -161,8 +162,8 @@ const FileEditorThumbnail = ({
       onDrop: ({ source }) => {
         const sourceData = source.data;
         if (sourceData.type === 'file' && onReorderFiles) {
-          const sourceFileId = sourceData.fileId as string;
+          const sourceFileId = sourceData.fileId as FileId;
-          const selectedFileIds = sourceData.selectedFiles as string[];
+          const selectedFileIds = sourceData.selectedFiles as FileId[];
           onReorderFiles(sourceFileId, file.id, selectedFileIds);
         }
       }

frontend/src/components/history/FileOperationHistory.tsx

@@ -14,9 +14,10 @@ import {
 // FileContext no longer needed - these were stub functions anyway
 import {  FileOperation, FileOperationHistory as FileOperationHistoryType } from '../../types/fileContext';
 import { PageOperation } from '../../types/pageEditor';
+import { FileId } from '../../types/file';
 
 interface FileOperationHistoryProps {
-  fileId: string;
+  fileId: FileId;
   showOnlyApplied?: boolean;
   maxHeight?: number;
 }
@@ -27,8 +28,8 @@ const FileOperationHistory: React.FC<FileOperationHistoryProps> = ({
   maxHeight = 400
 }) => {
   // These were stub functions in the old context - replace with empty stubs
-  const getFileHistory = (fileId: string) => ({ operations: [], createdAt: Date.now(), lastModified: Date.now() });
+  const getFileHistory = (fileId: FileId) => ({ operations: [], createdAt: Date.now(), lastModified: Date.now() });
-  const getAppliedOperations = (fileId: string) => [];
+  const getAppliedOperations = (fileId: FileId) => [];
 
   const history = getFileHistory(fileId);
   const allOperations = showOnlyApplied ? getAppliedOperations(fileId) : history?.operations || [];

frontend/src/components/pageEditor/FileThumbnail.tsx

@@ -11,9 +11,10 @@ import { draggable, dropTargetForElements } from '@atlaskit/pragmatic-drag-and-d
 
 import styles from './PageEditor.module.css';
 import { useFileContext } from '../../contexts/FileContext';
+import { FileId } from '../../types/file';
 
 interface FileItem {
-  id: string;
+  id: FileId;
   name: string;
   pageCount: number;
   thumbnail: string | null;
@@ -27,12 +28,12 @@ interface FileThumbnailProps {
   totalFiles: number;
   selectedFiles: string[];
   selectionMode: boolean;
-  onToggleFile: (fileId: string) => void;
+  onToggleFile: (fileId: FileId) => void;
-  onDeleteFile: (fileId: string) => void;
+  onDeleteFile: (fileId: FileId) => void;
-  onViewFile: (fileId: string) => void;
+  onViewFile: (fileId: FileId) => void;
   onSetStatus: (status: string) => void;
-  onReorderFiles?: (sourceFileId: string, targetFileId: string, selectedFileIds: string[]) => void;
+  onReorderFiles?: (sourceFileId: FileId, targetFileId: FileId, selectedFileIds: FileId[]) => void;
-  onDownloadFile?: (fileId: string) => void;
+  onDownloadFile?: (fileId: FileId) => void;
   toolMode?: boolean;
   isSupported?: boolean;
 }
@@ -161,8 +162,8 @@ const FileThumbnail = ({
       onDrop: ({ source }) => {
         const sourceData = source.data;
         if (sourceData.type === 'file' && onReorderFiles) {
-          const sourceFileId = sourceData.fileId as string;
+          const sourceFileId = sourceData.fileId as FileId;
-          const selectedFileIds = sourceData.selectedFiles as string[];
+          const selectedFileIds = sourceData.selectedFiles as FileId[];
           onReorderFiles(sourceFileId, file.id, selectedFileIds);
         }
       }

frontend/src/components/pageEditor/PageEditor.tsx

@@ -16,6 +16,7 @@ import PageThumbnail from './PageThumbnail';
 import DragDropGrid from './DragDropGrid';
 import SkeletonLoader from '../shared/SkeletonLoader';
 import NavigationWarningModal from '../shared/NavigationWarningModal';
+import { FileId } from "../../types/file";
 
 import {
   DOMCommand,
@@ -172,6 +173,7 @@ const PageEditor = ({
   const createRotateCommand = useCallback((pageIds: string[], rotation: number) => ({
     execute: () => {
       const bulkRotateCommand = new BulkRotateCommand(pageIds, rotation);
+
     undoManagerRef.current.executeCommand(bulkRotateCommand);
     }
   }), []);
@@ -181,6 +183,7 @@ const PageEditor = ({
       if (!displayDocument) return;
 
       const pagesToDelete = pageIds.map(pageId => {
+
     const page = displayDocument.pages.find(p => p.id === pageId);
         return page?.pageNumber || 0;
       }).filter(num => num > 0);
@@ -212,7 +215,7 @@ const PageEditor = ({
       );
       undoManagerRef.current.executeCommand(splitCommand);
     }
-  }), [splitPositions]);
+}), [splitPositions]);
 
   // Command executor for PageThumbnail
   const executeCommand = useCallback((command: any) => {
@@ -442,8 +445,8 @@ const PageEditor = ({
   }, [displayDocument, getPageNumbersFromIds]);
 
   // Helper function to collect source files for multi-file export
-  const getSourceFiles = useCallback((): Map<string, File> | null => {
+  const getSourceFiles = useCallback((): Map<FileId, File> | null => {
-    const sourceFiles = new Map<string, File>();
+    const sourceFiles = new Map<FileId, File>();
 
     // Always include original files
     activeFileIds.forEach(fileId => {
@@ -621,6 +624,7 @@ const PageEditor = ({
 
   const closePdf = useCallback(() => {
     actions.clearAllFiles();
+
     undoManagerRef.current.clear();
     setSelectedPageIds([]);
     setSelectionMode(false);

frontend/src/components/pageEditor/commands/pageCommands.ts

@@ -1,3 +1,4 @@
+import { FileId } from '../../../types/file';
 import { PDFDocument, PDFPage } from '../../../types/pageEditor';
 
 // V1-style DOM-first command system (replaces the old React state commands)
@@ -558,9 +559,9 @@ export class BulkPageBreakCommand extends DOMCommand {
 export class InsertFilesCommand extends DOMCommand {
   private insertedPages: PDFPage[] = [];
   private originalDocument: PDFDocument | null = null;
-  private fileDataMap = new Map<string, ArrayBuffer>(); // Store file data for thumbnail generation
+  private fileDataMap = new Map<FileId, ArrayBuffer>(); // Store file data for thumbnail generation
   private originalProcessedFile: any = null; // Store original ProcessedFile for undo
-  private insertedFileMap = new Map<string, File>(); // Store inserted files for export
+  private insertedFileMap = new Map<FileId, File>(); // Store inserted files for export
 
   constructor(
     private files: File[],
@@ -569,7 +570,7 @@ export class InsertFilesCommand extends DOMCommand {
     private setDocument: (doc: PDFDocument) => void,
     private setSelectedPages: (pages: number[]) => void,
     private getSelectedPages: () => number[],
-    private updateFileContext?: (updatedDocument: PDFDocument, insertedFiles?: Map<string, File>) => void
+    private updateFileContext?: (updatedDocument: PDFDocument, insertedFiles?: Map<FileId, File>) => void
   ) {
     super();
   }
@@ -591,7 +592,7 @@ export class InsertFilesCommand extends DOMCommand {
       // Process all files and wait for their completion
       const baseTimestamp = Date.now();
       const extractionPromises = this.files.map(async (file, index) => {
-        const fileId = `inserted-${file.name}-${baseTimestamp + index}`;
+        const fileId = `inserted-${file.name}-${baseTimestamp + index}` as FileId;
         // Store inserted file for export
         this.insertedFileMap.set(fileId, file);
         // Use base timestamp + index to ensure unique but predictable file IDs
@@ -685,10 +686,10 @@ export class InsertFilesCommand extends DOMCommand {
       const { thumbnailGenerationService } = await import('../../../services/thumbnailGenerationService');
 
       // Group pages by file ID to generate thumbnails efficiently
-      const pagesByFileId = new Map<string, PDFPage[]>();
+      const pagesByFileId = new Map<FileId, PDFPage[]>();
 
       for (const page of this.insertedPages) {
-        const fileId = page.id.substring(0, page.id.lastIndexOf('-page-'));
+        const fileId = page.id.substring(0, page.id.lastIndexOf('-page-')) as FileId /* FIX ME: This looks wrong - like we've thrown away info too early and need to recreate it */;
         if (!pagesByFileId.has(fileId)) {
           pagesByFileId.set(fileId, []);
         }
@@ -769,7 +770,7 @@ export class InsertFilesCommand extends DOMCommand {
 
           const pageCount = pdf.numPages;
           const pages: PDFPage[] = [];
-          const fileId = `inserted-${file.name}-${baseTimestamp}`;
+          const fileId = `inserted-${file.name}-${baseTimestamp}` as FileId;
 
           console.log('Original ArrayBuffer size:', arrayBuffer.byteLength);
           console.log('Storing ArrayBuffer for fileId:', fileId, 'size:', arrayBuffer.byteLength);

frontend/src/components/pageEditor/hooks/usePageDocument.ts

@@ -1,6 +1,7 @@
 import { useMemo } from 'react';
 import { useFileState } from '../../../contexts/FileContext';
 import { PDFDocument, PDFPage } from '../../../types/pageEditor';
+import { FileId } from '../../../types/file';
 
 export interface PageDocumentHook {
   document: PDFDocument | null;
@@ -50,8 +51,8 @@ export function usePageDocument(): PageDocumentHook {
             .join(' + ');
 
     // Build page insertion map from files with insertion positions
-    const insertionMap = new Map<string, string[]>(); // insertAfterPageId -> fileIds
+    const insertionMap = new Map<string, FileId[]>(); // insertAfterPageId -> fileIds
-    const originalFileIds: string[] = [];
+    const originalFileIds: FileId[] = [];
 
     activeFileIds.forEach(fileId => {
       const record = selectors.getFileRecord(fileId);
@@ -70,7 +71,7 @@ export function usePageDocument(): PageDocumentHook {
     let totalPageCount = 0;
 
     // Helper function to create pages from a file
-    const createPagesFromFile = (fileId: string, startPageNumber: number): PDFPage[] => {
+    const createPagesFromFile = (fileId: FileId, startPageNumber: number): PDFPage[] => {
       const fileRecord = selectors.getFileRecord(fileId);
       if (!fileRecord) {
         return [];

frontend/src/components/shared/FileGrid.tsx

@@ -5,6 +5,7 @@ import SearchIcon from "@mui/icons-material/Search";
 import SortIcon from "@mui/icons-material/Sort";
 import FileCard from "./FileCard";
 import { FileRecord } from "../../types/fileContext";
+import { FileId } from "../../types/file";
 
 interface FileGridProps {
   files: Array<{ file: File; record?: FileRecord }>;
@@ -12,8 +13,8 @@ interface FileGridProps {
   onDoubleClick?: (item: { file: File; record?: FileRecord }) => void;
   onView?: (item: { file: File; record?: FileRecord }) => void;
   onEdit?: (item: { file: File; record?: FileRecord }) => void;
-  onSelect?: (fileId: string) => void;
+  onSelect?: (fileId: FileId) => void;
-  selectedFiles?: string[];
+  selectedFiles?: FileId[];
   showSearch?: boolean;
   showSort?: boolean;
   maxDisplay?: number; // If set, shows only this many files with "Show All" option
@@ -123,7 +124,7 @@ const FileGrid = ({
         style={{ overflowY: "auto", width: "100%" }}
       >
         {displayFiles.map((item, idx) => {
-          const fileId = item.record?.id || item.file.name;
+          const fileId = item.record?.id || item.file.name as FileId /* FIX ME: This doesn't seem right */;
           const originalIdx = files.findIndex(f => (f.record?.id || f.file.name) === fileId);
           const supported = isFileSupported ? isFileSupported(item.file.name) : true;
           return (

frontend/src/components/shared/FilePickerModal.tsx

@@ -15,6 +15,7 @@ import {
 } from '@mantine/core';
 import PictureAsPdfIcon from '@mui/icons-material/PictureAsPdf';
 import { useTranslation } from 'react-i18next';
+import { FileId } from '../../types/file';
 
 interface FilePickerModalProps {
   opened: boolean;
@@ -30,7 +31,7 @@ const FilePickerModal = ({
   onSelectFiles,
 }: FilePickerModalProps) => {
   const { t } = useTranslation();
-  const [selectedFileIds, setSelectedFileIds] = useState<string[]>([]);
+  const [selectedFileIds, setSelectedFileIds] = useState<FileId[]>([]);
 
   // Reset selection when modal opens
   useEffect(() => {
@@ -39,7 +40,7 @@ const FilePickerModal = ({
     }
   }, [opened]);
 
-  const toggleFileSelection = (fileId: string) => {
+  const toggleFileSelection = (fileId: FileId) => {
     setSelectedFileIds(prev => {
       return prev.includes(fileId)
         ? prev.filter(id => id !== fileId)

frontend/src/components/shared/LandingPage.tsx

@@ -189,7 +189,7 @@ const LandingPage = () => {
             className="text-[var(--accent-interactive)]"
             style={{ fontSize: '.8rem' }}
           >
-            {t('fileUpload.dropFilesHere', 'Drop files here or click to upload')}
+            {t('fileUpload.dropFilesHere', 'Drop files here or click the upload button')}
           </span>
         </div>
       </Dropzone>

frontend/src/components/tools/convert/ConvertSettings.tsx

@@ -22,6 +22,7 @@ import {
   OUTPUT_OPTIONS,
   FIT_OPTIONS
 } from "../../../constants/convertConstants";
+import { FileId } from "../../../types/file";
 
 interface ConvertSettingsProps {
   parameters: ConvertParameters;
@@ -155,7 +156,7 @@ const ConvertSettings = ({
           record.lastModified === file.lastModified
         );
       return fileRecord?.id;
-    }).filter((id): id is string => id !== undefined); // Type guard to ensure only strings
+    }).filter((id): id is FileId => id !== undefined); // Type guard to ensure only strings
 
     setSelectedFiles(fileIds);
   };

frontend/src/components/tools/shared/FileStatusIndicator.tsx

@@ -100,7 +100,7 @@ const FileStatusIndicator = ({
             style={{ cursor: 'pointer', display: 'inline-flex', alignItems: 'center', gap: '0.25rem' }}
           >
             <UploadIcon style={{ fontSize: '0.875rem' }} />
-            {t("files.upload", "Upload")}
+            {t("files.uploadFiles", "Upload Files")}
           </Anchor>
         </Text>
       );

frontend/src/components/viewer/Viewer.tsx

@@ -15,6 +15,7 @@ import { fileStorage } from "../../services/fileStorage";
 import SkeletonLoader from '../shared/SkeletonLoader';
 import { useFileState, useFileActions, useCurrentFile } from "../../contexts/FileContext";
 import { useFileWithUrl } from "../../hooks/useFileWithUrl";
+import { FileId } from "../../types/file";
 
 
 // Lazy loading page image component
@@ -378,7 +379,7 @@ const Viewer = ({
         }
         // Handle special IndexedDB URLs for large files
         else if (effectiveFile.url?.startsWith('indexeddb:')) {
-          const fileId = effectiveFile.url.replace('indexeddb:', '');
+          const fileId = effectiveFile.url.replace('indexeddb:', '') as FileId /* FIX ME: Not sure this is right - at least probably not the right place for this logic */;
 
           // Get data directly from IndexedDB
           const arrayBuffer = await fileStorage.getFileData(fileId);

frontend/src/contexts/FileContext.tsx

@@ -19,7 +19,6 @@ import {
   FileContextStateValue,
   FileContextActionsValue,
   FileContextActions,
-  FileId,
   FileRecord
 } from '../types/fileContext';
 
@@ -30,6 +29,7 @@ import { addFiles, consumeFiles, createFileActions } from './file/fileActions';
 import { FileLifecycleManager } from './file/lifecycle';
 import { FileStateContext, FileActionsContext } from './file/contexts';
 import { IndexedDBProvider, useIndexedDB } from './IndexedDBContext';
+import { FileId } from '../types/file';
 
 const DEBUG = process.env.NODE_ENV === 'development';
 
@@ -75,7 +75,6 @@ function FileContextInner({
   // File operations using unified addFiles helper with persistence
   const addRawFiles = useCallback(async (files: File[], options?: { insertAfterPageId?: string }): Promise<File[]> => {
     const addedFilesWithIds = await addFiles('raw', { files, ...options }, stateRef, filesRef, dispatch, lifecycleManager);
-    
     // Persist to IndexedDB if enabled
     if (indexedDB && enablePersistence && addedFilesWithIds.length > 0) {
       await Promise.all(addedFilesWithIds.map(async ({ file, id, thumbnail }) => {
@@ -110,7 +109,7 @@ function FileContextInner({
 
   // Helper to find FileId from File object
   const findFileId = useCallback((file: File): FileId | undefined => {
-    return Object.keys(stateRef.current.files.byId).find(id => {
+    return (Object.keys(stateRef.current.files.byId) as FileId[]).find(id => {
       const storedFile = filesRef.current.get(id);
       return storedFile &&
              storedFile.name === file.name &&
@@ -191,8 +190,8 @@ function FileContextInner({
     consumeFiles: consumeFilesWrapper,
     setHasUnsavedChanges,
     trackBlobUrl: lifecycleManager.trackBlobUrl,
-    cleanupFile: (fileId: string) => lifecycleManager.cleanupFile(fileId, stateRef),
+    cleanupFile: (fileId: FileId) => lifecycleManager.cleanupFile(fileId, stateRef),
-    scheduleCleanup: (fileId: string, delay?: number) => 
+    scheduleCleanup: (fileId: FileId, delay?: number) =>
       lifecycleManager.scheduleCleanup(fileId, delay, stateRef)
   }), [
     baseActions,

frontend/src/contexts/FileManagerContext.tsx

@@ -2,12 +2,13 @@ import React, { createContext, useContext, useState, useRef, useCallback, useEff
 import { FileMetadata } from '../types/file';
 import { StoredFile, fileStorage } from '../services/fileStorage';
 import { downloadFiles } from '../utils/downloadUtils';
+import { FileId } from '../types/file';
 
 // Type for the context value - now contains everything directly
 interface FileManagerContextValue {
   // State
   activeSource: 'recent' | 'local' | 'drive';
-  selectedFileIds: string[];
+  selectedFileIds: FileId[];
   searchTerm: string;
   selectedFiles: FileMetadata[];
   filteredFiles: FileMetadata[];
@@ -64,7 +65,7 @@ export const FileManagerProvider: React.FC<FileManagerProviderProps> = ({
   refreshRecentFiles,
 }) => {
   const [activeSource, setActiveSource] = useState<'recent' | 'local' | 'drive'>('recent');
-  const [selectedFileIds, setSelectedFileIds] = useState<string[]>([]);
+  const [selectedFileIds, setSelectedFileIds] = useState<FileId[]>([]);
   const [searchTerm, setSearchTerm] = useState('');
   const [lastClickedIndex, setLastClickedIndex] = useState<number | null>(null);
   const fileInputRef = useRef<HTMLInputElement>(null);

frontend/src/contexts/FilesModalContext.tsx

@@ -1,6 +1,7 @@
 import React, { createContext, useContext, useState, useCallback, useMemo } from 'react';
 import { useFileHandler } from '../hooks/useFileHandler';
 import { FileMetadata } from '../types/file';
+import { FileId } from '../types/file';
 
 interface FilesModalContextType {
   isFilesModalOpen: boolean;
@@ -8,7 +9,7 @@ interface FilesModalContextType {
   closeFilesModal: () => void;
   onFileSelect: (file: File) => void;
   onFilesSelect: (files: File[]) => void;
-  onStoredFilesSelect: (filesWithMetadata: Array<{ file: File; originalId: string; metadata: FileMetadata }>) => void;
+  onStoredFilesSelect: (filesWithMetadata: Array<{ file: File; originalId: FileId; metadata: FileMetadata }>) => void;
   onModalClose?: () => void;
   setOnModalClose: (callback: () => void) => void;
 }
@@ -57,7 +58,7 @@ export const FilesModalProvider: React.FC<{ children: React.ReactNode }> = ({ ch
     closeFilesModal();
   }, [addMultipleFiles, closeFilesModal, insertAfterPage, customHandler]);
 
-  const handleStoredFilesSelect = useCallback((filesWithMetadata: Array<{ file: File; originalId: string; metadata: FileMetadata }>) => {
+  const handleStoredFilesSelect = useCallback((filesWithMetadata: Array<{ file: File; originalId: FileId; metadata: FileMetadata }>) => {
     if (customHandler) {
       // Use custom handler for special cases (like page insertion)
       const files = filesWithMetadata.map(item => item.file);

frontend/src/contexts/IndexedDBContext.tsx

@@ -7,7 +7,7 @@ import React, { createContext, useContext, useCallback, useRef } from 'react';
 
 const DEBUG = process.env.NODE_ENV === 'development';
 import { fileStorage, StoredFile } from '../services/fileStorage';
-import { FileId } from '../types/fileContext';
+import { FileId } from '../types/file';
 import { FileMetadata } from '../types/file';
 import { generateThumbnailForFile } from '../utils/thumbnailUtils';
 

frontend/src/contexts/file/FileReducer.ts

@@ -2,10 +2,10 @@
  * FileContext reducer - Pure state management for file operations
  */
 
+import { FileId } from '../../types/file';
 import {
   FileContextState,
   FileContextAction,
-  FileId, 
   FileRecord
 } from '../../types/fileContext';
 

frontend/src/contexts/file/fileActions.ts

@@ -3,7 +3,6 @@
  */
 
 import {
-  FileId, 
   FileRecord,
   FileContextAction,
   FileContextState,
@@ -11,7 +10,7 @@ import {
   createFileId,
   createQuickKey
 } from '../../types/fileContext';
-import { FileMetadata } from '../../types/file';
+import { FileId, FileMetadata } from '../../types/file';
 import { generateThumbnailWithMetadata } from '../../utils/thumbnailUtils';
 import { FileLifecycleManager } from './lifecycle';
 import { fileProcessingService } from '../../services/fileProcessingService';

frontend/src/contexts/file/fileHooks.ts

@@ -9,7 +9,8 @@ import {
   FileContextStateValue,
   FileContextActionsValue
 } from './contexts';
-import { FileId, FileRecord } from '../../types/fileContext';
+import { FileRecord } from '../../types/fileContext';
+import { FileId } from '../../types/file';
 
 /**
  * Hook for accessing file state (will re-render on any state change)
@@ -164,9 +165,9 @@ export function useFileContext() {
     // File management
     addFiles: actions.addFiles,
     consumeFiles: actions.consumeFiles,
-    recordOperation: (fileId: string, operation: any) => {}, // Operation tracking not implemented
+    recordOperation: (fileId: FileId, operation: any) => {}, // Operation tracking not implemented
-    markOperationApplied: (fileId: string, operationId: string) => {}, // Operation tracking not implemented  
+    markOperationApplied: (fileId: FileId, operationId: string) => {}, // Operation tracking not implemented
-    markOperationFailed: (fileId: string, operationId: string, error: string) => {}, // Operation tracking not implemented
+    markOperationFailed: (fileId: FileId, operationId: string, error: string) => {}, // Operation tracking not implemented
 
     // File ID lookup
     findFileId: (file: File) => {

frontend/src/contexts/file/fileSelectors.ts

@@ -2,8 +2,8 @@
  * File selectors - Pure functions for accessing file state
  */
 
+import { FileId } from '../../types/file';
 import {
-  FileId, 
   FileRecord,
   FileContextState,
   FileContextSelectors
@@ -64,7 +64,7 @@ export function createFileSelectors(
 
     isFilePinned: (file: File) => {
       // Find FileId by matching File object properties
-      const fileId = Object.keys(stateRef.current.files.byId).find(id => {
+      const fileId = (Object.keys(stateRef.current.files.byId) as FileId[]).find(id => {
         const storedFile = filesRef.current.get(id);
         return storedFile &&
                storedFile.name === file.name &&

frontend/src/contexts/file/lifecycle.ts

@@ -2,7 +2,8 @@
  * File lifecycle management - Resource cleanup and memory management
  */
 
-import { FileId, FileContextAction, FileRecord, ProcessedFilePage } from '../../types/fileContext';
+import { FileId } from '../../types/file';
+import { FileContextAction, FileRecord, ProcessedFilePage } from '../../types/fileContext';
 
 const DEBUG = process.env.NODE_ENV === 'development';
 
@@ -33,7 +34,7 @@ export class FileLifecycleManager {
   /**
    * Clean up resources for a specific file (with stateRef access for complete cleanup)
    */
-  cleanupFile = (fileId: string, stateRef?: React.MutableRefObject<any>): void => {
+  cleanupFile = (fileId: FileId, stateRef?: React.MutableRefObject<any>): void => {
     // Use comprehensive cleanup (same as removeFiles)
     this.cleanupAllResourcesForFile(fileId, stateRef);
 
@@ -67,7 +68,7 @@ export class FileLifecycleManager {
   /**
    * Schedule delayed cleanup for a file with generation token to prevent stale cleanup
    */
-  scheduleCleanup = (fileId: string, delay: number = 30000, stateRef?: React.MutableRefObject<any>): void => {
+  scheduleCleanup = (fileId: FileId, delay: number = 30000, stateRef?: React.MutableRefObject<any>): void => {
     // Cancel existing timer
     const existingTimer = this.cleanupTimers.get(fileId);
     if (existingTimer) {

frontend/src/hooks/tools/addPassword/useAddPasswordOperation.test.ts

@@ -4,9 +4,13 @@ import { useAddPasswordOperation } from './useAddPasswordOperation';
 import type { AddPasswordFullParameters, AddPasswordParameters } from './useAddPasswordParameters';
 
 // Mock the useToolOperation hook
-vi.mock('../shared/useToolOperation', () => ({
+vi.mock('../shared/useToolOperation', async () => {
+  const actual = await vi.importActual('../shared/useToolOperation');  // Need to keep ToolType etc.
+  return {
+    ...actual,
     useToolOperation: vi.fn()
-}));
+  };
+});
 
 // Mock the translation hook
 const mockT = vi.fn((key: string) => `translated-${key}`);
@@ -20,13 +24,13 @@ vi.mock('../../../utils/toolErrorHandler', () => ({
 }));
 
 // Import the mocked function
-import { ToolOperationConfig, ToolOperationHook, useToolOperation } from '../shared/useToolOperation';
+import { SingleFileToolOperationConfig, ToolOperationHook, ToolType, useToolOperation } from '../shared/useToolOperation';
 
 
 describe('useAddPasswordOperation', () => {
   const mockUseToolOperation = vi.mocked(useToolOperation);
 
-  const getToolConfig = (): ToolOperationConfig<AddPasswordFullParameters> => mockUseToolOperation.mock.calls[0][0] as ToolOperationConfig<AddPasswordFullParameters>;
+  const getToolConfig = () => mockUseToolOperation.mock.calls[0][0] as SingleFileToolOperationConfig<AddPasswordFullParameters>;
 
   const mockToolOperationReturn: ToolOperationHook<unknown> = {
     files: [],
@@ -91,7 +95,7 @@ describe('useAddPasswordOperation', () => {
     };
 
     const testFile = new File(['test content'], 'test.pdf', { type: 'application/pdf' });
-    const formData = buildFormData(testParameters, testFile as any /* FIX ME */);
+    const formData = buildFormData(testParameters, testFile);
 
     // Verify the form data contains the file
     expect(formData.get('fileInput')).toBe(testFile);
@@ -112,7 +116,7 @@ describe('useAddPasswordOperation', () => {
   });
 
   test.each([
-    { property: 'multiFileEndpoint' as const, expectedValue: false },
+    { property: 'toolType' as const, expectedValue: ToolType.singleFile },
     { property: 'endpoint' as const, expectedValue: '/api/v1/security/add-password' },
     { property: 'filePrefix' as const, expectedValue: 'translated-addPassword.filenamePrefix_' },
     { property: 'operationType' as const, expectedValue: 'addPassword' }

frontend/src/hooks/tools/addPassword/useAddPasswordOperation.ts

@@ -1,5 +1,5 @@
 import { useTranslation } from 'react-i18next';
-import { useToolOperation } from '../shared/useToolOperation';
+import { ToolType, useToolOperation } from '../shared/useToolOperation';
 import { createStandardErrorHandler } from '../../../utils/toolErrorHandler';
 import { AddPasswordFullParameters, defaultParameters } from './useAddPasswordParameters';
 import { defaultParameters as permissionsDefaults } from '../changePermissions/useChangePermissionsParameters';
@@ -26,11 +26,11 @@ const fullDefaultParameters: AddPasswordFullParameters = {
 
 // Static configuration object
 export const addPasswordOperationConfig = {
+  toolType: ToolType.singleFile,
+  buildFormData: buildAddPasswordFormData,
   operationType: 'addPassword',
   endpoint: '/api/v1/security/add-password',
-  buildFormData: buildAddPasswordFormData,
   filePrefix: 'encrypted_', // Will be overridden in hook with translation
-  multiFileEndpoint: false,
   defaultParameters: fullDefaultParameters,
 } as const;
 

frontend/src/hooks/tools/addWatermark/useAddWatermarkOperation.ts

@@ -1,5 +1,5 @@
 import { useTranslation } from 'react-i18next';
-import { useToolOperation } from '../shared/useToolOperation';
+import { ToolType, useToolOperation } from '../shared/useToolOperation';
 import { createStandardErrorHandler } from '../../../utils/toolErrorHandler';
 import { AddWatermarkParameters, defaultParameters } from './useAddWatermarkParameters';
 
@@ -35,11 +35,11 @@ export const buildAddWatermarkFormData = (parameters: AddWatermarkParameters, fi
 
 // Static configuration object
 export const addWatermarkOperationConfig = {
+  toolType: ToolType.singleFile,
+  buildFormData: buildAddWatermarkFormData,
   operationType: 'watermark',
   endpoint: '/api/v1/security/add-watermark',
-  buildFormData: buildAddWatermarkFormData,
   filePrefix: 'watermarked_', // Will be overridden in hook with translation
-  multiFileEndpoint: false,
   defaultParameters,
 } as const;
 

frontend/src/hooks/tools/automate/useAutomateOperation.ts

@@ -1,4 +1,4 @@
-import { useToolOperation } from '../shared/useToolOperation';
+import { ToolType, useToolOperation } from '../shared/useToolOperation';
 import { useCallback } from 'react';
 import { executeAutomationSequence } from '../../../utils/automationExecutor';
 import { useFlatToolRegistry } from '../../../data/useTranslatedToolRegistry';
@@ -40,9 +40,8 @@ export function useAutomateOperation() {
   }, [toolRegistry]);
 
   return useToolOperation<AutomateParameters>({
+    toolType: ToolType.custom,
     operationType: 'automate',
-    endpoint: '/api/v1/pipeline/handleData', // Not used with customProcessor
-    buildFormData: () => new FormData(), // Not used with customProcessor
     customProcessor,
     filePrefix: '' // No prefix needed since automation handles naming internally
   });

frontend/src/hooks/tools/changePermissions/useChangePermissionsOperation.test.ts

@@ -4,9 +4,13 @@ import { useChangePermissionsOperation } from './useChangePermissionsOperation';
 import type { ChangePermissionsParameters } from './useChangePermissionsParameters';
 
 // Mock the useToolOperation hook
-vi.mock('../shared/useToolOperation', () => ({
+vi.mock('../shared/useToolOperation', async () => {
+  const actual = await vi.importActual('../shared/useToolOperation');  // Need to keep ToolType etc.
+  return {
+    ...actual,
     useToolOperation: vi.fn()
-}));
+  };
+});
 
 // Mock the translation hook
 const mockT = vi.fn((key: string) => `translated-${key}`);
@@ -20,12 +24,12 @@ vi.mock('../../../utils/toolErrorHandler', () => ({
 }));
 
 // Import the mocked function
-import { ToolOperationConfig, ToolOperationHook, useToolOperation } from '../shared/useToolOperation';
+import { SingleFileToolOperationConfig, ToolOperationHook, ToolType, useToolOperation } from '../shared/useToolOperation';
 
 describe('useChangePermissionsOperation', () => {
   const mockUseToolOperation = vi.mocked(useToolOperation);
 
-  const getToolConfig = (): ToolOperationConfig<ChangePermissionsParameters> => mockUseToolOperation.mock.calls[0][0] as ToolOperationConfig<ChangePermissionsParameters>;
+  const getToolConfig = () => mockUseToolOperation.mock.calls[0][0] as SingleFileToolOperationConfig<ChangePermissionsParameters>;
 
   const mockToolOperationReturn: ToolOperationHook<unknown> = {
     files: [],
@@ -86,7 +90,7 @@ describe('useChangePermissionsOperation', () => {
     const buildFormData = callArgs.buildFormData;
 
     const testFile = new File(['test content'], 'test.pdf', { type: 'application/pdf' });
-    const formData = buildFormData(testParameters, testFile as any /* FIX ME */);
+    const formData = buildFormData(testParameters, testFile);
 
     // Verify the form data contains the file
     expect(formData.get('fileInput')).toBe(testFile);
@@ -106,7 +110,7 @@ describe('useChangePermissionsOperation', () => {
   });
 
   test.each([
-    { property: 'multiFileEndpoint' as const, expectedValue: false },
+    { property: 'toolType' as const, expectedValue: ToolType.singleFile },
     { property: 'endpoint' as const, expectedValue: '/api/v1/security/add-password' },
     { property: 'filePrefix' as const, expectedValue: 'permissions_' },
     { property: 'operationType' as const, expectedValue: 'change-permissions' }

frontend/src/hooks/tools/changePermissions/useChangePermissionsOperation.ts

@@ -1,5 +1,5 @@
 import { useTranslation } from 'react-i18next';
-import { useToolOperation } from '../shared/useToolOperation';
+import { ToolType, useToolOperation } from '../shared/useToolOperation';
 import { createStandardErrorHandler } from '../../../utils/toolErrorHandler';
 import { ChangePermissionsParameters, defaultParameters } from './useChangePermissionsParameters';
 
@@ -24,11 +24,11 @@ export const buildChangePermissionsFormData = (parameters: ChangePermissionsPara
 
 // Static configuration object
 export const changePermissionsOperationConfig = {
+  toolType: ToolType.singleFile,
+  buildFormData: buildChangePermissionsFormData,
   operationType: 'change-permissions',
   endpoint: '/api/v1/security/add-password', // Change Permissions is a fake endpoint for the Add Password tool
-  buildFormData: buildChangePermissionsFormData,
   filePrefix: 'permissions_',
-  multiFileEndpoint: false,
   defaultParameters,
 } as const;
 
@@ -39,6 +39,6 @@ export const useChangePermissionsOperation = () => {
     ...changePermissionsOperationConfig,
     getErrorMessage: createStandardErrorHandler(
       t('changePermissions.error.failed', 'An error occurred while changing PDF permissions.')
-    )
+    ),
   });
 };

frontend/src/hooks/tools/compress/useCompressOperation.ts

@@ -1,5 +1,5 @@
 import { useTranslation } from 'react-i18next';
-import { useToolOperation, ToolOperationConfig } from '../shared/useToolOperation';
+import { useToolOperation, ToolOperationConfig, ToolType } from '../shared/useToolOperation';
 import { createStandardErrorHandler } from '../../../utils/toolErrorHandler';
 import { CompressParameters, defaultParameters } from './useCompressParameters';
 
@@ -24,11 +24,11 @@ export const buildCompressFormData = (parameters: CompressParameters, file: File
 
 // Static configuration object
 export const compressOperationConfig = {
+  toolType: ToolType.singleFile,
+  buildFormData: buildCompressFormData,
   operationType: 'compress',
   endpoint: '/api/v1/misc/compress-pdf',
-  buildFormData: buildCompressFormData,
   filePrefix: 'compressed_',
-  multiFileEndpoint: false, // Individual API calls per file
   defaultParameters,
 } as const;
 

frontend/src/hooks/tools/convert/useConvertOperation.ts

@@ -4,7 +4,7 @@ import { useTranslation } from 'react-i18next';
 import { ConvertParameters, defaultParameters } from './useConvertParameters';
 import { detectFileExtension } from '../../../utils/fileUtils';
 import { createFileFromApiResponse } from '../../../utils/fileResponseUtils';
-import { useToolOperation, ToolOperationConfig } from '../shared/useToolOperation';
+import { useToolOperation, ToolOperationConfig, ToolType } from '../shared/useToolOperation';
 import { getEndpointUrl, isImageFormat, isWebFormat } from '../../../utils/convertUtils';
 
 // Static function that can be used by both the hook and automation executor
@@ -129,11 +129,10 @@ export const convertProcessor = async (
 
 // Static configuration object
 export const convertOperationConfig = {
+  toolType: ToolType.custom,
+  customProcessor: convertProcessor, // Can't use callback version here
   operationType: 'convert',
-  endpoint: '', // Not used with customProcessor but required
-  buildFormData: buildConvertFormData, // Not used with customProcessor but required
   filePrefix: 'converted_',
-  customProcessor: convertProcessor,
   defaultParameters,
 } as const;
 
@@ -158,6 +157,6 @@ export const useConvertOperation = () => {
         return error.message;
       }
       return t("convert.errorConversion", "An error occurred while converting the file.");
-    }
+    },
   });
 };

frontend/src/hooks/tools/ocr/useOCROperation.ts

@@ -1,7 +1,7 @@
 import { useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
 import { OCRParameters, defaultParameters } from './useOCRParameters';
-import { useToolOperation, ToolOperationConfig } from '../shared/useToolOperation';
+import { useToolOperation, ToolOperationConfig, ToolType } from '../shared/useToolOperation';
 import { createStandardErrorHandler } from '../../../utils/toolErrorHandler';
 import { useToolResources } from '../shared/useToolResources';
 
@@ -94,11 +94,11 @@ export const ocrResponseHandler = async (blob: Blob, originalFiles: File[], extr
 
 // Static configuration object (without t function dependencies)
 export const ocrOperationConfig = {
+  toolType: ToolType.singleFile,
+  buildFormData: buildOCRFormData,
   operationType: 'ocr',
   endpoint: '/api/v1/misc/ocr-pdf',
-  buildFormData: buildOCRFormData,
   filePrefix: 'ocr_',
-  multiFileEndpoint: false,
   defaultParameters,
 } as const;
 

frontend/src/hooks/tools/removeCertificateSign/useRemoveCertificateSignOperation.ts

@@ -1,5 +1,5 @@
 import { useTranslation } from 'react-i18next';
-import { useToolOperation } from '../shared/useToolOperation';
+import { ToolType, useToolOperation } from '../shared/useToolOperation';
 import { createStandardErrorHandler } from '../../../utils/toolErrorHandler';
 import { RemoveCertificateSignParameters, defaultParameters } from './useRemoveCertificateSignParameters';
 
@@ -12,11 +12,11 @@ export const buildRemoveCertificateSignFormData = (parameters: RemoveCertificate
 
 // Static configuration object
 export const removeCertificateSignOperationConfig = {
+  toolType: ToolType.singleFile,
+  buildFormData: buildRemoveCertificateSignFormData,
   operationType: 'remove-certificate-sign',
   endpoint: '/api/v1/security/remove-cert-sign',
-  buildFormData: buildRemoveCertificateSignFormData,
   filePrefix: 'unsigned_', // Will be overridden in hook with translation
-  multiFileEndpoint: false,
   defaultParameters,
 } as const;
 

frontend/src/hooks/tools/removePassword/useRemovePasswordOperation.test.ts

@@ -3,10 +3,13 @@ import { renderHook } from '@testing-library/react';
 import { useRemovePasswordOperation } from './useRemovePasswordOperation';
 import type { RemovePasswordParameters } from './useRemovePasswordParameters';
 
-// Mock the useToolOperation hook
+vi.mock('../shared/useToolOperation', async () => {
-vi.mock('../shared/useToolOperation', () => ({
+  const actual = await vi.importActual('../shared/useToolOperation');  // Need to keep ToolType etc.
+  return {
+    ...actual,
     useToolOperation: vi.fn()
-}));
+  };
+});
 
 // Mock the translation hook
 const mockT = vi.fn((key: string) => `translated-${key}`);
@@ -20,12 +23,12 @@ vi.mock('../../../utils/toolErrorHandler', () => ({
 }));
 
 // Import the mocked function
-import { ToolOperationConfig, ToolOperationHook, useToolOperation } from '../shared/useToolOperation';
+import { SingleFileToolOperationConfig, ToolOperationHook, ToolType, useToolOperation } from '../shared/useToolOperation';
 
 describe('useRemovePasswordOperation', () => {
   const mockUseToolOperation = vi.mocked(useToolOperation);
 
-  const getToolConfig = (): ToolOperationConfig<RemovePasswordParameters> => mockUseToolOperation.mock.calls[0][0] as ToolOperationConfig<RemovePasswordParameters>;
+  const getToolConfig = () => mockUseToolOperation.mock.calls[0][0] as SingleFileToolOperationConfig<RemovePasswordParameters>;
 
   const mockToolOperationReturn: ToolOperationHook<unknown> = {
     files: [],
@@ -91,7 +94,7 @@ describe('useRemovePasswordOperation', () => {
   });
 
   test.each([
-    { property: 'multiFileEndpoint' as const, expectedValue: false },
+    { property: 'toolType' as const, expectedValue: ToolType.singleFile },
     { property: 'endpoint' as const, expectedValue: '/api/v1/security/remove-password' },
     { property: 'filePrefix' as const, expectedValue: 'translated-removePassword.filenamePrefix_' },
     { property: 'operationType' as const, expectedValue: 'removePassword' }

frontend/src/hooks/tools/removePassword/useRemovePasswordOperation.ts

@@ -1,5 +1,5 @@
 import { useTranslation } from 'react-i18next';
-import { useToolOperation } from '../shared/useToolOperation';
+import { ToolType, useToolOperation } from '../shared/useToolOperation';
 import { createStandardErrorHandler } from '../../../utils/toolErrorHandler';
 import { RemovePasswordParameters, defaultParameters } from './useRemovePasswordParameters';
 
@@ -13,11 +13,11 @@ export const buildRemovePasswordFormData = (parameters: RemovePasswordParameters
 
 // Static configuration object
 export const removePasswordOperationConfig = {
+  toolType: ToolType.singleFile,
+  buildFormData: buildRemovePasswordFormData,
   operationType: 'removePassword',
   endpoint: '/api/v1/security/remove-password',
-  buildFormData: buildRemovePasswordFormData,
   filePrefix: 'decrypted_', // Will be overridden in hook with translation
-  multiFileEndpoint: false,
   defaultParameters,
 } as const;
 

frontend/src/hooks/tools/repair/useRepairOperation.ts

@@ -1,5 +1,5 @@
 import { useTranslation } from 'react-i18next';
-import { useToolOperation } from '../shared/useToolOperation';
+import { ToolType, useToolOperation } from '../shared/useToolOperation';
 import { createStandardErrorHandler } from '../../../utils/toolErrorHandler';
 import { RepairParameters, defaultParameters } from './useRepairParameters';
 
@@ -12,11 +12,11 @@ export const buildRepairFormData = (parameters: RepairParameters, file: File): F
 
 // Static configuration object
 export const repairOperationConfig = {
+  toolType: ToolType.singleFile,
+  buildFormData: buildRepairFormData,
   operationType: 'repair',
   endpoint: '/api/v1/misc/repair',
-  buildFormData: buildRepairFormData,
   filePrefix: 'repaired_', // Will be overridden in hook with translation
-  multiFileEndpoint: false,
   defaultParameters,
 } as const;
 

frontend/src/hooks/tools/sanitize/useSanitizeOperation.ts

@@ -1,5 +1,5 @@
 import { useTranslation } from 'react-i18next';
-import { useToolOperation } from '../shared/useToolOperation';
+import { ToolType, useToolOperation } from '../shared/useToolOperation';
 import { createStandardErrorHandler } from '../../../utils/toolErrorHandler';
 import { SanitizeParameters, defaultParameters } from './useSanitizeParameters';
 
@@ -21,9 +21,10 @@ export const buildSanitizeFormData = (parameters: SanitizeParameters, file: File
 
 // Static configuration object
 export const sanitizeOperationConfig = {
+  toolType: ToolType.singleFile,
+  buildFormData: buildSanitizeFormData,
   operationType: 'sanitize',
   endpoint: '/api/v1/security/sanitize-pdf',
-  buildFormData: buildSanitizeFormData,
   filePrefix: 'sanitized_', // Will be overridden in hook with translation
   multiFileEndpoint: false,
   defaultParameters,

frontend/src/hooks/tools/shared/useBaseTool.ts

@@ -0,0 +1,118 @@
+import { useEffect, useCallback } from 'react';
+import { useFileSelection } from '../../../contexts/FileContext';
+import { useEndpointEnabled } from '../../useEndpointConfig';
+import { BaseToolProps } from '../../../types/tool';
+import { ToolOperationHook } from './useToolOperation';
+import { BaseParametersHook } from './useBaseParameters';
+
+interface BaseToolReturn<TParams> {
+  // File management
+  selectedFiles: File[];
+
+  // Tool-specific hooks
+  params: BaseParametersHook<TParams>;
+  operation: ToolOperationHook<TParams>;
+
+  // Endpoint validation
+  endpointEnabled: boolean | null;
+  endpointLoading: boolean;
+
+  // Standard handlers
+  handleExecute: () => Promise<void>;
+  handleThumbnailClick: (file: File) => void;
+  handleSettingsReset: () => void;
+
+  // Standard computed state
+  hasFiles: boolean;
+  hasResults: boolean;
+  settingsCollapsed: boolean;
+}
+
+/**
+ * Base tool hook for tool components. Manages standard behaviour for tools.
+ */
+export function useBaseTool<TParams>(
+  toolName: string,
+  useParams: () => BaseParametersHook<TParams>,
+  useOperation: () => ToolOperationHook<TParams>,
+  props: BaseToolProps,
+): BaseToolReturn<TParams> {
+  const { onPreviewFile, onComplete, onError } = props;
+
+  // File selection
+  const { selectedFiles } = useFileSelection();
+
+  // Tool-specific hooks
+  const params = useParams();
+  const operation = useOperation();
+
+  // Endpoint validation using parameters hook
+  const { enabled: endpointEnabled, loading: endpointLoading } = useEndpointEnabled(params.getEndpointName());
+
+  // Reset results when parameters change
+  useEffect(() => {
+    operation.resetResults();
+    onPreviewFile?.(null);
+  }, [params.parameters]);
+
+  // Reset results when selected files change
+  useEffect(() => {
+    if (selectedFiles.length > 0) {
+      operation.resetResults();
+      onPreviewFile?.(null);
+    }
+  }, [selectedFiles.length]);
+
+  // Standard handlers
+  const handleExecute = useCallback(async () => {
+    try {
+      await operation.executeOperation(params.parameters, selectedFiles);
+      if (operation.files && onComplete) {
+        onComplete(operation.files);
+      }
+    } catch (error) {
+      if (onError) {
+        const message = error instanceof Error ? error.message : `${toolName} operation failed`;
+        onError(message);
+      }
+    }
+  }, [operation, params.parameters, selectedFiles, onComplete, onError, toolName]);
+
+  const handleThumbnailClick = useCallback((file: File) => {
+    onPreviewFile?.(file);
+    sessionStorage.setItem('previousMode', toolName);
+  }, [onPreviewFile, toolName]);
+
+  const handleSettingsReset = useCallback(() => {
+    operation.resetResults();
+    onPreviewFile?.(null);
+  }, [operation, onPreviewFile]);
+
+  // Standard computed state
+  const hasFiles = selectedFiles.length > 0;
+  const hasResults = operation.files.length > 0 || operation.downloadUrl !== null;
+  const settingsCollapsed = !hasFiles || hasResults;
+
+  return {
+    // File management
+    selectedFiles,
+
+    // Tool-specific hooks
+    params,
+    operation,
+
+    // Endpoint validation
+    endpointEnabled,
+    endpointLoading,
+
+    // Handlers
+    handleExecute,
+    handleThumbnailClick,
+    handleSettingsReset,
+
+    // State
+    hasFiles,
+    hasResults,
+    settingsCollapsed
+  };
+}

frontend/src/hooks/tools/shared/useToolOperation.ts

@@ -8,10 +8,17 @@ import { useToolResources } from './useToolResources';
 import { extractErrorMessage } from '../../../utils/toolErrorHandler';
 import { createOperation } from '../../../utils/toolOperationTracker';
 import { ResponseHandler } from '../../../utils/toolResponseProcessor';
+import { FileId } from '../../../types/file';
 
 // Re-export for backwards compatibility
 export type { ProcessingProgress, ResponseHandler };
 
+export enum ToolType {
+  singleFile,
+  multiFile,
+  custom,
+}
+
 /**
  * Configuration for tool operations defining processing behavior and API integration.
  *
@@ -20,45 +27,16 @@ export type { ProcessingProgress, ResponseHandler };
  * 2. Multi-file tools: multiFileEndpoint: true, single API call with all files
  * 3. Complex tools: customProcessor handles all processing logic
  */
-export interface ToolOperationConfig<TParams = void> {
+interface BaseToolOperationConfig<TParams> {
   /** Operation identifier for tracking and logging */
   operationType: string;
 
-  /**
-   * API endpoint for the operation. Can be static string or function for dynamic routing.
-   * Not used when customProcessor is provided.
-   */
-  endpoint: string | ((params: TParams) => string);
-
-  /**
-   * Builds FormData for API request. Signature determines processing approach:
-   * - (params, file: File) => FormData: Single-file processing
-   * - (params, files: File[]) => FormData: Multi-file processing
-   * Not used when customProcessor is provided.
-   */
-  buildFormData: ((params: TParams, file: File) => FormData) | ((params: TParams, files: File[]) => FormData); /* FIX ME */
-
   /** Prefix added to processed filenames (e.g., 'compressed_', 'split_') */
   filePrefix: string;
 
-  /**
-   * Whether this tool uses backends that accept MultipartFile[] arrays.
-   * - true: Single API call with all files (backend uses MultipartFile[])
-   * - false/undefined: Individual API calls per file (backend uses single MultipartFile)
-   * Ignored when customProcessor is provided.
-   */
-  multiFileEndpoint?: boolean;
-
   /** How to handle API responses (e.g., ZIP extraction, single file response) */
   responseHandler?: ResponseHandler;
 
-  /**
-   * Custom processing logic that completely bypasses standard file processing.
-   * When provided, tool handles all API calls, response processing, and file creation.
-   * Use for tools with complex routing logic or non-standard processing requirements.
-   */
-  customProcessor?: (params: TParams, files: File[]) => Promise<File[]>;
-
   /** Extract user-friendly error messages from API errors */
   getErrorMessage?: (error: any) => string;
 
@@ -66,6 +44,49 @@ export interface ToolOperationConfig<TParams = void> {
   defaultParameters?: TParams;
 }
 
+export interface SingleFileToolOperationConfig<TParams> extends BaseToolOperationConfig<TParams> {
+  /** This tool processes one file at a time. */
+  toolType: ToolType.singleFile;
+
+  /** Builds FormData for API request. */
+  buildFormData: ((params: TParams, file: File) => FormData);
+
+  /** API endpoint for the operation. Can be static string or function for dynamic routing. */
+  endpoint: string | ((params: TParams) => string);
+
+  customProcessor?: undefined;
+}
+
+export interface MultiFileToolOperationConfig<TParams> extends BaseToolOperationConfig<TParams> {
+  /** This tool processes multiple files at once. */
+  toolType: ToolType.multiFile;
+
+  /** Builds FormData for API request. */
+  buildFormData: ((params: TParams, files: File[]) => FormData);
+
+  /** API endpoint for the operation. Can be static string or function for dynamic routing. */
+  endpoint: string | ((params: TParams) => string);
+
+  customProcessor?: undefined;
+}
+
+export interface CustomToolOperationConfig<TParams> extends BaseToolOperationConfig<TParams> {
+  /** This tool has custom behaviour. */
+  toolType: ToolType.custom;
+
+  buildFormData?: undefined;
+  endpoint?: undefined;
+
+  /**
+   * Custom processing logic that completely bypasses standard file processing.
+   * This tool handles all API calls, response processing, and file creation.
+   * Use for tools with complex routing logic or non-standard processing requirements.
+   */
+  customProcessor: (params: TParams, files: File[]) => Promise<File[]>;
+}
+
+export type ToolOperationConfig<TParams = void> = SingleFileToolOperationConfig<TParams> | MultiFileToolOperationConfig<TParams> | CustomToolOperationConfig<TParams>;
+
 /**
  * Complete tool operation interface with execution capability
  */
@@ -103,7 +124,7 @@ export { createStandardErrorHandler } from '../../../utils/toolErrorHandler';
  * @param config - Tool operation configuration
  * @returns Hook interface with state and execution methods
  */
-export const useToolOperation = <TParams = void>(
+export const useToolOperation = <TParams>(
   config: ToolOperationConfig<TParams>
 ): ToolOperationHook<TParams> => {
   const { t } = useTranslation();
@@ -143,15 +164,28 @@ export const useToolOperation = <TParams = void>(
     try {
       let processedFiles: File[];
 
-      if (config.customProcessor) {
+      switch (config.toolType) {
-        actions.setStatus('Processing files...');
+        case ToolType.singleFile:
-        processedFiles = await config.customProcessor(params, validFiles);
+          // Individual file processing - separate API call per file
-      } else {
+          const apiCallsConfig: ApiCallsConfig<TParams> = {
-        // Use explicit multiFileEndpoint flag to determine processing approach
+            endpoint: config.endpoint,
-        if (config.multiFileEndpoint) {
+            buildFormData: config.buildFormData,
+            filePrefix: config.filePrefix,
+            responseHandler: config.responseHandler
+          };
+          processedFiles = await processFiles(
+            params,
+            validFiles,
+            apiCallsConfig,
+            actions.setProgress,
+            actions.setStatus
+          );
+          break;
+
+        case ToolType.multiFile:
           // Multi-file processing - single API call with all files
           actions.setStatus('Processing files...');
-          const formData = (config.buildFormData as (params: TParams, files: File[]) => FormData)(params, validFiles);
+          const formData = config.buildFormData(params, validFiles);
           const endpoint = typeof config.endpoint === 'function' ? config.endpoint(params) : config.endpoint;
 
           const response = await axios.post(endpoint, formData, { responseType: 'blob' });
@@ -175,22 +209,12 @@ export const useToolOperation = <TParams = void>(
               processedFiles = await extractAllZipFiles(response.data);
             }
           }
-        } else {
+          break;
-          // Individual file processing - separate API call per file
+
-          const apiCallsConfig: ApiCallsConfig<TParams> = {
+        case ToolType.custom:
-            endpoint: config.endpoint,
+          actions.setStatus('Processing files...');
-            buildFormData: config.buildFormData as (params: TParams, file: File) => FormData,
+          processedFiles = await config.customProcessor(params, validFiles);
-            filePrefix: config.filePrefix,
+          break;
-            responseHandler: config.responseHandler
-          };
-          processedFiles = await processFiles(
-            params,
-            validFiles,
-            apiCallsConfig,
-            actions.setProgress,
-            actions.setStatus
-          );
-        }
       }
 
       if (processedFiles.length > 0) {
@@ -208,7 +232,7 @@ export const useToolOperation = <TParams = void>(
         actions.setDownloadInfo(downloadInfo.url, downloadInfo.filename);
 
         // Replace input files with processed files (consumeFiles handles pinning)
-        const inputFileIds = validFiles.map(file => findFileId(file)).filter(Boolean) as string[];
+        const inputFileIds = validFiles.map(file => findFileId(file)).filter(Boolean) as FileId[];
         await consumeFiles(inputFileIds, processedFiles);
 
         markOperationApplied(fileId, operationId);

frontend/src/hooks/tools/singleLargePage/useSingleLargePageOperation.ts

@@ -1,5 +1,5 @@
 import { useTranslation } from 'react-i18next';
-import { useToolOperation } from '../shared/useToolOperation';
+import { ToolType, useToolOperation } from '../shared/useToolOperation';
 import { createStandardErrorHandler } from '../../../utils/toolErrorHandler';
 import { SingleLargePageParameters, defaultParameters } from './useSingleLargePageParameters';
 
@@ -12,11 +12,11 @@ export const buildSingleLargePageFormData = (parameters: SingleLargePageParamete
 
 // Static configuration object
 export const singleLargePageOperationConfig = {
+  toolType: ToolType.singleFile,
+  buildFormData: buildSingleLargePageFormData,
   operationType: 'single-large-page',
   endpoint: '/api/v1/general/pdf-to-single-page',
-  buildFormData: buildSingleLargePageFormData,
   filePrefix: 'single_page_', // Will be overridden in hook with translation
-  multiFileEndpoint: false,
   defaultParameters,
 } as const;
 

frontend/src/hooks/tools/split/useSplitOperation.ts

@@ -1,5 +1,5 @@
 import { useTranslation } from 'react-i18next';
-import { useToolOperation } from '../shared/useToolOperation';
+import { ToolType, useToolOperation } from '../shared/useToolOperation';
 import { createStandardErrorHandler } from '../../../utils/toolErrorHandler';
 import { SplitParameters, defaultParameters } from './useSplitParameters';
 import { SPLIT_MODES } from '../../../constants/splitConstants';
@@ -57,11 +57,11 @@ export const getSplitEndpoint = (parameters: SplitParameters): string => {
 
 // Static configuration object
 export const splitOperationConfig = {
+  toolType: ToolType.multiFile,
+  buildFormData: buildSplitFormData,
   operationType: 'splitPdf',
   endpoint: getSplitEndpoint,
-  buildFormData: buildSplitFormData,
   filePrefix: 'split_',
-  multiFileEndpoint: true, // Single API call with all files
   defaultParameters,
 } as const;
 

frontend/src/hooks/tools/unlockPdfForms/useUnlockPdfFormsOperation.ts

@@ -1,5 +1,5 @@
 import { useTranslation } from 'react-i18next';
-import { useToolOperation } from '../shared/useToolOperation';
+import { ToolType, useToolOperation } from '../shared/useToolOperation';
 import { createStandardErrorHandler } from '../../../utils/toolErrorHandler';
 import { UnlockPdfFormsParameters, defaultParameters } from './useUnlockPdfFormsParameters';
 
@@ -12,11 +12,11 @@ export const buildUnlockPdfFormsFormData = (parameters: UnlockPdfFormsParameters
 
 // Static configuration object
 export const unlockPdfFormsOperationConfig = {
+  toolType: ToolType.singleFile,
+  buildFormData: buildUnlockPdfFormsFormData,
   operationType: 'unlock-pdf-forms',
   endpoint: '/api/v1/misc/unlock-pdf-forms',
-  buildFormData: buildUnlockPdfFormsFormData,
   filePrefix: 'unlocked_forms_', // Will be overridden in hook with translation
-  multiFileEndpoint: false,
   defaultParameters,
 } as const;
 

frontend/src/hooks/useFileHandler.ts

@@ -1,6 +1,7 @@
 import { useCallback } from 'react';
 import { useFileState, useFileActions } from '../contexts/FileContext';
 import { FileMetadata } from '../types/file';
+import { FileId } from '../types/file';
 
 export const useFileHandler = () => {
   const { state } = useFileState(); // Still needed for addStoredFiles
@@ -17,7 +18,7 @@ export const useFileHandler = () => {
   }, [actions.addFiles]);
 
   // Add stored files preserving their original IDs to prevent session duplicates
-  const addStoredFiles = useCallback(async (filesWithMetadata: Array<{ file: File; originalId: string; metadata: FileMetadata }>) => {
+  const addStoredFiles = useCallback(async (filesWithMetadata: Array<{ file: File; originalId: FileId; metadata: FileMetadata }>) => {
     // Filter out files that already exist with the same ID (exact match)
     const newFiles = filesWithMetadata.filter(({ originalId }) => {
       return state.files.byId[originalId] === undefined;

frontend/src/hooks/useFileManager.ts

@@ -2,6 +2,7 @@ import { useState, useCallback } from 'react';
 import { useIndexedDB } from '../contexts/IndexedDBContext';
 import { FileMetadata } from '../types/file';
 import { generateThumbnailForFile } from '../utils/thumbnailUtils';
+import { FileId } from '../types/file';
 
 export const useFileManager = () => {
   const [loading, setLoading] = useState(false);
@@ -94,7 +95,7 @@ export const useFileManager = () => {
     }
   }, [indexedDB]);
 
-  const storeFile = useCallback(async (file: File, fileId: string) => {
+  const storeFile = useCallback(async (file: File, fileId: FileId) => {
     if (!indexedDB) {
       throw new Error('IndexedDB context not available');
     }
@@ -122,10 +123,10 @@ export const useFileManager = () => {
   }, [indexedDB]);
 
   const createFileSelectionHandlers = useCallback((
-    selectedFiles: string[],
+    selectedFiles: FileId[],
-    setSelectedFiles: (files: string[]) => void
+    setSelectedFiles: (files: FileId[]) => void
   ) => {
-    const toggleSelection = (fileId: string) => {
+    const toggleSelection = (fileId: FileId) => {
       setSelectedFiles(
         selectedFiles.includes(fileId)
           ? selectedFiles.filter(id => id !== fileId)
@@ -137,7 +138,7 @@ export const useFileManager = () => {
       setSelectedFiles([]);
     };
 
-    const selectMultipleFiles = async (files: FileMetadata[], onStoredFilesSelect: (filesWithMetadata: Array<{ file: File; originalId: string; metadata: FileMetadata }>) => void) => {
+    const selectMultipleFiles = async (files: FileMetadata[], onStoredFilesSelect: (filesWithMetadata: Array<{ file: File; originalId: FileId; metadata: FileMetadata }>) => void) => {
       if (selectedFiles.length === 0) return;
 
       try {
@@ -168,7 +169,7 @@ export const useFileManager = () => {
     };
   }, [convertToFile]);
 
-  const touchFile = useCallback(async (id: string) => {
+  const touchFile = useCallback(async (id: FileId) => {
     if (!indexedDB) {
       console.warn('IndexedDB context not available for touch operation');
       return;

frontend/src/hooks/useThumbnailGeneration.ts

@@ -1,5 +1,6 @@
 import { useCallback, useRef } from 'react';
 import { thumbnailGenerationService } from '../services/thumbnailGenerationService';
+import { FileId } from '../types/file';
 
 // Request queue to handle concurrent thumbnail requests
 interface ThumbnailRequest {
@@ -71,7 +72,7 @@ async function processRequestQueue() {
           console.log(`📸 Batch generating ${requests.length} thumbnails for pages: ${pageNumbers.slice(0, 5).join(', ')}${pageNumbers.length > 5 ? '...' : ''}`);
 
           // Use file name as fileId for PDF document caching
-          const fileId = file.name + '_' + file.size + '_' + file.lastModified;
+          const fileId = file.name + '_' + file.size + '_' + file.lastModified as FileId;
 
           const results = await thumbnailGenerationService.generateThumbnails(
             fileId,
@@ -115,7 +116,7 @@ async function processRequestQueue() {
  */
 export function useThumbnailGeneration() {
   const generateThumbnails = useCallback(async (
-    fileId: string,
+    fileId: FileId,
     pdfArrayBuffer: ArrayBuffer,
     pageNumbers: number[],
     options: {
@@ -166,7 +167,7 @@ export function useThumbnailGeneration() {
     thumbnailGenerationService.destroy();
   }, []);
 
-  const clearPDFCacheForFile = useCallback((fileId: string) => {
+  const clearPDFCacheForFile = useCallback((fileId: FileId) => {
     thumbnailGenerationService.clearPDFCacheForFile(fileId);
   }, []);
 

frontend/src/hooks/useToolManagement.tsx

@@ -3,19 +3,20 @@ import { useTranslation } from 'react-i18next';
 import { useFlatToolRegistry } from "../data/useTranslatedToolRegistry";
 import { getAllEndpoints, type ToolRegistryEntry } from "../data/toolsTaxonomy";
 import { useMultipleEndpointsEnabled } from "./useEndpointConfig";
+import { FileId } from '../types/file';
 
 interface ToolManagementResult {
   selectedTool: ToolRegistryEntry | null;
-  toolSelectedFileIds: string[];
+  toolSelectedFileIds: FileId[];
   toolRegistry: Record<string, ToolRegistryEntry>;
-  setToolSelectedFileIds: (fileIds: string[]) => void;
+  setToolSelectedFileIds: (fileIds: FileId[]) => void;
   getSelectedTool: (toolKey: string | null) => ToolRegistryEntry | null;
 }
 
 export const useToolManagement = (): ToolManagementResult => {
   const { t } = useTranslation();
 
-  const [toolSelectedFileIds, setToolSelectedFileIds] = useState<string[]>([]);
+  const [toolSelectedFileIds, setToolSelectedFileIds] = useState<FileId[]>([]);
 
   // Build endpoints list from registry entries with fallback to legacy mapping
   const baseRegistry = useFlatToolRegistry();

frontend/src/services/fileProcessingService.ts

@@ -7,6 +7,7 @@
 import * as pdfjsLib from 'pdfjs-dist';
 import { generateThumbnailForFile } from '../utils/thumbnailUtils';
 import { pdfWorkerManager } from './pdfWorkerManager';
+import { FileId } from '../types/file';
 
 export interface ProcessedFileMetadata {
   totalPages: number;
@@ -38,7 +39,7 @@ class FileProcessingService {
    * Process a file to extract metadata, page count, and generate thumbnails
    * This is the single source of truth for file processing
    */
-  async processFile(file: File, fileId: string): Promise<FileProcessingResult> {
+  async processFile(file: File, fileId: FileId): Promise<FileProcessingResult> {
     // Check if we're already processing this file
     const existingOperation = this.processingCache.get(fileId);
     if (existingOperation) {
@@ -67,7 +68,7 @@ class FileProcessingService {
     return processingPromise;
   }
 
-  private async performProcessing(file: File, fileId: string, abortController: AbortController): Promise<FileProcessingResult> {
+  private async performProcessing(file: File, fileId: FileId, abortController: AbortController): Promise<FileProcessingResult> {
     console.log(`📁 FileProcessingService: Starting processing for ${file.name} (${fileId})`);
 
     try {
@@ -167,14 +168,14 @@ class FileProcessingService {
   /**
    * Check if a file is currently being processed
    */
-  isProcessing(fileId: string): boolean {
+  isProcessing(fileId: FileId): boolean {
     return this.processingCache.has(fileId);
   }
 
   /**
    * Cancel processing for a specific file
    */
-  cancelProcessing(fileId: string): boolean {
+  cancelProcessing(fileId: FileId): boolean {
     const operation = this.processingCache.get(fileId);
     if (operation) {
       operation.abortController.abort();

frontend/src/services/fileStorage.ts

@@ -4,10 +4,11 @@
  * Now uses centralized IndexedDB manager
  */
 
+import { FileId } from '../types/file';
 import { indexedDBManager, DATABASE_CONFIGS } from './indexedDBManager';
 
 export interface StoredFile {
-  id: string;
+  id: FileId;
   name: string;
   type: string;
   size: number;
@@ -38,7 +39,7 @@ class FileStorageService {
   /**
    * Store a file in IndexedDB with external UUID
    */
-  async storeFile(file: File, fileId: string, thumbnail?: string): Promise<StoredFile> {
+  async storeFile(file: File, fileId: FileId, thumbnail?: string): Promise<StoredFile> {
     const db = await this.getDatabase();
 
     const arrayBuffer = await file.arrayBuffer();
@@ -88,7 +89,7 @@ class FileStorageService {
   /**
    * Retrieve a file from IndexedDB
    */
-  async getFile(id: string): Promise<StoredFile | null> {
+  async getFile(id: FileId): Promise<StoredFile | null> {
     const db = await this.getDatabase();
 
     return new Promise((resolve, reject) => {
@@ -166,7 +167,7 @@ class FileStorageService {
   /**
    * Delete a file from IndexedDB
    */
-  async deleteFile(id: string): Promise<void> {
+  async deleteFile(id: FileId): Promise<void> {
     const db = await this.getDatabase();
 
     return new Promise((resolve, reject) => {
@@ -182,7 +183,7 @@ class FileStorageService {
   /**
    * Update the lastModified timestamp of a file (for most recently used sorting)
    */
-  async touchFile(id: string): Promise<boolean> {
+  async touchFile(id: FileId): Promise<boolean> {
     const db = await this.getDatabase();
     return new Promise((resolve, reject) => {
       const transaction = db.transaction([this.storeName], 'readwrite');
@@ -438,7 +439,7 @@ class FileStorageService {
    * Convert StoredFile to the format expected by FileContext.addStoredFiles()
    * This is the recommended way to load stored files into FileContext
    */
-  createFileWithMetadata(storedFile: StoredFile): { file: File; originalId: string; metadata: { thumbnail?: string } } {
+  createFileWithMetadata(storedFile: StoredFile): { file: File; originalId: FileId; metadata: { thumbnail?: string } } {
     const file = this.createFileFromStored(storedFile);
 
     return {
@@ -461,7 +462,7 @@ class FileStorageService {
   /**
    * Get file data as ArrayBuffer for streaming/chunked processing
    */
-  async getFileData(id: string): Promise<ArrayBuffer | null> {
+  async getFileData(id: FileId): Promise<ArrayBuffer | null> {
     try {
       const storedFile = await this.getFile(id);
       return storedFile ? storedFile.data : null;
@@ -474,7 +475,7 @@ class FileStorageService {
   /**
    * Create a temporary blob URL that gets revoked automatically
    */
-  async createTemporaryBlobUrl(id: string): Promise<string | null> {
+  async createTemporaryBlobUrl(id: FileId): Promise<string | null> {
     const data = await this.getFileData(id);
     if (!data) return null;
 
@@ -492,7 +493,7 @@ class FileStorageService {
   /**
    * Update thumbnail for an existing file
    */
-  async updateThumbnail(id: string, thumbnail: string): Promise<boolean> {
+  async updateThumbnail(id: FileId, thumbnail: string): Promise<boolean> {
     const db = await this.getDatabase();
 
     return new Promise((resolve, reject) => {

frontend/src/services/thumbnailGenerationService.ts

@@ -2,6 +2,7 @@
  * High-performance thumbnail generation service using main thread processing
  */
 
+import { FileId } from '../types/file';
 import { pdfWorkerManager } from './pdfWorkerManager';
 
 interface ThumbnailResult {
@@ -32,12 +33,12 @@ interface CachedPDFDocument {
 
 export class ThumbnailGenerationService {
   // Session-based thumbnail cache
-  private thumbnailCache = new Map<string, CachedThumbnail>();
+  private thumbnailCache = new Map<FileId | string /* FIX ME: Page ID */, CachedThumbnail>();
   private maxCacheSizeBytes = 1024 * 1024 * 1024; // 1GB cache limit
   private currentCacheSize = 0;
 
   // PDF document cache to reuse PDF instances and avoid creating multiple workers
-  private pdfDocumentCache = new Map<string, CachedPDFDocument>();
+  private pdfDocumentCache = new Map<FileId, CachedPDFDocument>();
   private maxPdfCacheSize = 10; // Keep up to 10 PDF documents cached
 
   constructor(private maxWorkers: number = 10) {
@@ -47,7 +48,7 @@ export class ThumbnailGenerationService {
   /**
    * Get or create a cached PDF document
    */
-  private async getCachedPDFDocument(fileId: string, pdfArrayBuffer: ArrayBuffer): Promise<any> {
+  private async getCachedPDFDocument(fileId: FileId, pdfArrayBuffer: ArrayBuffer): Promise<any> {
     const cached = this.pdfDocumentCache.get(fileId);
     if (cached) {
       cached.lastUsed = Date.now();
@@ -79,7 +80,7 @@ export class ThumbnailGenerationService {
   /**
    * Release a reference to a cached PDF document
    */
-  private releasePDFDocument(fileId: string): void {
+  private releasePDFDocument(fileId: FileId): void {
     const cached = this.pdfDocumentCache.get(fileId);
     if (cached) {
       cached.refCount--;
@@ -91,7 +92,7 @@ export class ThumbnailGenerationService {
    * Evict the least recently used PDF document
    */
   private evictLeastRecentlyUsedPDF(): void {
-    let oldestEntry: [string, CachedPDFDocument] | null = null;
+    let oldestEntry: [FileId, CachedPDFDocument] | null = null;
     let oldestTime = Date.now();
 
     for (const [key, value] of this.pdfDocumentCache.entries()) {
@@ -111,7 +112,7 @@ export class ThumbnailGenerationService {
    * Generate thumbnails for multiple pages using main thread processing
    */
   async generateThumbnails(
-    fileId: string,
+    fileId: FileId,
     pdfArrayBuffer: ArrayBuffer,
     pageNumbers: number[],
     options: ThumbnailGenerationOptions = {},
@@ -142,7 +143,7 @@ export class ThumbnailGenerationService {
    * Main thread thumbnail generation with batching for UI responsiveness
    */
   private async generateThumbnailsMainThread(
-    fileId: string,
+    fileId: FileId,
     pdfArrayBuffer: ArrayBuffer,
     pageNumbers: number[],
     scale: number,
@@ -284,7 +285,7 @@ export class ThumbnailGenerationService {
     this.pdfDocumentCache.clear();
   }
 
-  clearPDFCacheForFile(fileId: string): void {
+  clearPDFCacheForFile(fileId: FileId): void {
     const cached = this.pdfDocumentCache.get(fileId);
     if (cached) {
       pdfWorkerManager.destroyDocument(cached.pdf);
@@ -296,7 +297,7 @@ export class ThumbnailGenerationService {
    * Clean up a PDF document from cache when thumbnail generation is complete
    * This frees up workers faster for better performance
    */
-  cleanupCompletedDocument(fileId: string): void {
+  cleanupCompletedDocument(fileId: FileId): void {
     const cached = this.pdfDocumentCache.get(fileId);
     if (cached && cached.refCount <= 0) {
       pdfWorkerManager.destroyDocument(cached.pdf);

frontend/src/tests/translation.test.ts

@@ -0,0 +1,50 @@
+import { describe, test, expect } from 'vitest';
+import fs from 'fs';
+import path from 'path';
+
+const LOCALES_DIR = path.join(__dirname, '../../public/locales');
+
+// Get all locale directories for parameterized tests
+const getLocaleDirectories = () => {
+  if (!fs.existsSync(LOCALES_DIR)) {
+    return [];
+  }
+
+  return fs.readdirSync(LOCALES_DIR, { withFileTypes: true })
+    .filter(dirent => dirent.isDirectory())
+    .map(dirent => dirent.name);
+};
+
+const localeDirectories = getLocaleDirectories();
+
+describe('Translation JSON Validation', () => {
+  test('should find the locales directory', () => {
+    expect(fs.existsSync(LOCALES_DIR)).toBe(true);
+  });
+
+  test('should have at least one locale directory', () => {
+    expect(localeDirectories.length).toBeGreaterThan(0);
+  });
+
+  test.each(localeDirectories)('should have valid JSON in %s/translation.json', (localeDir) => {
+    const translationFile = path.join(LOCALES_DIR, localeDir, 'translation.json');
+
+    // Check if file exists
+    expect(fs.existsSync(translationFile)).toBe(true);
+
+    // Read file content
+    const content = fs.readFileSync(translationFile, 'utf8');
+    expect(content.trim()).not.toBe('');
+
+    // Parse JSON - this will throw if invalid JSON
+    let jsonData;
+    expect(() => {
+      jsonData = JSON.parse(content);
+    }).not.toThrow();
+
+    // Ensure it's an object at root level
+    expect(typeof jsonData).toBe('object');
+    expect(jsonData).not.toBeNull();
+    expect(Array.isArray(jsonData)).toBe(false);
+  });
+});

frontend/src/tools/ChangePermissions.tsx

@@ -1,96 +1,55 @@
-import React, { useEffect } from "react";
 import { useTranslation } from "react-i18next";
-import { useEndpointEnabled } from "../hooks/useEndpointConfig";
-import { useFileSelection } from "../contexts/FileContext";
-import { useNavigationActions } from "../contexts/NavigationContext";
-
 import { createToolFlow } from "../components/tools/shared/createToolFlow";
-
 import ChangePermissionsSettings from "../components/tools/changePermissions/ChangePermissionsSettings";
-
 import { useChangePermissionsParameters } from "../hooks/tools/changePermissions/useChangePermissionsParameters";
 import { useChangePermissionsOperation } from "../hooks/tools/changePermissions/useChangePermissionsOperation";
 import { useChangePermissionsTips } from "../components/tooltips/useChangePermissionsTips";
+import { useBaseTool } from "../hooks/tools/shared/useBaseTool";
 import { BaseToolProps, ToolComponent } from "../types/tool";
 
-const ChangePermissions = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
+const ChangePermissions = (props: BaseToolProps) => {
   const { t } = useTranslation();
-  const { actions } = useNavigationActions();
-  const { selectedFiles } = useFileSelection();
-
-  const changePermissionsParams = useChangePermissionsParameters();
-  const changePermissionsOperation = useChangePermissionsOperation();
   const changePermissionsTips = useChangePermissionsTips();
 
-  // Endpoint validation
+  const base = useBaseTool(
-  const { enabled: endpointEnabled, loading: endpointLoading } = useEndpointEnabled(changePermissionsParams.getEndpointName());
+    'changePermissions',
-
+    useChangePermissionsParameters,
-  useEffect(() => {
+    useChangePermissionsOperation,
-    changePermissionsOperation.resetResults();
+    props
-    onPreviewFile?.(null);
-  }, [changePermissionsParams.parameters]);
-
-  const handleChangePermissions = async () => {
-    try {
-      await changePermissionsOperation.executeOperation(changePermissionsParams.parameters, selectedFiles);
-      if (changePermissionsOperation.files && onComplete) {
-        onComplete(changePermissionsOperation.files);
-      }
-    } catch (error) {
-      if (onError) {
-        onError(
-          error instanceof Error ? error.message : t("changePermissions.error.failed", "Change permissions operation failed")
   );
-      }
-    }
-  };
-
-  const handleThumbnailClick = (file: File) => {
-    onPreviewFile?.(file);
-    sessionStorage.setItem("previousMode", "changePermissions");
-  };
-
-  const handleSettingsReset = () => {
-    changePermissionsOperation.resetResults();
-    onPreviewFile?.(null);
-  };
-
-  const hasFiles = selectedFiles.length > 0;
-  const hasResults = changePermissionsOperation.files.length > 0 || changePermissionsOperation.downloadUrl !== null;
-  const settingsCollapsed = !hasFiles || hasResults;
 
   return createToolFlow({
     files: {
-      selectedFiles,
+      selectedFiles: base.selectedFiles,
-      isCollapsed: hasResults,
+      isCollapsed: base.hasResults,
     },
     steps: [
       {
         title: t("changePermissions.title", "Document Permissions"),
-        isCollapsed: settingsCollapsed,
+        isCollapsed: base.settingsCollapsed,
-        onCollapsedClick: settingsCollapsed ? handleSettingsReset : undefined,
+        onCollapsedClick: base.settingsCollapsed ? base.handleSettingsReset : undefined,
         tooltip: changePermissionsTips,
         content: (
           <ChangePermissionsSettings
-            parameters={changePermissionsParams.parameters}
+            parameters={base.params.parameters}
-            onParameterChange={changePermissionsParams.updateParameter}
+            onParameterChange={base.params.updateParameter}
-            disabled={endpointLoading}
+            disabled={base.endpointLoading}
           />
         ),
       },
     ],
     executeButton: {
       text: t("changePermissions.submit", "Change Permissions"),
-      isVisible: !hasResults,
+      isVisible: !base.hasResults,
       loadingText: t("loading"),
-      onClick: handleChangePermissions,
+      onClick: base.handleExecute,
-      disabled: !changePermissionsParams.validateParameters() || !hasFiles || !endpointEnabled,
+      disabled: !base.params.validateParameters() || !base.hasFiles || !base.endpointEnabled,
     },
     review: {
-      isVisible: hasResults,
+      isVisible: base.hasResults,
-      operation: changePermissionsOperation,
+      operation: base.operation,
       title: t("changePermissions.results.title", "Modified PDFs"),
-      onFileClick: handleThumbnailClick,
+      onFileClick: base.handleThumbnailClick,
     },
   });
 };

frontend/src/tools/Compress.tsx

@@ -1,95 +1,55 @@
-import React, { use, useEffect } from "react";
 import { useTranslation } from "react-i18next";
-import { useEndpointEnabled } from "../hooks/useEndpointConfig";
-import { useFileSelection } from "../contexts/FileContext";
-import { useNavigationActions } from "../contexts/NavigationContext";
-
 import { createToolFlow } from "../components/tools/shared/createToolFlow";
-
 import CompressSettings from "../components/tools/compress/CompressSettings";
-
 import { useCompressParameters } from "../hooks/tools/compress/useCompressParameters";
 import { useCompressOperation } from "../hooks/tools/compress/useCompressOperation";
+import { useBaseTool } from "../hooks/tools/shared/useBaseTool";
 import { BaseToolProps, ToolComponent } from "../types/tool";
 import { useCompressTips } from "../components/tooltips/useCompressTips";
 
-const Compress = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
+const Compress = (props: BaseToolProps) => {
   const { t } = useTranslation();
-  const { actions } = useNavigationActions();
-  const { selectedFiles } = useFileSelection();
-
-  const compressParams = useCompressParameters();
-  const compressOperation = useCompressOperation();
   const compressTips = useCompressTips();
 
-  // Endpoint validation
+  const base = useBaseTool(
-  const { enabled: endpointEnabled, loading: endpointLoading } = useEndpointEnabled("compress-pdf");
+    'compress',
-
+    useCompressParameters,
-  useEffect(() => {
+    useCompressOperation,
-    compressOperation.resetResults();
+    props
-    onPreviewFile?.(null);
+  );
-  }, [compressParams.parameters]);
-
-  const handleCompress = async () => {
-    try {
-      await compressOperation.executeOperation(compressParams.parameters, selectedFiles);
-      if (compressOperation.files && onComplete) {
-        onComplete(compressOperation.files);
-      }
-    } catch (error) {
-      if (onError) {
-        onError(error instanceof Error ? error.message : "Compress operation failed");
-      }
-    }
-  };
-
-  const handleThumbnailClick = (file: File) => {
-    onPreviewFile?.(file);
-    sessionStorage.setItem("previousMode", "compress");
-  };
-
-  const handleSettingsReset = () => {
-    compressOperation.resetResults();
-    onPreviewFile?.(null);  };
-
-
-
-  const hasFiles = selectedFiles.length > 0;
-  const hasResults = compressOperation.files.length > 0 || compressOperation.downloadUrl !== null;
-  const settingsCollapsed = !hasFiles || hasResults;
 
   return createToolFlow({
     files: {
-      selectedFiles,
+      selectedFiles: base.selectedFiles,
-      isCollapsed: hasResults,
+      isCollapsed: base.hasResults,
     },
     steps: [
       {
         title: "Settings",
-        isCollapsed: settingsCollapsed,
+        isCollapsed: base.settingsCollapsed,
-        onCollapsedClick: settingsCollapsed ? handleSettingsReset : undefined,
+        onCollapsedClick: base.settingsCollapsed ? base.handleSettingsReset : undefined,
         tooltip: compressTips,
         content: (
           <CompressSettings
-            parameters={compressParams.parameters}
+            parameters={base.params.parameters}
-            onParameterChange={compressParams.updateParameter}
+            onParameterChange={base.params.updateParameter}
-            disabled={endpointLoading}
+            disabled={base.endpointLoading}
           />
         ),
       },
     ],
     executeButton: {
       text: t("compress.submit", "Compress"),
-      isVisible: !hasResults,
+      isVisible: !base.hasResults,
       loadingText: t("loading"),
-      onClick: handleCompress,
+      onClick: base.handleExecute,
-      disabled: !compressParams.validateParameters() || !hasFiles || !endpointEnabled,
+      disabled: !base.params.validateParameters() || !base.hasFiles || !base.endpointEnabled,
     },
     review: {
-      isVisible: hasResults,
+      isVisible: base.hasResults,
-      operation: compressOperation,
+      operation: base.operation,
       title: t("compress.title", "Compression Results"),
-      onFileClick: handleThumbnailClick,
+      onFileClick: base.handleThumbnailClick,
     },
   });
 };

frontend/src/tools/RemoveCertificateSign.tsx

@@ -1,78 +1,39 @@
-import React, { useEffect } from "react";
 import { useTranslation } from "react-i18next";
-import { useEndpointEnabled } from "../hooks/useEndpointConfig";
-import { useFileContext } from "../contexts/FileContext";
-import { useNavigationActions } from "../contexts/NavigationContext";
-import { useFileSelection } from "../contexts/file/fileHooks";
-
 import { createToolFlow } from "../components/tools/shared/createToolFlow";
-
 import { useRemoveCertificateSignParameters } from "../hooks/tools/removeCertificateSign/useRemoveCertificateSignParameters";
 import { useRemoveCertificateSignOperation } from "../hooks/tools/removeCertificateSign/useRemoveCertificateSignOperation";
+import { useBaseTool } from "../hooks/tools/shared/useBaseTool";
 import { BaseToolProps, ToolComponent } from "../types/tool";
 
-const RemoveCertificateSign = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
+const RemoveCertificateSign = (props: BaseToolProps) => {
   const { t } = useTranslation();
-  const { actions } = useNavigationActions();
-  const { selectedFiles } = useFileSelection();
 
-  const removeCertificateSignParams = useRemoveCertificateSignParameters();
+  const base = useBaseTool(
-  const removeCertificateSignOperation = useRemoveCertificateSignOperation();
+    'removeCertificateSign',
-
+    useRemoveCertificateSignParameters,
-  // Endpoint validation
+    useRemoveCertificateSignOperation,
-  const { enabled: endpointEnabled, loading: endpointLoading } = useEndpointEnabled(removeCertificateSignParams.getEndpointName());
+    props
-
+  );
-  useEffect(() => {
-    removeCertificateSignOperation.resetResults();
-    onPreviewFile?.(null);
-  }, [removeCertificateSignParams.parameters]);
-
-  const handleRemoveSignature = async () => {
-    try {
-      await removeCertificateSignOperation.executeOperation(removeCertificateSignParams.parameters, selectedFiles);
-      if (removeCertificateSignOperation.files && onComplete) {
-        onComplete(removeCertificateSignOperation.files);
-      }
-    } catch (error) {
-      if (onError) {
-        onError(error instanceof Error ? error.message : t("removeCertSign.error.failed", "Remove certificate signature operation failed"));
-      }
-    }
-  };
-
-  const handleThumbnailClick = (file: File) => {
-    onPreviewFile?.(file);
-    sessionStorage.setItem("previousMode", "removeCertificateSign");
-    actions.setWorkbench("viewer");
-  };
-
-  const handleSettingsReset = () => {
-    removeCertificateSignOperation.resetResults();
-    onPreviewFile?.(null);
-  };
-
-  const hasFiles = selectedFiles.length > 0;
-  const hasResults = removeCertificateSignOperation.files.length > 0 || removeCertificateSignOperation.downloadUrl !== null;
 
   return createToolFlow({
     files: {
-      selectedFiles,
+      selectedFiles: base.selectedFiles,
-      isCollapsed: hasFiles || hasResults,
+      isCollapsed: base.hasResults,
       placeholder: t("removeCertSign.files.placeholder", "Select a PDF file in the main view to get started"),
     },
     steps: [],
     executeButton: {
       text: t("removeCertSign.submit", "Remove Signature"),
-      isVisible: !hasResults,
+      isVisible: !base.hasResults,
       loadingText: t("loading"),
-      onClick: handleRemoveSignature,
+      onClick: base.handleExecute,
-      disabled: !removeCertificateSignParams.validateParameters() || !hasFiles || !endpointEnabled,
+      disabled: !base.params.validateParameters() || !base.hasFiles || !base.endpointEnabled,
     },
     review: {
-      isVisible: hasResults,
+      isVisible: base.hasResults,
-      operation: removeCertificateSignOperation,
+      operation: base.operation,
       title: t("removeCertSign.results.title", "Certificate Removal Results"),
-      onFileClick: handleThumbnailClick,
+      onFileClick: base.handleThumbnailClick,
     },
   });
 };

frontend/src/tools/RemovePassword.tsx

@@ -1,95 +1,55 @@
-import { useEffect } from "react";
 import { useTranslation } from "react-i18next";
-import { useEndpointEnabled } from "../hooks/useEndpointConfig";
-import { useFileSelection } from "../contexts/FileContext";
-import { useNavigationActions } from "../contexts/NavigationContext";
-
 import { createToolFlow } from "../components/tools/shared/createToolFlow";
-
 import RemovePasswordSettings from "../components/tools/removePassword/RemovePasswordSettings";
-
 import { useRemovePasswordParameters } from "../hooks/tools/removePassword/useRemovePasswordParameters";
 import { useRemovePasswordOperation } from "../hooks/tools/removePassword/useRemovePasswordOperation";
 import { useRemovePasswordTips } from "../components/tooltips/useRemovePasswordTips";
+import { useBaseTool } from "../hooks/tools/shared/useBaseTool";
 import { BaseToolProps, ToolComponent } from "../types/tool";
 
-const RemovePassword = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
+const RemovePassword = (props: BaseToolProps) => {
   const { t } = useTranslation();
-  const { actions } = useNavigationActions();
-  const { selectedFiles } = useFileSelection();
-
-  const removePasswordParams = useRemovePasswordParameters();
-  const removePasswordOperation = useRemovePasswordOperation();
   const removePasswordTips = useRemovePasswordTips();
 
-  // Endpoint validation
+  const base = useBaseTool(
-  const { enabled: endpointEnabled, loading: endpointLoading } = useEndpointEnabled(removePasswordParams.getEndpointName());
+    'removePassword',
-
+    useRemovePasswordParameters,
-
+    useRemovePasswordOperation,
-  useEffect(() => {
+    props
-    removePasswordOperation.resetResults();
+  );
-    onPreviewFile?.(null);
-  }, [removePasswordParams.parameters]);
-
-  const handleRemovePassword = async () => {
-    try {
-      await removePasswordOperation.executeOperation(removePasswordParams.parameters, selectedFiles);
-      if (removePasswordOperation.files && onComplete) {
-        onComplete(removePasswordOperation.files);
-      }
-    } catch (error) {
-      if (onError) {
-        onError(error instanceof Error ? error.message : t("removePassword.error.failed", "Remove password operation failed"));
-      }
-    }
-  };
-
-  const handleThumbnailClick = (file: File) => {
-    onPreviewFile?.(file);
-    sessionStorage.setItem("previousMode", "removePassword");
-  };
-
-  const handleSettingsReset = () => {
-    removePasswordOperation.resetResults();
-    onPreviewFile?.(null);
-  };
-
-  const hasFiles = selectedFiles.length > 0;
-  const hasResults = removePasswordOperation.files.length > 0 || removePasswordOperation.downloadUrl !== null;
-  const passwordCollapsed = !hasFiles || hasResults;
 
   return createToolFlow({
     files: {
-      selectedFiles,
+      selectedFiles: base.selectedFiles,
-      isCollapsed: hasResults,
+      isCollapsed: base.hasResults,
     },
     steps: [
       {
         title: t("removePassword.password.stepTitle", "Remove Password"),
-        isCollapsed: passwordCollapsed,
+        isCollapsed: base.settingsCollapsed,
-        onCollapsedClick: hasResults ? handleSettingsReset : undefined,
+        onCollapsedClick: base.hasResults ? base.handleSettingsReset : undefined,
         tooltip: removePasswordTips,
         content: (
           <RemovePasswordSettings
-            parameters={removePasswordParams.parameters}
+            parameters={base.params.parameters}
-            onParameterChange={removePasswordParams.updateParameter}
+            onParameterChange={base.params.updateParameter}
-            disabled={endpointLoading}
+            disabled={base.endpointLoading}
           />
         ),
       },
     ],
     executeButton: {
       text: t("removePassword.submit", "Remove Password"),
-      isVisible: !hasResults,
+      isVisible: !base.hasResults,
       loadingText: t("loading"),
-      onClick: handleRemovePassword,
+      onClick: base.handleExecute,
-      disabled: !removePasswordParams.validateParameters() || !hasFiles || !endpointEnabled,
+      disabled: !base.params.validateParameters() || !base.hasFiles || !base.endpointEnabled,
     },
     review: {
-      isVisible: hasResults,
+      isVisible: base.hasResults,
-      operation: removePasswordOperation,
+      operation: base.operation,
       title: t("removePassword.results.title", "Decrypted PDFs"),
-      onFileClick: handleThumbnailClick,
+      onFileClick: base.handleThumbnailClick,
     },
   });
 };

frontend/src/tools/Repair.tsx

@@ -1,78 +1,39 @@
-import React, { useEffect } from "react";
 import { useTranslation } from "react-i18next";
-import { useEndpointEnabled } from "../hooks/useEndpointConfig";
-import { useFileContext } from "../contexts/FileContext";
-import { useNavigationActions } from "../contexts/NavigationContext";
-import { useFileSelection } from "../contexts/file/fileHooks";
-
 import { createToolFlow } from "../components/tools/shared/createToolFlow";
-
 import { useRepairParameters } from "../hooks/tools/repair/useRepairParameters";
 import { useRepairOperation } from "../hooks/tools/repair/useRepairOperation";
+import { useBaseTool } from "../hooks/tools/shared/useBaseTool";
 import { BaseToolProps, ToolComponent } from "../types/tool";
 
-const Repair = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
+const Repair = (props: BaseToolProps) => {
   const { t } = useTranslation();
-  const { actions } = useNavigationActions();
-  const { selectedFiles } = useFileSelection();
 
-  const repairParams = useRepairParameters();
+  const base = useBaseTool(
-  const repairOperation = useRepairOperation();
+    'repair',
-
+    useRepairParameters,
-  // Endpoint validation
+    useRepairOperation,
-  const { enabled: endpointEnabled, loading: endpointLoading } = useEndpointEnabled(repairParams.getEndpointName());
+    props
-
+  );
-  useEffect(() => {
-    repairOperation.resetResults();
-    onPreviewFile?.(null);
-  }, [repairParams.parameters]);
-
-  const handleRepair = async () => {
-    try {
-      await repairOperation.executeOperation(repairParams.parameters, selectedFiles);
-      if (repairOperation.files && onComplete) {
-        onComplete(repairOperation.files);
-      }
-    } catch (error) {
-      if (onError) {
-        onError(error instanceof Error ? error.message : t("repair.error.failed", "Repair operation failed"));
-      }
-    }
-  };
-
-  const handleThumbnailClick = (file: File) => {
-    onPreviewFile?.(file);
-    sessionStorage.setItem("previousMode", "repair");
-    actions.setWorkbench("viewer");
-  };
-
-  const handleSettingsReset = () => {
-    repairOperation.resetResults();
-    onPreviewFile?.(null);
-  };
-
-  const hasFiles = selectedFiles.length > 0;
-  const hasResults = repairOperation.files.length > 0 || repairOperation.downloadUrl !== null;
 
   return createToolFlow({
     files: {
-      selectedFiles,
+      selectedFiles: base.selectedFiles,
-      isCollapsed: hasResults,
+      isCollapsed: base.hasResults,
       placeholder: t("repair.files.placeholder", "Select a PDF file in the main view to get started"),
     },
     steps: [],
     executeButton: {
       text: t("repair.submit", "Repair PDF"),
-      isVisible: !hasResults,
+      isVisible: !base.hasResults,
       loadingText: t("loading"),
-      onClick: handleRepair,
+      onClick: base.handleExecute,
-      disabled: !repairParams.validateParameters() || !hasFiles || !endpointEnabled,
+      disabled: !base.params.validateParameters() || !base.hasFiles || !base.endpointEnabled,
     },
     review: {
-      isVisible: hasResults,
+      isVisible: base.hasResults,
-      operation: repairOperation,
+      operation: base.operation,
       title: t("repair.results.title", "Repair Results"),
-      onFileClick: handleThumbnailClick,
+      onFileClick: base.handleThumbnailClick,
     },
   });
 };

frontend/src/tools/Sanitize.tsx

@@ -1,90 +1,53 @@
-import { useEffect } from "react";
 import { useTranslation } from "react-i18next";
-import { useEndpointEnabled } from "../hooks/useEndpointConfig";
-import { useFileSelection } from "../contexts/FileContext";
-
 import { createToolFlow } from "../components/tools/shared/createToolFlow";
 import SanitizeSettings from "../components/tools/sanitize/SanitizeSettings";
-
 import { useSanitizeParameters } from "../hooks/tools/sanitize/useSanitizeParameters";
 import { useSanitizeOperation } from "../hooks/tools/sanitize/useSanitizeOperation";
+import { useBaseTool } from "../hooks/tools/shared/useBaseTool";
 import { BaseToolProps, ToolComponent } from "../types/tool";
 
-const Sanitize = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
+const Sanitize = (props: BaseToolProps) => {
   const { t } = useTranslation();
 
-  const { selectedFiles } = useFileSelection();
+  const base = useBaseTool(
-
+    'sanitize',
-  const sanitizeParams = useSanitizeParameters();
+    useSanitizeParameters,
-  const sanitizeOperation = useSanitizeOperation();
+    useSanitizeOperation,
-
+    props
-  // Endpoint validation
+  );
-  const { enabled: endpointEnabled, loading: endpointLoading } = useEndpointEnabled(sanitizeParams.getEndpointName());
-
-  useEffect(() => {
-    sanitizeOperation.resetResults();
-    onPreviewFile?.(null);
-  }, [sanitizeParams.parameters]);
-
-  const handleSanitize = async () => {
-    try {
-      await sanitizeOperation.executeOperation(sanitizeParams.parameters, selectedFiles);
-      if (sanitizeOperation.files && onComplete) {
-        onComplete(sanitizeOperation.files);
-      }
-    } catch (error) {
-      if (onError) {
-        onError(error instanceof Error ? error.message : t("sanitize.error.generic", "Sanitization failed"));
-      }
-    }
-  };
-
-  const handleSettingsReset = () => {
-    sanitizeOperation.resetResults();
-    onPreviewFile?.(null);
-  };
-
-  const handleThumbnailClick = (file: File) => {
-    onPreviewFile?.(file);
-    sessionStorage.setItem("previousMode", "sanitize");
-  };
-
-  const hasFiles = selectedFiles.length > 0;
-  const hasResults = sanitizeOperation.files.length > 0;
-  const settingsCollapsed = !hasFiles || hasResults;
 
   return createToolFlow({
     files: {
-      selectedFiles,
+      selectedFiles: base.selectedFiles,
-      isCollapsed: hasResults,
+      isCollapsed: base.hasResults,
       placeholder: t("sanitize.files.placeholder", "Select a PDF file in the main view to get started"),
     },
     steps: [
       {
         title: t("sanitize.steps.settings", "Settings"),
-        isCollapsed: settingsCollapsed,
+        isCollapsed: base.settingsCollapsed,
-        onCollapsedClick: settingsCollapsed ? handleSettingsReset : undefined,
+        onCollapsedClick: base.settingsCollapsed ? base.handleSettingsReset : undefined,
         content: (
           <SanitizeSettings
-            parameters={sanitizeParams.parameters}
+            parameters={base.params.parameters}
-            onParameterChange={sanitizeParams.updateParameter}
+            onParameterChange={base.params.updateParameter}
-            disabled={endpointLoading}
+            disabled={base.endpointLoading}
           />
         ),
       },
     ],
     executeButton: {
       text: t("sanitize.submit", "Sanitize PDF"),
-      isVisible: !hasResults,
+      isVisible: !base.hasResults,
       loadingText: t("loading"),
-      onClick: handleSanitize,
+      onClick: base.handleExecute,
-      disabled: !sanitizeParams.validateParameters() || !hasFiles || !endpointEnabled,
+      disabled: !base.params.validateParameters() || !base.hasFiles || !base.endpointEnabled,
     },
     review: {
-      isVisible: hasResults,
+      isVisible: base.hasResults,
-      operation: sanitizeOperation,
+      operation: base.operation,
       title: t("sanitize.sanitizationResults", "Sanitization Results"),
-      onFileClick: handleThumbnailClick,
+      onFileClick: base.handleThumbnailClick,
     },
   });
 };

frontend/src/tools/SingleLargePage.tsx

@@ -1,78 +1,39 @@
-import React, { useEffect } from "react";
 import { useTranslation } from "react-i18next";
-import { useEndpointEnabled } from "../hooks/useEndpointConfig";
-import { useFileContext } from "../contexts/FileContext";
-import { useNavigationActions } from "../contexts/NavigationContext";
-import { useFileSelection } from "../contexts/file/fileHooks";
-
 import { createToolFlow } from "../components/tools/shared/createToolFlow";
-
 import { useSingleLargePageParameters } from "../hooks/tools/singleLargePage/useSingleLargePageParameters";
 import { useSingleLargePageOperation } from "../hooks/tools/singleLargePage/useSingleLargePageOperation";
+import { useBaseTool } from "../hooks/tools/shared/useBaseTool";
 import { BaseToolProps, ToolComponent } from "../types/tool";
 
-const SingleLargePage = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
+const SingleLargePage = (props: BaseToolProps) => {
   const { t } = useTranslation();
-  const { actions } = useNavigationActions();
-  const { selectedFiles } = useFileSelection();
 
-  const singleLargePageParams = useSingleLargePageParameters();
+  const base = useBaseTool(
-  const singleLargePageOperation = useSingleLargePageOperation();
+    'singleLargePage',
-
+    useSingleLargePageParameters,
-  // Endpoint validation
+    useSingleLargePageOperation,
-  const { enabled: endpointEnabled, loading: endpointLoading } = useEndpointEnabled(singleLargePageParams.getEndpointName());
+    props
-
+  );
-  useEffect(() => {
-    singleLargePageOperation.resetResults();
-    onPreviewFile?.(null);
-  }, [singleLargePageParams.parameters]);
-
-  const handleConvert = async () => {
-    try {
-      await singleLargePageOperation.executeOperation(singleLargePageParams.parameters, selectedFiles);
-      if (singleLargePageOperation.files && onComplete) {
-        onComplete(singleLargePageOperation.files);
-      }
-    } catch (error) {
-      if (onError) {
-        onError(error instanceof Error ? error.message : t("pdfToSinglePage.error.failed", "Single large page operation failed"));
-      }
-    }
-  };
-
-  const handleThumbnailClick = (file: File) => {
-    onPreviewFile?.(file);
-    sessionStorage.setItem("previousMode", "single-large-page");
-    actions.setWorkbench("viewer");
-  };
-
-  const handleSettingsReset = () => {
-    singleLargePageOperation.resetResults();
-    onPreviewFile?.(null);
-  };
-
-  const hasFiles = selectedFiles.length > 0;
-  const hasResults = singleLargePageOperation.files.length > 0 || singleLargePageOperation.downloadUrl !== null;
 
   return createToolFlow({
     files: {
-      selectedFiles,
+      selectedFiles: base.selectedFiles,
-      isCollapsed: hasFiles || hasResults,
+      isCollapsed: base.hasResults,
       placeholder: t("pdfToSinglePage.files.placeholder", "Select a PDF file in the main view to get started"),
     },
     steps: [],
     executeButton: {
       text: t("pdfToSinglePage.submit", "Convert To Single Page"),
-      isVisible: !hasResults,
+      isVisible: !base.hasResults,
       loadingText: t("loading"),
-      onClick: handleConvert,
+      onClick: base.handleExecute,
-      disabled: !singleLargePageParams.validateParameters() || !hasFiles || !endpointEnabled,
+      disabled: !base.params.validateParameters() || !base.hasFiles || !base.endpointEnabled,
     },
     review: {
-      isVisible: hasResults,
+      isVisible: base.hasResults,
-      operation: singleLargePageOperation,
+      operation: base.operation,
       title: t("pdfToSinglePage.results.title", "Single Page Results"),
-      onFileClick: handleThumbnailClick,
+      onFileClick: base.handleThumbnailClick,
     },
   });
 };

frontend/src/tools/Split.tsx

@@ -1,84 +1,37 @@
-import React, { useEffect } from "react";
+import { useEffect } from "react";
 import { useTranslation } from "react-i18next";
-import { useEndpointEnabled } from "../hooks/useEndpointConfig";
-import { useFileSelection } from "../contexts/FileContext";
-import { useNavigationActions } from "../contexts/NavigationContext";
-
 import { createToolFlow } from "../components/tools/shared/createToolFlow";
 import SplitSettings from "../components/tools/split/SplitSettings";
-
 import { useSplitParameters } from "../hooks/tools/split/useSplitParameters";
 import { useSplitOperation } from "../hooks/tools/split/useSplitOperation";
+import { useBaseTool } from "../hooks/tools/shared/useBaseTool";
 import { BaseToolProps, ToolComponent } from "../types/tool";
 
-const Split = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
+const Split = (props: BaseToolProps) => {
   const { t } = useTranslation();
-  const { actions } = useNavigationActions();
-  const { selectedFiles } = useFileSelection();
 
-  const splitParams = useSplitParameters();
+  const base = useBaseTool(
-  const splitOperation = useSplitOperation();
+    'split',
-
+    useSplitParameters,
-  // Endpoint validation
+    useSplitOperation,
-  const { enabled: endpointEnabled, loading: endpointLoading } = useEndpointEnabled(splitParams.getEndpointName());
+    props
-
+  );
-  useEffect(() => {
-    // Only reset results when parameters change, not when files change
-    splitOperation.resetResults();
-    onPreviewFile?.(null);
-  }, [splitParams.parameters]);
-
-    useEffect(() => {
-    // Reset results when selected files change (user selected different files)
-    if (selectedFiles.length > 0) {
-      splitOperation.resetResults();
-      onPreviewFile?.(null);
-    }
-  }, [selectedFiles]);
-
-  const handleSplit = async () => {
-    try {
-      await splitOperation.executeOperation(splitParams.parameters, selectedFiles);
-      if (splitOperation.files && onComplete) {
-        onComplete(splitOperation.files);
-      }
-    } catch (error) {
-      if (onError) {
-        onError(error instanceof Error ? error.message : "Split operation failed");
-      }
-    }
-  };
-
-  const handleThumbnailClick = (file: File) => {
-    onPreviewFile?.(file);
-    sessionStorage.setItem("previousMode", "split");
-  };
-
-  const handleSettingsReset = () => {
-    splitOperation.resetResults();
-    onPreviewFile?.(null);
-    };
-
-  const hasFiles = selectedFiles.length > 0;
-  const hasResults = splitOperation.files.length > 0 || splitOperation.downloadUrl !== null;
-  const settingsCollapsed = !hasFiles || hasResults;
 
   return createToolFlow({
     files: {
-      selectedFiles,
+      selectedFiles: base.selectedFiles,
-      isCollapsed: hasResults,
+      isCollapsed: base.hasResults,
-      placeholder: "Select a PDF file in the main view to get started",
     },
     steps: [
       {
         title: "Settings",
-        isCollapsed: settingsCollapsed,
+        isCollapsed: base.settingsCollapsed,
-        onCollapsedClick: hasResults ? handleSettingsReset : undefined,
+        onCollapsedClick: base.hasResults ? base.handleSettingsReset : undefined,
         content: (
           <SplitSettings
-            parameters={splitParams.parameters}
+            parameters={base.params.parameters}
-            onParameterChange={splitParams.updateParameter}
+            onParameterChange={base.params.updateParameter}
-            disabled={endpointLoading}
+            disabled={base.endpointLoading}
           />
         ),
       },
@@ -86,15 +39,15 @@ const Split = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
     executeButton: {
       text: t("split.submit", "Split PDF"),
       loadingText: t("loading"),
-      onClick: handleSplit,
+      onClick: base.handleExecute,
-      isVisible: !hasResults,
+      isVisible: !base.hasResults,
-      disabled: !splitParams.validateParameters() || !hasFiles || !endpointEnabled,
+      disabled: !base.params.validateParameters() || !base.hasFiles || !base.endpointEnabled,
     },
     review: {
-      isVisible: hasResults,
+      isVisible: base.hasResults,
-      operation: splitOperation,
+      operation: base.operation,
       title: "Split Results",
-      onFileClick: handleThumbnailClick,
+      onFileClick: base.handleThumbnailClick,
     },
   });
 };

frontend/src/tools/UnlockPdfForms.tsx

@@ -1,78 +1,39 @@
-import React, { useEffect } from "react";
 import { useTranslation } from "react-i18next";
-import { useEndpointEnabled } from "../hooks/useEndpointConfig";
-import { useFileContext } from "../contexts/FileContext";
-import { useNavigationActions } from "../contexts/NavigationContext";
-import { useFileSelection } from "../contexts/file/fileHooks";
-
 import { createToolFlow } from "../components/tools/shared/createToolFlow";
-
 import { useUnlockPdfFormsParameters } from "../hooks/tools/unlockPdfForms/useUnlockPdfFormsParameters";
 import { useUnlockPdfFormsOperation } from "../hooks/tools/unlockPdfForms/useUnlockPdfFormsOperation";
+import { useBaseTool } from "../hooks/tools/shared/useBaseTool";
 import { BaseToolProps, ToolComponent } from "../types/tool";
 
-const UnlockPdfForms = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
+const UnlockPdfForms = (props: BaseToolProps) => {
   const { t } = useTranslation();
-  const { actions } = useNavigationActions();
-  const { selectedFiles } = useFileSelection();
 
-  const unlockPdfFormsParams = useUnlockPdfFormsParameters();
+  const base = useBaseTool(
-  const unlockPdfFormsOperation = useUnlockPdfFormsOperation();
+    'unlockPdfForms',
-
+    useUnlockPdfFormsParameters,
-  // Endpoint validation
+    useUnlockPdfFormsOperation,
-  const { enabled: endpointEnabled, loading: endpointLoading } = useEndpointEnabled(unlockPdfFormsParams.getEndpointName());
+    props
-
+  );
-  useEffect(() => {
-    unlockPdfFormsOperation.resetResults();
-    onPreviewFile?.(null);
-  }, [unlockPdfFormsParams.parameters]);
-
-  const handleUnlock = async () => {
-    try {
-      await unlockPdfFormsOperation.executeOperation(unlockPdfFormsParams.parameters, selectedFiles);
-      if (unlockPdfFormsOperation.files && onComplete) {
-        onComplete(unlockPdfFormsOperation.files);
-      }
-    } catch (error) {
-      if (onError) {
-        onError(error instanceof Error ? error.message : t("unlockPDFForms.error.failed", "Unlock PDF forms operation failed"));
-      }
-    }
-  };
-
-  const handleThumbnailClick = (file: File) => {
-    onPreviewFile?.(file);
-    sessionStorage.setItem("previousMode", "unlockPdfForms");
-    actions.setWorkbench("viewer");
-  };
-
-  const handleSettingsReset = () => {
-    unlockPdfFormsOperation.resetResults();
-    onPreviewFile?.(null);
-  };
-
-  const hasFiles = selectedFiles.length > 0;
-  const hasResults = unlockPdfFormsOperation.files.length > 0 || unlockPdfFormsOperation.downloadUrl !== null;
 
   return createToolFlow({
     files: {
-      selectedFiles,
+      selectedFiles: base.selectedFiles,
-      isCollapsed: hasFiles || hasResults,
+      isCollapsed: base.hasFiles || base.hasResults,
       placeholder: t("unlockPDFForms.files.placeholder", "Select a PDF file in the main view to get started"),
     },
     steps: [],
     executeButton: {
       text: t("unlockPDFForms.submit", "Unlock Forms"),
-      isVisible: !hasResults,
+      isVisible: !base.hasResults,
       loadingText: t("loading"),
-      onClick: handleUnlock,
+      onClick: base.handleExecute,
-      disabled: !unlockPdfFormsParams.validateParameters() || !hasFiles || !endpointEnabled,
+      disabled: !base.params.validateParameters() || !base.hasFiles || !base.endpointEnabled,
     },
     review: {
-      isVisible: hasResults,
+      isVisible: base.hasResults,
-      operation: unlockPdfFormsOperation,
+      operation: base.operation,
       title: t("unlockPDFForms.results.title", "Unlocked Forms Results"),
-      onFileClick: handleThumbnailClick,
+      onFileClick: base.handleThumbnailClick,
     },
   });
 };

frontend/src/types/file.ts

@@ -3,13 +3,15 @@
  * FileContext uses pure File objects with separate ID tracking
  */
 
+declare const tag: unique symbol;
+export type FileId = string & { readonly [tag]: 'FileId' };
 
 /**
  * File metadata for efficient operations without loading full file data
  * Used by IndexedDBContext and FileContext for lazy file loading
  */
 export interface FileMetadata {
-  id: string;
+  id: FileId;
   name: string;
   type: string;
   size: number;

frontend/src/types/fileContext.ts

@@ -2,9 +2,8 @@
  * Types for global file context management across views and tools
  */
 
-import { ProcessedFile } from './processing';
+import { PageOperation } from './pageEditor';
-import { PDFDocument, PDFPage, PageOperation } from './pageEditor';
+import { FileId, FileMetadata } from './file';
-import { FileMetadata } from './file';
 
 export type ModeType =
   | 'viewer'
@@ -26,8 +25,6 @@ export type ModeType =
   | 'removeCertificateSign';
 
 // Normalized state types
-export type FileId = string;
-
 export interface ProcessedFilePage {
   thumbnail?: string;
   pageNumber?: number;
@@ -69,14 +66,14 @@ export interface FileContextNormalizedFiles {
 export function createFileId(): FileId {
   // Use crypto.randomUUID for authoritative primary key
   if (typeof window !== 'undefined' && window.crypto?.randomUUID) {
-    return window.crypto.randomUUID();
+    return window.crypto.randomUUID() as FileId;
   }
   // Fallback for environments without randomUUID
   return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
     const r = Math.random() * 16 | 0;
     const v = c == 'x' ? r : (r & 0x3 | 0x8);
     return v.toString(16);
-  });
+  }) as FileId;
 }
 
 // Generate quick deduplication key from file metadata
@@ -136,7 +133,7 @@ export interface FileOperation {
   id: string;
   type: OperationType;
   timestamp: number;
-  fileIds: string[];
+  fileIds: FileId[];
   status: 'pending' | 'applied' | 'failed';
   data?: any;
   metadata?: {
@@ -150,7 +147,7 @@ export interface FileOperation {
 }
 
 export interface FileOperationHistory {
-  fileId: string;
+  fileId: FileId;
   fileName: string;
   operations: (FileOperation | PageOperation)[];
   createdAt: number;
@@ -165,7 +162,7 @@ export interface ViewerConfig {
 }
 
 export interface FileEditHistory {
-  fileId: string;
+  fileId: FileId;
   pageOperations: PageOperation[];
   lastModified: number;
 }
@@ -248,8 +245,8 @@ export interface FileContextActions {
 
   // Resource management
   trackBlobUrl: (url: string) => void;
-  scheduleCleanup: (fileId: string, delay?: number) => void;
+  scheduleCleanup: (fileId: FileId, delay?: number) => void;
-  cleanupFile: (fileId: string) => void;
+  cleanupFile: (fileId: FileId) => void;
 }
 
 // File selectors (separate from actions to avoid re-renders)

frontend/src/types/pageEditor.ts

@@ -1,3 +1,5 @@
+import { FileId } from './file';
+
 export interface PDFPage {
   id: string;
   pageNumber: number;
@@ -7,7 +9,7 @@ export interface PDFPage {
   selected: boolean;
   splitAfter?: boolean;
   isBlankPage?: boolean;
-  originalFileId?: string;
+  originalFileId?: FileId;
 }
 
 export interface PDFDocument {

frontend/src/utils/automationExecutor.ts

@@ -4,6 +4,7 @@ import { AutomationConfig, AutomationExecutionCallbacks } from '../types/automat
 import { AUTOMATION_CONSTANTS } from '../constants/automation';
 import { AutomationFileProcessor } from './automationFileProcessor';
 import { ResourceManager } from './resourceManager';
+import { ToolType } from '../hooks/tools/shared/useToolOperation';
 
 
 /**
@@ -47,7 +48,7 @@ export const executeToolOperationWithPrefix = async (
       return resultFiles;
     }
 
-    if (config.multiFileEndpoint) {
+    if (config.toolType === ToolType.multiFile) {
       // Multi-file processing - single API call with all files
       const endpoint = typeof config.endpoint === 'function'
         ? config.endpoint(parameters)
@@ -84,7 +85,6 @@ export const executeToolOperationWithPrefix = async (
       if (result.errors.length > 0) {
         console.warn(`⚠️ File processing warnings:`, result.errors);
       }
-      
       // Apply prefix to files, replacing any existing prefix
       const processedFiles = filePrefix
         ? result.files.map(file => {

frontend/src/utils/toolOperationTracker.ts

@@ -1,3 +1,4 @@
+import { FileId } from '../types/file';
 import { FileOperation } from '../types/fileContext';
 
 /**
@@ -7,9 +8,9 @@ export const createOperation = <TParams = void>(
   operationType: string,
   params: TParams,
   selectedFiles: File[]
-): { operation: FileOperation; operationId: string; fileId: string } => {
+): { operation: FileOperation; operationId: string; fileId: FileId } => {
   const operationId = `${operationType}-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
-  const fileId = selectedFiles.map(f => f.name).join(',');
+  const fileId = selectedFiles.map(f => f.name).join(',') as FileId;
 
   const operation: FileOperation = {
     id: operationId,