@gallop.software/studio 1.4.0 → 1.4.2

package/dist/{StudioUI-YRXPBDUX.js → StudioUI-MAOXE72P.js}

@@ -20,11 +20,11 @@ var defaultActionState = {
   showMoveModal: false,
   showSyncConfirm: false,
   showProcessConfirm: false,
-  showUnprocessConfirm: false,
   actionPaths: [],
   syncImageCount: 0,
   syncHasRemote: false,
-  syncHasLocal: false
+  syncHasLocal: false,
+  processMode: "generate"
 };
 var defaultState = {
   isOpen: false,
@@ -91,7 +91,7 @@ var defaultState = {
   },
   requestProcess: () => {
   },
-  requestUnprocess: () => {
+  setProcessMode: () => {
   },
   confirmDelete: async () => {
   },
@@ -101,8 +101,6 @@ var defaultState = {
   },
   confirmProcess: async () => {
   },
-  confirmUnprocess: async () => {
-  },
   cancelAction: () => {
   },
   closeProgress: () => {
@@ -1743,15 +1741,13 @@ var styles5 = {
   `
 };
 function StudioToolbar() {
-  const { selectedItems, viewMode, setViewMode, clearSelection, currentPath, triggerRefresh, focusedItem, scanRequested, clearScanRequest, fileItems } = useStudio();
+  const { selectedItems, viewMode, setViewMode, clearSelection, currentPath, triggerRefresh, focusedItem, scanRequested, clearScanRequest, fileItems, requestProcess, actionState } = useStudio();
   const fileInputRef = _react.useRef.call(void 0, null);
   const abortControllerRef = _react.useRef.call(void 0, null);
   const [showAddNewModal, setShowAddNewModal] = _react.useState.call(void 0, false);
   const [uploading, setUploading] = _react.useState.call(void 0, false);
   const [scanning, setScanning] = _react.useState.call(void 0, false);
-  const [processing, setProcessing] = _react.useState.call(void 0, false);
   const [showDeleteConfirm, setShowDeleteConfirm] = _react.useState.call(void 0, false);
-  const [showProcessConfirm, setShowProcessConfirm] = _react.useState.call(void 0, false);
   const [showSyncConfirm, setShowSyncConfirm] = _react.useState.call(void 0, false);
   const [syncImageCount, setSyncImageCount] = _react.useState.call(void 0, 0);
   const [syncHasRemote, setSyncHasRemote] = _react.useState.call(void 0, false);
@@ -1764,9 +1760,6 @@ function StudioToolbar() {
     percent: 0,
     status: "processing"
   });
-  const [processCount, setProcessCount] = _react.useState.call(void 0, 0);
-  const [processMode, setProcessMode] = _react.useState.call(void 0, "all");
-  const [imagesToProcess, setImagesToProcess] = _react.useState.call(void 0, []);
   const [alertMessage, setAlertMessage] = _react.useState.call(void 0, null);
   const [showNewFolderModal, setShowNewFolderModal] = _react.useState.call(void 0, false);
   const [showRenameFolderModal, setShowRenameFolderModal] = _react.useState.call(void 0, false);
@@ -2001,234 +1994,29 @@ function StudioToolbar() {
         });
         return;
       }
-      setProcessCount(selectedImagePaths.length);
-      setImagesToProcess(selectedImagePaths);
-      setProcessMode("selected");
-      setShowProcessConfirm(true);
+      requestProcess(selectedImagePaths);
     } else {
       try {
         const response = await fetch("/api/studio/count-images");
         const data = await response.json();
-        if (data.count === 0) {
+        if (!data.images || data.images.length === 0) {
           setAlertMessage({
             title: "No Images Found",
             message: "No images found in the public folder to process."
           });
           return;
         }
-        setProcessCount(data.count);
-        setProcessMode("all");
-        setShowProcessConfirm(true);
+        const allImagePaths = data.images.map((img) => `public/${img}`);
+        requestProcess(allImagePaths);
       } catch (error) {
-        console.error("Failed to count images:", error);
+        console.error("Failed to get images:", error);
         setAlertMessage({
           title: "Error",
-          message: "Failed to count images."
-        });
-      }
-    }
-  }, [selectedItems]);
-  const handleProcessConfirm = _react.useCallback.call(void 0, async () => {
-    setShowProcessConfirm(false);
-    setProcessing(true);
-    abortControllerRef.current = new AbortController();
-    const signal = abortControllerRef.current.signal;
-    try {
-      if (processMode === "all") {
-        setProgressTitle("Processing Images");
-        setShowProgress(true);
-        setProgressState({
-          current: 0,
-          total: processCount,
-          percent: 0,
-          status: "processing"
-        });
-        const response = await fetch("/api/studio/process-all", {
-          method: "POST",
-          signal
-        });
-        if (!response.body) {
-          throw new Error("No response body");
-        }
-        const reader = response.body.getReader();
-        const decoder = new TextDecoder();
-        try {
-          while (true) {
-            const { done, value } = await reader.read();
-            if (done) break;
-            if (signal.aborted) {
-              reader.cancel();
-              break;
-            }
-            const text = decoder.decode(value);
-            const lines = text.split("\n\n").filter((line) => line.startsWith("data: "));
-            for (const line of lines) {
-              try {
-                const data = JSON.parse(line.replace("data: ", ""));
-                if (data.type === "start") {
-                  setProgressState((prev) => ({
-                    ...prev,
-                    total: data.total
-                  }));
-                } else if (data.type === "progress") {
-                  setProgressState({
-                    current: data.current,
-                    total: data.total,
-                    percent: data.percent,
-                    currentFile: data.currentFile,
-                    status: "processing"
-                  });
-                } else if (data.type === "cleanup") {
-                  setProgressState((prev) => ({
-                    ...prev,
-                    status: "cleanup",
-                    currentFile: void 0
-                  }));
-                } else if (data.type === "complete") {
-                  setProgressState({
-                    current: data.processed,
-                    total: data.processed,
-                    percent: 100,
-                    status: "complete",
-                    processed: data.processed,
-                    alreadyProcessed: data.alreadyProcessed,
-                    orphansRemoved: data.orphansRemoved,
-                    errors: data.errors
-                  });
-                  triggerRefresh();
-                } else if (data.type === "error") {
-                  setProgressState((prev) => ({
-                    ...prev,
-                    status: "error",
-                    message: data.message
-                  }));
-                }
-              } catch (e3) {
-              }
-            }
-          }
-        } catch (err) {
-          if (signal.aborted) {
-            setProgressState((prev) => ({
-              ...prev,
-              status: "stopped",
-              processed: prev.current
-            }));
-            triggerRefresh();
-          } else {
-            throw err;
-          }
-        }
-      } else {
-        setShowProgress(true);
-        setProgressState({
-          current: 0,
-          total: processCount,
-          percent: 0,
-          status: "processing"
-        });
-        const selectedImageKeys = imagesToProcess.map((p) => {
-          const key = p.replace(/^public\//, "");
-          return key.startsWith("/") ? key : `/${key}`;
+          message: "Failed to get images."
         });
-        const response = await fetch("/api/studio/reprocess-stream", {
-          method: "POST",
-          headers: { "Content-Type": "application/json" },
-          body: JSON.stringify({ imageKeys: selectedImageKeys }),
-          signal
-        });
-        if (!response.ok) {
-          const error = await response.json();
-          setProgressState({
-            current: 0,
-            total: 0,
-            percent: 0,
-            status: "error",
-            message: error.error || "Unknown error"
-          });
-        } else {
-          const reader = _optionalChain([response, 'access', _20 => _20.body, 'optionalAccess', _21 => _21.getReader, 'call', _22 => _22()]);
-          const decoder = new TextDecoder();
-          if (reader) {
-            let buffer = "";
-            while (true) {
-              const { done, value } = await reader.read();
-              if (done) break;
-              buffer += decoder.decode(value, { stream: true });
-              const lines = buffer.split("\n");
-              buffer = lines.pop() || "";
-              for (const line of lines) {
-                if (line.startsWith("data: ")) {
-                  try {
-                    const data = JSON.parse(line.slice(6));
-                    if (data.type === "start") {
-                      setProgressState((prev) => ({
-                        ...prev,
-                        total: data.total
-                      }));
-                    } else if (data.type === "progress") {
-                      setProgressState({
-                        current: data.current,
-                        total: data.total,
-                        percent: data.percent,
-                        status: "processing",
-                        message: data.message
-                      });
-                    } else if (data.type === "cleanup") {
-                      setProgressState((prev) => ({
-                        ...prev,
-                        status: "cleanup",
-                        message: data.message
-                      }));
-                    } else if (data.type === "complete") {
-                      setProgressState({
-                        current: data.processed,
-                        total: data.processed,
-                        percent: 100,
-                        status: data.errors > 0 ? "error" : "complete",
-                        processed: data.processed,
-                        message: data.message
-                      });
-                      clearSelection();
-                      triggerRefresh();
-                    } else if (data.type === "error") {
-                      setProgressState((prev) => ({
-                        ...prev,
-                        status: "error",
-                        message: data.message
-                      }));
-                    }
-                  } catch (e4) {
-                  }
-                }
-              }
-            }
-          }
-        }
       }
-    } catch (error) {
-      if (signal.aborted) {
-        setProgressState((prev) => ({
-          ...prev,
-          status: "stopped",
-          processed: prev.current
-        }));
-        triggerRefresh();
-      } else {
-        console.error("Processing error:", error);
-        setProgressState({
-          current: 0,
-          total: 0,
-          percent: 0,
-          status: "error",
-          message: "Processing failed. Check console for details."
-        });
-      }
-    } finally {
-      setProcessing(false);
-      abortControllerRef.current = null;
     }
-  }, [processMode, processCount, imagesToProcess, clearSelection, triggerRefresh]);
+  }, [selectedItems, requestProcess]);
   const handleStopProcessing = _react.useCallback.call(void 0, () => {
     if (abortControllerRef.current) {
       abortControllerRef.current.abort();
@@ -2301,7 +2089,7 @@ function StudioToolbar() {
     const selectedPaths2 = Array.from(selectedItems);
     const imageExtensions = ["jpg", "jpeg", "png", "gif", "webp", "svg", "ico", "bmp", "tiff", "tif"];
     const selectedImagePaths = selectedPaths2.filter((p) => {
-      const ext = _optionalChain([p, 'access', _23 => _23.split, 'call', _24 => _24("."), 'access', _25 => _25.pop, 'call', _26 => _26(), 'optionalAccess', _27 => _27.toLowerCase, 'call', _28 => _28()]) || "";
+      const ext = _optionalChain([p, 'access', _20 => _20.split, 'call', _21 => _21("."), 'access', _22 => _22.pop, 'call', _23 => _23(), 'optionalAccess', _24 => _24.toLowerCase, 'call', _25 => _25()]) || "";
       return imageExtensions.includes(ext);
     });
     const selectedFolders = selectedPaths2.filter((p) => !p.includes(".") || p.endsWith("/"));
@@ -2350,7 +2138,7 @@ function StudioToolbar() {
     const selectedPaths2 = Array.from(selectedItems);
     const imageExtensions = ["jpg", "jpeg", "png", "gif", "webp", "svg", "ico", "bmp", "tiff", "tif"];
     const selectedImagePaths = selectedPaths2.filter((p) => {
-      const ext = _optionalChain([p, 'access', _29 => _29.split, 'call', _30 => _30("."), 'access', _31 => _31.pop, 'call', _32 => _32(), 'optionalAccess', _33 => _33.toLowerCase, 'call', _34 => _34()]) || "";
+      const ext = _optionalChain([p, 'access', _26 => _26.split, 'call', _27 => _27("."), 'access', _28 => _28.pop, 'call', _29 => _29(), 'optionalAccess', _30 => _30.toLowerCase, 'call', _31 => _31()]) || "";
       return imageExtensions.includes(ext);
     });
     const selectedFolders = selectedPaths2.filter((p) => !p.includes(".") || p.endsWith("/"));
@@ -2401,16 +2189,16 @@ function StudioToolbar() {
           });
           const data = await response.json();
           if (!response.ok) {
-            if (_optionalChain([data, 'access', _35 => _35.error, 'optionalAccess', _36 => _36.includes, 'call', _37 => _37("R2 not configured")]) || _optionalChain([data, 'access', _38 => _38.error, 'optionalAccess', _39 => _39.includes, 'call', _40 => _40("CLOUDFLARE_R2")])) {
+            if (_optionalChain([data, 'access', _32 => _32.error, 'optionalAccess', _33 => _33.includes, 'call', _34 => _34("R2 not configured")]) || _optionalChain([data, 'access', _35 => _35.error, 'optionalAccess', _36 => _36.includes, 'call', _37 => _37("CLOUDFLARE_R2")])) {
               setShowProgress(false);
               setShowR2SetupModal(true);
               return;
             }
             errors++;
             errorMessages.push(data.error || `Failed: ${imageKey}`);
-          } else if (_optionalChain([data, 'access', _41 => _41.pushed, 'optionalAccess', _42 => _42.length]) > 0) {
+          } else if (_optionalChain([data, 'access', _38 => _38.pushed, 'optionalAccess', _39 => _39.length]) > 0) {
             pushed++;
-          } else if (_optionalChain([data, 'access', _43 => _43.errors, 'optionalAccess', _44 => _44.length]) > 0) {
+          } else if (_optionalChain([data, 'access', _40 => _40.errors, 'optionalAccess', _41 => _41.length]) > 0) {
             errors++;
             for (const errMsg of data.errors) {
               errorMessages.push(errMsg);
@@ -2532,7 +2320,7 @@ function StudioToolbar() {
                 errorMessage: data.message
               }));
             }
-          } catch (e5) {
+          } catch (e3) {
           }
         }
       }
@@ -2607,16 +2395,6 @@ function StudioToolbar() {
         onCancel: () => setShowSyncConfirm(false)
       }
     ),
-    showProcessConfirm && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      ConfirmModal,
-      {
-        title: "Process Images",
-        message: processMode === "all" ? `Found ${processCount} image${processCount !== 1 ? "s" : ""} in the public folder. This will regenerate all thumbnails and remove any orphaned files from the images folder.` : `Process ${processCount} selected image${processCount !== 1 ? "s" : ""}? This will regenerate thumbnails for these files.`,
-        confirmLabel: processing ? "Processing..." : "Process",
-        onConfirm: handleProcessConfirm,
-        onCancel: () => setShowProcessConfirm(false)
-      }
-    ),
     showProgress && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
       ProgressModal,
       {
@@ -2740,11 +2518,11 @@ function StudioToolbar() {
           {
             css: styles5.btn,
             onClick: handleProcessImages,
-            disabled: processing || isInImagesFolder,
+            disabled: actionState.showProgress || isInImagesFolder,
             title: isInImagesFolder ? "Cannot process images folder" : void 0,
             children: [
               /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ImageStackIcon, {}),
-              processing ? "Processing..." : "Process Images"
+              "Process Images"
             ]
           }
         ),
@@ -4498,7 +4276,6 @@ function StudioDetailView() {
     requestMove,
     requestSync,
     requestProcess,
-    requestUnprocess,
     actionState
   } = useStudio();
   const [showRenameModal, setShowRenameModal] = _react.useState.call(void 0, false);
@@ -4698,19 +4475,6 @@ function StudioDetailView() {
                 ]
               }
             ),
-            /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-              "button",
-              {
-                css: styles8.actionBtn,
-                onClick: () => requestUnprocess([focusedItem.path]),
-                disabled: isActionInProgress || focusedItem.isProtected || !focusedItem.hasThumbnail,
-                title: !focusedItem.hasThumbnail ? "No thumbnails to remove" : void 0,
-                children: [
-                  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { css: styles8.actionIcon, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16" }) }),
-                  "Remove Thumbnails"
-                ]
-              }
-            ),
             /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
               "button",
               {
@@ -5310,11 +5074,11 @@ var defaultActionState2 = {
   showMoveModal: false,
   showSyncConfirm: false,
   showProcessConfirm: false,
-  showUnprocessConfirm: false,
   actionPaths: [],
   syncImageCount: 0,
   syncHasRemote: false,
-  syncHasLocal: false
+  syncHasLocal: false,
+  processMode: "generate"
 };
 function useStudioActions({
   triggerRefresh,
@@ -5371,14 +5135,15 @@ function useStudioActions({
     setActionState((prev) => ({
       ...prev,
       actionPaths: paths,
-      showProcessConfirm: true
+      showProcessConfirm: true,
+      processMode: "generate"
+      // Reset to default when opening modal
     }));
   }, []);
-  const requestUnprocess = _react.useCallback.call(void 0, (paths) => {
+  const setProcessMode = _react.useCallback.call(void 0, (mode) => {
     setActionState((prev) => ({
       ...prev,
-      actionPaths: paths,
-      showUnprocessConfirm: true
+      processMode: mode
     }));
   }, []);
   const cancelAction = _react.useCallback.call(void 0, () => {
@@ -5387,8 +5152,7 @@ function useStudioActions({
       showDeleteConfirm: false,
       showMoveModal: false,
       showSyncConfirm: false,
-      showProcessConfirm: false,
-      showUnprocessConfirm: false
+      showProcessConfirm: false
     }));
   }, []);
   const closeProgress = _react.useCallback.call(void 0, () => {
@@ -5450,7 +5214,7 @@ function useStudioActions({
         });
         return;
       }
-      const reader = _optionalChain([response, 'access', _45 => _45.body, 'optionalAccess', _46 => _46.getReader, 'call', _47 => _47()]);
+      const reader = _optionalChain([response, 'access', _42 => _42.body, 'optionalAccess', _43 => _43.getReader, 'call', _44 => _44()]);
       const decoder = new TextDecoder();
       if (reader) {
         let buffer = "";
@@ -5480,7 +5244,7 @@ function useStudioActions({
                     status: "complete",
                     message: `Moved ${data.moved} file${data.moved !== 1 ? "s" : ""}${data.errors > 0 ? `, ${data.errors} error${data.errors !== 1 ? "s" : ""}` : ""}`
                   }));
-                  if (data.errors > 0 && _optionalChain([data, 'access', _48 => _48.errorMessages, 'optionalAccess', _49 => _49.length]) > 0) {
+                  if (data.errors > 0 && _optionalChain([data, 'access', _45 => _45.errorMessages, 'optionalAccess', _46 => _46.length]) > 0) {
                     showError("Move Failed", data.errorMessages.join("\n"));
                   }
                   clearSelection();
@@ -5493,7 +5257,7 @@ function useStudioActions({
                     message: data.message || "Unknown error"
                   }));
                 }
-              } catch (e6) {
+              } catch (e4) {
               }
             }
           }
@@ -5566,27 +5330,32 @@ function useStudioActions({
   }, [actionState.actionPaths, clearSelection, triggerRefresh, showError, setProgressState]);
   const confirmProcess = _react.useCallback.call(void 0, async () => {
     const paths = actionState.actionPaths;
+    const mode = actionState.processMode;
     const imageKeys = paths.map((p) => {
       const key = p.replace(/^public\//, "");
       return key.startsWith("/") ? key : `/${key}`;
     });
+    const isRemove = mode === "remove";
+    const endpoint = isRemove ? "/api/studio/unprocess-stream" : "/api/studio/reprocess-stream";
+    const progressTitle = isRemove ? "Removing Thumbnails" : "Processing Images";
+    const progressMessage = isRemove ? "Removing thumbnails..." : "Processing images...";
     setActionState((prev) => ({
       ...prev,
       showProcessConfirm: false,
       showProgress: true,
-      progressTitle: "Processing Images",
+      progressTitle,
       progressState: {
         current: 0,
         total: imageKeys.length,
         percent: 0,
         status: "processing",
-        message: "Processing images..."
+        message: progressMessage
       }
     }));
     abortControllerRef.current = new AbortController();
     const signal = abortControllerRef.current.signal;
     try {
-      const response = await fetch("/api/studio/reprocess-stream", {
+      const response = await fetch(endpoint, {
         method: "POST",
         headers: { "Content-Type": "application/json" },
         body: JSON.stringify({ imageKeys }),
@@ -5599,11 +5368,11 @@ function useStudioActions({
           total: imageKeys.length,
           percent: 0,
           status: "error",
-          message: error.error || "Processing failed"
+          message: error.error || (isRemove ? "Failed to remove thumbnails" : "Processing failed")
         });
         return;
       }
-      const reader = _optionalChain([response, 'access', _50 => _50.body, 'optionalAccess', _51 => _51.getReader, 'call', _52 => _52()]);
+      const reader = _optionalChain([response, 'access', _47 => _47.body, 'optionalAccess', _48 => _48.getReader, 'call', _49 => _49()]);
       const decoder = new TextDecoder();
       if (reader) {
         let buffer = "";
@@ -5652,7 +5421,7 @@ function useStudioActions({
                     message: data.message
                   }));
                 }
-              } catch (e7) {
+              } catch (e5) {
               }
             }
           }
@@ -5663,7 +5432,7 @@ function useStudioActions({
         setProgressState((prev) => ({
           ...prev,
           status: "stopped",
-          message: "Processing stopped by user"
+          message: isRemove ? "Removal stopped by user" : "Processing stopped by user"
         }));
       } else {
         console.error("Processing error:", error);
@@ -5672,115 +5441,13 @@ function useStudioActions({
           total: imageKeys.length,
           percent: 0,
           status: "error",
-          message: "Processing failed. Check console for details."
+          message: isRemove ? "Failed to remove thumbnails. Check console for details." : "Processing failed. Check console for details."
         });
       }
     } finally {
       abortControllerRef.current = null;
     }
-  }, [actionState.actionPaths, triggerRefresh, setProgressState]);
-  const confirmUnprocess = _react.useCallback.call(void 0, async () => {
-    const paths = actionState.actionPaths;
-    const imageKeys = paths.map((p) => {
-      const key = p.replace(/^public\//, "");
-      return key.startsWith("/") ? key : `/${key}`;
-    });
-    setActionState((prev) => ({
-      ...prev,
-      showUnprocessConfirm: false,
-      showProgress: true,
-      progressTitle: "Removing Thumbnails",
-      progressState: {
-        current: 0,
-        total: imageKeys.length,
-        percent: 0,
-        status: "processing",
-        message: "Removing thumbnails..."
-      }
-    }));
-    try {
-      const response = await fetch("/api/studio/unprocess-stream", {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({ imageKeys })
-      });
-      if (!response.ok) {
-        const error = await response.json();
-        setProgressState({
-          current: 0,
-          total: imageKeys.length,
-          percent: 0,
-          status: "error",
-          message: error.error || "Failed to remove thumbnails"
-        });
-        return;
-      }
-      const reader = _optionalChain([response, 'access', _53 => _53.body, 'optionalAccess', _54 => _54.getReader, 'call', _55 => _55()]);
-      const decoder = new TextDecoder();
-      if (reader) {
-        let buffer = "";
-        while (true) {
-          const { done, value } = await reader.read();
-          if (done) break;
-          buffer += decoder.decode(value, { stream: true });
-          const lines = buffer.split("\n");
-          buffer = lines.pop() || "";
-          for (const line of lines) {
-            if (line.startsWith("data: ")) {
-              try {
-                const data = JSON.parse(line.slice(6));
-                if (data.type === "start") {
-                  setProgressState((prev) => ({
-                    ...prev,
-                    total: data.total
-                  }));
-                } else if (data.type === "progress") {
-                  setProgressState({
-                    current: data.current,
-                    total: data.total,
-                    percent: data.percent,
-                    status: "processing",
-                    message: data.message
-                  });
-                } else if (data.type === "cleanup") {
-                  setProgressState((prev) => ({
-                    ...prev,
-                    status: "cleanup",
-                    message: data.message
-                  }));
-                } else if (data.type === "complete") {
-                  setProgressState({
-                    current: data.processed,
-                    total: data.processed,
-                    percent: 100,
-                    status: data.errors > 0 ? "error" : "complete",
-                    message: data.message
-                  });
-                  triggerRefresh();
-                } else if (data.type === "error") {
-                  setProgressState((prev) => ({
-                    ...prev,
-                    status: "error",
-                    message: data.message
-                  }));
-                }
-              } catch (e8) {
-              }
-            }
-          }
-        }
-      }
-    } catch (error) {
-      console.error("Unprocess error:", error);
-      setProgressState({
-        current: 0,
-        total: imageKeys.length,
-        percent: 0,
-        status: "error",
-        message: "Failed to remove thumbnails. Check console for details."
-      });
-    }
-  }, [actionState.actionPaths, triggerRefresh, setProgressState]);
+  }, [actionState.actionPaths, actionState.processMode, triggerRefresh, setProgressState]);
   const deleteOrphans = _react.useCallback.call(void 0, async () => {
     const orphanedFiles = actionState.progressState.orphanedFiles;
     if (!orphanedFiles || orphanedFiles.length === 0) return;
@@ -5794,7 +5461,7 @@ function useStudioActions({
         setProgressState((prev) => ({
           ...prev,
           orphanedFiles: void 0,
-          message: _optionalChain([prev, 'access', _56 => _56.message, 'optionalAccess', _57 => _57.replace, 'call', _58 => _58(/Found \d+ orphaned thumbnail\(s\).*/, "Orphaned thumbnails deleted.")])
+          message: _optionalChain([prev, 'access', _50 => _50.message, 'optionalAccess', _51 => _51.replace, 'call', _52 => _52(/Found \d+ orphaned thumbnail\(s\).*/, "Orphaned thumbnails deleted.")])
         }));
         triggerRefresh();
       } else {
@@ -5814,7 +5481,7 @@ function useStudioActions({
     requestMove,
     requestSync,
     requestProcess,
-    requestUnprocess,
+    setProcessMode,
     cancelAction,
     closeProgress,
     stopProcessing,
@@ -5822,7 +5489,6 @@ function useStudioActions({
     confirmMove,
     confirmSync,
     confirmProcess,
-    confirmUnprocess,
     deleteOrphans
   };
 }
@@ -6153,12 +5819,11 @@ function StudioUI({ onClose, isVisible = true }) {
     requestMove: actions.requestMove,
     requestSync: actions.requestSync,
     requestProcess: actions.requestProcess,
-    requestUnprocess: actions.requestUnprocess,
+    setProcessMode: actions.setProcessMode,
     confirmDelete: actions.confirmDelete,
     confirmMove: actions.confirmMove,
     confirmSync: actions.confirmSync,
     confirmProcess: actions.confirmProcess,
-    confirmUnprocess: actions.confirmUnprocess,
     cancelAction: actions.cancelAction,
     closeProgress: actions.closeProgress,
     stopProcessing: actions.stopProcessing,
@@ -6223,26 +5888,15 @@ function StudioUI({ onClose, isVisible = true }) {
       }
     ),
     actions.actionState.showProcessConfirm && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      ConfirmModal,
+      ProcessConfirmModal,
       {
-        title: "Process Images",
-        message: `Generate thumbnails for ${actions.actionState.actionPaths.length} image${actions.actionState.actionPaths.length !== 1 ? "s" : ""}?`,
-        confirmLabel: "Process",
+        imageCount: actions.actionState.actionPaths.length,
+        mode: actions.actionState.processMode,
+        onModeChange: actions.setProcessMode,
         onConfirm: actions.confirmProcess,
         onCancel: actions.cancelAction
       }
     ),
-    actions.actionState.showUnprocessConfirm && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      ConfirmModal,
-      {
-        title: "Remove Thumbnails",
-        message: `Remove generated thumbnails for ${actions.actionState.actionPaths.length} image${actions.actionState.actionPaths.length !== 1 ? "s" : ""}? Original images will be kept.`,
-        confirmLabel: "Remove",
-        variant: "danger",
-        onConfirm: actions.confirmUnprocess,
-        onCancel: actions.cancelAction
-      }
-    ),
     actions.actionState.showMoveModal && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
       StudioFolderPicker,
       {
@@ -6264,6 +5918,150 @@ function StudioUI({ onClose, isVisible = true }) {
     )
   ] }) });
 }
+function ProcessConfirmModal({ imageCount, mode, onModeChange, onConfirm, onCancel }) {
+  const processModalStyles = {
+    overlay: _react3.css`
+      position: fixed;
+      inset: 0;
+      background: rgba(0, 0, 0, 0.5);
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      z-index: 10000;
+    `,
+    container: _react3.css`
+      background: ${_chunkN6JYTJCBjs.colors.surface};
+      border-radius: 12px;
+      padding: 24px;
+      max-width: 420px;
+      width: 90%;
+      box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
+    `,
+    title: _react3.css`
+      font-size: ${_chunkN6JYTJCBjs.fontSize.lg};
+      font-weight: 600;
+      color: ${_chunkN6JYTJCBjs.colors.text};
+      margin: 0 0 16px;
+    `,
+    modeToggle: _react3.css`
+      display: flex;
+      gap: 8px;
+      margin-bottom: 16px;
+    `,
+    modeBtn: _react3.css`
+      flex: 1;
+      padding: 10px 16px;
+      border: 2px solid ${_chunkN6JYTJCBjs.colors.border};
+      border-radius: 8px;
+      background: ${_chunkN6JYTJCBjs.colors.background};
+      color: ${_chunkN6JYTJCBjs.colors.textSecondary};
+      font-size: ${_chunkN6JYTJCBjs.fontSize.base};
+      font-weight: 500;
+      cursor: pointer;
+      transition: all 0.15s ease;
+      
+      &:hover {
+        border-color: ${_chunkN6JYTJCBjs.colors.borderHover};
+      }
+    `,
+    modeBtnActive: _react3.css`
+      border-color: ${_chunkN6JYTJCBjs.colors.primary};
+      background: rgba(99, 91, 255, 0.1);
+      color: ${_chunkN6JYTJCBjs.colors.primary};
+    `,
+    modeBtnDanger: _react3.css`
+      border-color: ${_chunkN6JYTJCBjs.colors.danger};
+      background: rgba(239, 68, 68, 0.1);
+      color: ${_chunkN6JYTJCBjs.colors.danger};
+    `,
+    message: _react3.css`
+      font-size: ${_chunkN6JYTJCBjs.fontSize.base};
+      color: ${_chunkN6JYTJCBjs.colors.textSecondary};
+      margin: 0 0 20px;
+      line-height: 1.5;
+    `,
+    actions: _react3.css`
+      display: flex;
+      gap: 12px;
+      justify-content: flex-end;
+    `,
+    cancelBtn: _react3.css`
+      padding: 10px 20px;
+      border: 1px solid ${_chunkN6JYTJCBjs.colors.border};
+      border-radius: 8px;
+      background: ${_chunkN6JYTJCBjs.colors.background};
+      color: ${_chunkN6JYTJCBjs.colors.text};
+      font-size: ${_chunkN6JYTJCBjs.fontSize.base};
+      font-weight: 500;
+      cursor: pointer;
+      transition: all 0.15s ease;
+      
+      &:hover {
+        background: ${_chunkN6JYTJCBjs.colors.surfaceHover};
+        border-color: ${_chunkN6JYTJCBjs.colors.borderHover};
+      }
+    `,
+    confirmBtn: _react3.css`
+      padding: 10px 20px;
+      border: none;
+      border-radius: 8px;
+      background: ${_chunkN6JYTJCBjs.colors.primary};
+      color: white;
+      font-size: ${_chunkN6JYTJCBjs.fontSize.base};
+      font-weight: 500;
+      cursor: pointer;
+      transition: all 0.15s ease;
+      
+      &:hover {
+        background: ${_chunkN6JYTJCBjs.colors.primaryHover};
+      }
+    `,
+    confirmBtnDanger: _react3.css`
+      background: ${_chunkN6JYTJCBjs.colors.danger};
+      
+      &:hover {
+        background: #dc2626;
+      }
+    `
+  };
+  const isRemove = mode === "remove";
+  const title = "Process Images";
+  const message = isRemove ? `Remove generated thumbnails for ${imageCount} image${imageCount !== 1 ? "s" : ""}? Original images will be kept.` : `Generate thumbnails for ${imageCount} image${imageCount !== 1 ? "s" : ""}?`;
+  const confirmLabel = isRemove ? "Remove" : "Process";
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { css: processModalStyles.overlay, onClick: onCancel, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { css: processModalStyles.container, onClick: (e) => e.stopPropagation(), children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h2", { css: processModalStyles.title, children: title }),
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { css: processModalStyles.modeToggle, children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        "button",
+        {
+          css: [processModalStyles.modeBtn, mode === "generate" && processModalStyles.modeBtnActive],
+          onClick: () => onModeChange("generate"),
+          children: "Generate Thumbnails"
+        }
+      ),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        "button",
+        {
+          css: [processModalStyles.modeBtn, mode === "remove" && processModalStyles.modeBtnDanger],
+          onClick: () => onModeChange("remove"),
+          children: "Remove Thumbnails"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { css: processModalStyles.message, children: message }),
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { css: processModalStyles.actions, children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "button", { css: processModalStyles.cancelBtn, onClick: onCancel, children: "Cancel" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        "button",
+        {
+          css: [processModalStyles.confirmBtn, isRemove && processModalStyles.confirmBtnDanger],
+          onClick: onConfirm,
+          children: confirmLabel
+        }
+      )
+    ] })
+  ] }) });
+}
 function Breadcrumbs({ currentPath, onNavigate }) {
   const parts = currentPath.split("/").filter(Boolean);
   const breadcrumbs = parts.map((part, index) => ({
@@ -6306,4 +6104,4 @@ var StudioUI_default = StudioUI;
 
 
 exports.StudioUI = StudioUI; exports.default = StudioUI_default;
-//# sourceMappingURL=StudioUI-YRXPBDUX.js.map
+//# sourceMappingURL=StudioUI-MAOXE72P.js.map