From cf867992166d63b7277cdc91ffa96bff5570b054 Mon Sep 17 00:00:00 2001
From: EthanHealy01 <ethan.healy.21@gmail.com>
Date: Wed, 12 Nov 2025 14:29:56 +0000
Subject: [PATCH] make maxFiles work inside tools and have it prefer most
 recently selected files

---
 .../core/components/fileEditor/FileEditor.tsx | 29 +++++++++++++++++--
 .../core/data/useTranslatedToolRegistry.tsx   |  2 +-
 frontend/src/core/tools/ShowJS.tsx            |  9 ------
 3 files changed, 27 insertions(+), 13 deletions(-)

diff --git a/frontend/src/core/components/fileEditor/FileEditor.tsx b/frontend/src/core/components/fileEditor/FileEditor.tsx
index 139e6e16a..76e6bb1a2 100644
--- a/frontend/src/core/components/fileEditor/FileEditor.tsx
+++ b/frontend/src/core/components/fileEditor/FileEditor.tsx
@@ -69,6 +69,12 @@ const FileEditor = ({
   // Current tool (for enforcing maxFiles limits)
   const { selectedTool } = useToolWorkflow();
 
+  // Compute effective max allowed files based on the active tool and mode
+  const maxAllowed = useMemo<number>(() => {
+    const rawMax = selectedTool?.maxFiles;
+    return (!toolMode || rawMax == null || rawMax < 0) ? Infinity : rawMax;
+  }, [selectedTool?.maxFiles, toolMode]);
+
   // Enable selection mode automatically in tool mode
   useEffect(() => {
     if (toolMode) {
@@ -87,7 +93,10 @@ const FileEditor = ({
   const localSelectedIds = contextSelectedIds;
 
   const handleSelectAllFiles = useCallback(() => {
-    setSelectedFiles(state.files.ids);
+    // Respect maxAllowed: if limited, select the last N files
+    const allIds = state.files.ids;
+    const idsToSelect = Number.isFinite(maxAllowed) ? allIds.slice(-maxAllowed) : allIds;
+    setSelectedFiles(idsToSelect);
     try {
       clearAllFileErrors();
     } catch (error) {
@@ -95,7 +104,7 @@ const FileEditor = ({
         console.warn('Failed to clear file errors on select all:', error);
       }
     }
-  }, [state.files.ids, setSelectedFiles, clearAllFileErrors]);
+  }, [state.files.ids, setSelectedFiles, clearAllFileErrors, maxAllowed]);
 
   const handleDeselectAllFiles = useCallback(() => {
     setSelectedFiles([]);
@@ -135,6 +144,13 @@ const FileEditor = ({
         // - HTML ZIPs stay intact
         // - Non-ZIP files pass through unchanged
         await addFiles(uploadedFiles, { selectFiles: true });
+        // After auto-selection, enforce maxAllowed if needed
+        if (Number.isFinite(maxAllowed)) {
+          const nowSelectedIds = selectors.getSelectedStirlingFileStubs().map(r => r.id);
+          if (nowSelectedIds.length > maxAllowed) {
+            setSelectedFiles(nowSelectedIds.slice(-maxAllowed));
+          }
+        }
         showStatus(`Added ${uploadedFiles.length} file(s)`, 'success');
       }
     } catch (err) {
@@ -142,7 +158,7 @@ const FileEditor = ({
       showError(errorMessage);
       console.error('File processing error:', err);
     }
-  }, [addFiles, showStatus, showError]);
+  }, [addFiles, showStatus, showError, selectors, maxAllowed, setSelectedFiles]);
 
   const toggleFile = useCallback((fileId: FileId) => {
     const currentSelectedIds = contextSelectedIdsRef.current;
@@ -181,6 +197,13 @@ const FileEditor = ({
     setSelectedFiles(newSelection);
   }, [setSelectedFiles, toolMode, _setStatus, activeStirlingFileStubs, selectedTool?.maxFiles]);
 
+  // Enforce maxAllowed when tool changes or when an external action sets too many selected files
+  useEffect(() => {
+    if (Number.isFinite(maxAllowed) && selectedFileIds.length > maxAllowed) {
+      setSelectedFiles(selectedFileIds.slice(-maxAllowed));
+    }
+  }, [maxAllowed, selectedFileIds, setSelectedFiles]);
+
 
   // File reordering handler for drag and drop
   const handleReorderFiles = useCallback((sourceFileId: FileId, targetFileId: FileId, selectedFileIds: FileId[]) => {
diff --git a/frontend/src/core/data/useTranslatedToolRegistry.tsx b/frontend/src/core/data/useTranslatedToolRegistry.tsx
index 118cb4fd5..a7bb4ff90 100644
--- a/frontend/src/core/data/useTranslatedToolRegistry.tsx
+++ b/frontend/src/core/data/useTranslatedToolRegistry.tsx
@@ -467,7 +467,7 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.PAGE_FORMATTING,
         synonyms: getSynonyms(t, "addAttachments"),
-        maxFiles: 1,
+        maxFiles: 3,
         endpoints: ["add-attachments"],
         operationConfig: addAttachmentsOperationConfig,
         automationSettings: AddAttachmentsSettings,
diff --git a/frontend/src/core/tools/ShowJS.tsx b/frontend/src/core/tools/ShowJS.tsx
index 0282b5511..234298d9b 100644
--- a/frontend/src/core/tools/ShowJS.tsx
+++ b/frontend/src/core/tools/ShowJS.tsx
@@ -100,15 +100,6 @@ const ShowJS = (props: BaseToolProps) => {
 			isCollapsed: false,
 		},
 		steps: [],
-		preview: (
-			<>
-				{base.selectedFiles.length > 1 && (
-					<div style={{ color: 'var(--mantine-color-red-6)', padding: '8px 4px' }}>
-						{t('showJS.singleFileWarning', 'This tool only supports one file at a time. Please select a single file.')}
-					</div>
-				)}
-			</>
-		),
 		executeButton: {
 			text: hasResults ? t('back', 'Back') : t('showJS.submit', 'Extract JavaScript'),
 			loadingText: t('loading', 'Loading...'),