From 5c105862685e63d9457e91b3691bd5097aa6e17f Mon Sep 17 00:00:00 2001 From: James Date: Fri, 8 Aug 2025 15:20:51 +0100 Subject: [PATCH] Revert some changes in favour of any typing --- .../src/components/fileEditor/FileEditor.tsx | 133 +++++++++--------- .../components/pageEditor/PageThumbnail.tsx | 10 +- 2 files changed, 71 insertions(+), 72 deletions(-) diff --git a/frontend/src/components/fileEditor/FileEditor.tsx b/frontend/src/components/fileEditor/FileEditor.tsx index ca5f594b8..61f45aef4 100644 --- a/frontend/src/components/fileEditor/FileEditor.tsx +++ b/frontend/src/components/fileEditor/FileEditor.tsx @@ -70,11 +70,11 @@ const FileEditor = ({ } = fileContext; // Get file selection context - const { - selectedFiles: toolSelectedFiles, - setSelectedFiles: setToolSelectedFiles, - maxFiles, - isToolMode + const { + selectedFiles: toolSelectedFiles, + setSelectedFiles: setToolSelectedFiles, + maxFiles, + isToolMode } = useFileSelection(); const [files, setFiles] = useState([]); @@ -82,7 +82,7 @@ const FileEditor = ({ const [error, setError] = useState(null); const [localLoading, setLocalLoading] = useState(false); const [selectionMode, setSelectionMode] = useState(toolMode); - + // Enable selection mode automatically in tool mode React.useEffect(() => { if (toolMode) { @@ -115,7 +115,7 @@ const FileEditor = ({ // Get selected file IDs from context (defensive programming) const contextSelectedIds = Array.isArray(selectedFileIds) ? selectedFileIds : []; - + // Map context selections to local file IDs for UI display const localSelectedIds = files .filter(file => { @@ -144,33 +144,33 @@ const FileEditor = ({ // Check if the actual content has changed, not just references const currentActiveFileNames = activeFiles.map(f => f.name); const currentProcessedFilesSize = processedFiles.size; - + const activeFilesChanged = JSON.stringify(currentActiveFileNames) !== JSON.stringify(lastActiveFilesRef.current); const processedFilesChanged = currentProcessedFilesSize !== lastProcessedFilesRef.current; - + if (!activeFilesChanged && !processedFilesChanged) { return; } - + // Update refs lastActiveFilesRef.current = currentActiveFileNames; lastProcessedFilesRef.current = currentProcessedFilesSize; - + const convertActiveFiles = async () => { - + if (activeFiles.length > 0) { setLocalLoading(true); try { // Process files in chunks to avoid blocking UI const convertedFiles: FileItem[] = []; - + for (let i = 0; i < activeFiles.length; i++) { const file = activeFiles[i]; - + // Try to get thumbnail from processed file first const processedFile = processedFiles.get(file); let thumbnail = processedFile?.pages?.[0]?.thumbnail; - + // If no thumbnail from processed file, try to generate one if (!thumbnail) { try { @@ -180,7 +180,7 @@ const FileEditor = ({ thumbnail = undefined; // Use placeholder } } - + const convertedFile = { id: `file-${Date.now()}-${Math.random()}`, name: file.name, @@ -189,19 +189,19 @@ const FileEditor = ({ size: file.size, file, }; - + convertedFiles.push(convertedFile); - + // Update progress setConversionProgress(((i + 1) / activeFiles.length) * 100); - + // Yield to main thread between files if (i < activeFiles.length - 1) { await new Promise(resolve => requestAnimationFrame(resolve)); } } - - + + setFiles(convertedFiles); } catch (err) { console.error('Error converting active files:', err); @@ -237,7 +237,7 @@ const FileEditor = ({ try { // Validate ZIP file first const validation = await zipFileService.validateZipFile(file); - + if (validation.isValid && validation.containsPDFs) { // ZIP contains PDFs - extract them setZipExtractionProgress({ @@ -269,7 +269,7 @@ const FileEditor = ({ if (extractionResult.success) { allExtractedFiles.push(...extractionResult.extractedFiles); - + // Record ZIP extraction operation const operationId = `zip-extract-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`; const operation: FileOperation = { @@ -289,10 +289,10 @@ const FileEditor = ({ } } }; - + recordOperation(file.name, operation); markOperationApplied(file.name, operationId); - + if (extractionResult.errors.length > 0) { errors.push(...extractionResult.errors); } @@ -344,7 +344,7 @@ const FileEditor = ({ } } }; - + recordOperation(file.name, operation); markOperationApplied(file.name, operationId); } @@ -357,7 +357,7 @@ const FileEditor = ({ const errorMessage = err instanceof Error ? err.message : 'Failed to process files'; setError(errorMessage); console.error('File processing error:', err); - + // Reset extraction progress on error setZipExtractionProgress({ isExtracting: false, @@ -377,7 +377,7 @@ const FileEditor = ({ const closeAllFiles = useCallback(() => { if (activeFiles.length === 0) return; - + // Record close all operation for each file activeFiles.forEach(file => { const operationId = `close-all-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`; @@ -396,14 +396,14 @@ const FileEditor = ({ } } }; - + recordOperation(file.name, operation); markOperationApplied(file.name, operationId); }); - + // Remove all files from context but keep in storage removeFiles(activeFiles.map(f => (f as any).id || f.name), false); - + // Clear selections setContextSelectedFiles([]); }, [activeFiles, removeFiles, setContextSelectedFiles, recordOperation, markOperationApplied]); @@ -411,12 +411,12 @@ const FileEditor = ({ const toggleFile = useCallback((fileId: string) => { const targetFile = files.find(f => f.id === fileId); if (!targetFile) return; - + const contextFileId = (targetFile.file as any).id || targetFile.name; const isSelected = contextSelectedIds.includes(contextFileId); - + let newSelection: string[]; - + if (isSelected) { // Remove file from selection newSelection = contextSelectedIds.filter(id => id !== contextFileId); @@ -433,10 +433,10 @@ const FileEditor = ({ newSelection = [...contextSelectedIds, contextFileId]; } } - + // Update context setContextSelectedFiles(newSelection); - + // Update tool selection context if in tool mode if (isToolMode || toolMode) { const selectedFiles = files @@ -572,12 +572,12 @@ const FileEditor = ({ console.log('handleDeleteFile called with fileId:', fileId); const file = files.find(f => f.id === fileId); console.log('Found file:', file); - + if (file) { console.log('Attempting to remove file:', file.name); console.log('Actual file object:', file.file); console.log('Actual file.file.name:', file.file.name); - + // Record close operation const fileName = file.file.name; const fileId = (file.file as any).id || fileName; @@ -597,19 +597,18 @@ const FileEditor = ({ } } }; - + recordOperation(fileName, operation); - + // Remove file from context but keep in storage (close, don't delete) console.log('Calling removeFiles with:', [fileId]); removeFiles([fileId], false); - + // Remove from context selections setContextSelectedFiles(prev => { const safePrev = Array.isArray(prev) ? prev : []; return safePrev.filter(id => id !== fileId); }); - // Mark operation as applied markOperationApplied(fileName, operationId); } else { @@ -670,7 +669,7 @@ const FileEditor = ({ accept={["*/*"]} multiple={true} maxSize={2 * 1024 * 1024 * 1024} - style={{ + style={{ height: '100vh', border: 'none', borderRadius: 0, @@ -707,7 +706,7 @@ const FileEditor = ({ ) : files.length === 0 && (localLoading || zipExtractionProgress.isExtracting) ? ( - + {/* ZIP Extraction Progress */} {zipExtractionProgress.isExtracting && ( @@ -721,10 +720,10 @@ const FileEditor = ({ {zipExtractionProgress.extractedCount} of {zipExtractionProgress.totalFiles} files extracted -
@@ -737,7 +736,7 @@ const FileEditor = ({
)} - + {/* Processing indicator */} {localLoading && ( @@ -745,10 +744,10 @@ const FileEditor = ({ Loading files... {Math.round(conversionProgress)}% -
@@ -761,27 +760,27 @@ const FileEditor = ({
)} - + ) : ( ( + onDragStart={handleDragStart as any /* FIX ME */} + onDragEnd={handleDragEnd} + onDragOver={handleDragOver} + onDragEnter={handleDragEnter as any /* FIX ME */} + onDragLeave={handleDragLeave} + onDrop={handleDrop as any /* FIX ME */} + onEndZoneDragEnter={handleEndZoneDragEnter} + draggedItem={draggedFile as any /* FIX ME */} + dropTarget={dropTarget as any /* FIX ME */} + multiItemDrag={multiFileDrag as any /* FIX ME */} + dragPosition={dragPosition} + renderItem={(file, index, refs) => ( >; @@ -82,7 +82,7 @@ const PageThumbnail = React.memo(({ }: PageThumbnailProps) => { const [thumbnailUrl, setThumbnailUrl] = useState(page.thumbnail); const [isLoadingThumbnail, setIsLoadingThumbnail] = useState(false); - + // Update thumbnail URL when page prop changes useEffect(() => { if (page.thumbnail && page.thumbnail !== thumbnailUrl) { @@ -97,13 +97,13 @@ const PageThumbnail = React.memo(({ console.log(`📸 PageThumbnail: Page ${page.pageNumber} already has thumbnail, skipping worker listener`); return; // Skip if we already have a thumbnail } - + console.log(`📸 PageThumbnail: Setting up worker listener for page ${page.pageNumber} (${page.id})`); - + const handleThumbnailReady = (event: CustomEvent) => { const { pageNumber, thumbnail, pageId } = event.detail; console.log(`📸 PageThumbnail: Received worker thumbnail for page ${pageNumber}, looking for page ${page.pageNumber} (${page.id})`); - + if (pageNumber === page.pageNumber && pageId === page.id) { console.log(`✓ PageThumbnail: Thumbnail matched for page ${page.pageNumber}, setting URL`); setThumbnailUrl(thumbnail);