@gallop.software/studio 1.3.6 → 1.4.1

package/dist/{StudioUI-OY33OEG2.js → StudioUI-DBZLGGPL.js}

@@ -23,7 +23,8 @@ var defaultActionState = {
   actionPaths: [],
   syncImageCount: 0,
   syncHasRemote: false,
-  syncHasLocal: false
+  syncHasLocal: false,
+  processMode: "generate"
 };
 var defaultState = {
   isOpen: false,
@@ -90,6 +91,8 @@ var defaultState = {
   },
   requestProcess: () => {
   },
+  setProcessMode: () => {
+  },
   confirmDelete: async () => {
   },
   confirmMove: async () => {
@@ -5294,7 +5297,8 @@ var defaultActionState2 = {
   actionPaths: [],
   syncImageCount: 0,
   syncHasRemote: false,
-  syncHasLocal: false
+  syncHasLocal: false,
+  processMode: "generate"
 };
 function useStudioActions({
   triggerRefresh,
@@ -5351,7 +5355,15 @@ function useStudioActions({
     setActionState((prev) => ({
       ...prev,
       actionPaths: paths,
-      showProcessConfirm: true
+      showProcessConfirm: true,
+      processMode: "generate"
+      // Reset to default when opening modal
+    }));
+  }, []);
+  const setProcessMode = _react.useCallback.call(void 0, (mode) => {
+    setActionState((prev) => ({
+      ...prev,
+      processMode: mode
     }));
   }, []);
   const cancelAction = _react.useCallback.call(void 0, () => {
@@ -5538,27 +5550,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 }),
@@ -5571,7 +5588,7 @@ 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;
       }
@@ -5635,7 +5652,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);
@@ -5644,13 +5661,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]);
+  }, [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;
@@ -5684,6 +5701,7 @@ function useStudioActions({
     requestMove,
     requestSync,
     requestProcess,
+    setProcessMode,
     cancelAction,
     closeProgress,
     stopProcessing,
@@ -6021,6 +6039,7 @@ function StudioUI({ onClose, isVisible = true }) {
     requestMove: actions.requestMove,
     requestSync: actions.requestSync,
     requestProcess: actions.requestProcess,
+    setProcessMode: actions.setProcessMode,
     confirmDelete: actions.confirmDelete,
     confirmMove: actions.confirmMove,
     confirmSync: actions.confirmSync,
@@ -6089,11 +6108,11 @@ 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
       }
@@ -6119,6 +6138,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) => ({
@@ -6161,4 +6324,4 @@ var StudioUI_default = StudioUI;
 
 
 exports.StudioUI = StudioUI; exports.default = StudioUI_default;
-//# sourceMappingURL=StudioUI-OY33OEG2.js.map
+//# sourceMappingURL=StudioUI-DBZLGGPL.js.map