@gallop.software/studio 0.1.115 → 1.0.0

package/dist/{StudioUI-73XFVFV4.mjs → StudioUI-KCUI5YUD.mjs}

@@ -341,6 +341,7 @@ function ProgressModal({
   title,
   progress,
   onClose,
+  onDeleteOrphans,
   onStop
 }) {
   const isComplete = progress.status === "complete";
@@ -437,6 +438,12 @@ function ProgressModal({
     ] }) }),
     /* @__PURE__ */ jsxs("div", { css: styles.footer, children: [
       isRunning && onStop && /* @__PURE__ */ jsx("button", { css: [styles.btn, styles.btnDanger], onClick: onStop, children: "Stop" }),
+      canClose && progress.orphanedFiles && progress.orphanedFiles.length > 0 && onDeleteOrphans && /* @__PURE__ */ jsxs("button", { css: [styles.btn, styles.btnDanger], onClick: onDeleteOrphans, children: [
+        "Delete ",
+        progress.orphanedFiles.length,
+        " Orphan",
+        progress.orphanedFiles.length !== 1 ? "s" : ""
+      ] }),
       canClose && /* @__PURE__ */ jsx("button", { css: [styles.btn, styles.btnConfirm], onClick: onClose, children: "Done" })
     ] })
   ] }) });
@@ -1701,6 +1708,8 @@ function StudioToolbar() {
   const [showProcessConfirm, setShowProcessConfirm] = useState4(false);
   const [showSyncConfirm, setShowSyncConfirm] = useState4(false);
   const [syncImageCount, setSyncImageCount] = useState4(0);
+  const [syncHasRemote, setSyncHasRemote] = useState4(false);
+  const [syncHasLocal, setSyncHasLocal] = useState4(false);
   const [showProgress, setShowProgress] = useState4(false);
   const [progressTitle, setProgressTitle] = useState4("Processing Images");
   const [progressState, setProgressState] = useState4({
@@ -1764,7 +1773,16 @@ function StudioToolbar() {
               status: "processing",
               currentFile: data.currentFile
             });
+          } else if (data.type === "cleanup") {
+            setProgressState((prev) => ({
+              ...prev,
+              message: data.message
+            }));
           } else if (data.type === "complete") {
+            let message = data.renamed > 0 ? `${data.renamed} file(s) renamed due to conflicts. ` : "";
+            if (data.orphanedFiles && data.orphanedFiles.length > 0) {
+              message += `Found ${data.orphanedFiles.length} orphaned thumbnail(s) in images folder.`;
+            }
             setProgressState({
               current: data.total || 0,
               total: data.total || 0,
@@ -1773,7 +1791,8 @@ function StudioToolbar() {
               processed: data.added,
               alreadyProcessed: data.existingCount,
               errors: data.errors,
-              message: data.renamed > 0 ? `${data.renamed} file(s) renamed due to conflicts` : void 0,
+              orphanedFiles: data.orphanedFiles,
+              message: message || void 0,
               isScan: true
             });
             triggerRefresh();
@@ -2119,6 +2138,38 @@ function StudioToolbar() {
       abortControllerRef.current.abort();
     }
   }, []);
+  const handleDeleteOrphans = useCallback2(async () => {
+    const orphanedFiles = progressState.orphanedFiles;
+    if (!orphanedFiles || orphanedFiles.length === 0) return;
+    try {
+      const response = await fetch("/api/studio/delete-orphans", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ paths: orphanedFiles })
+      });
+      const data = await response.json();
+      if (response.ok) {
+        setProgressState((prev) => ({
+          ...prev,
+          orphanedFiles: void 0,
+          orphansRemoved: data.deleted,
+          message: `Deleted ${data.deleted} orphaned thumbnail${data.deleted !== 1 ? "s" : ""}.`
+        }));
+        triggerRefresh();
+      } else {
+        setAlertMessage({
+          title: "Delete Failed",
+          message: data.error || "Failed to delete orphaned files."
+        });
+      }
+    } catch (error) {
+      console.error("Delete orphans error:", error);
+      setAlertMessage({
+        title: "Delete Failed",
+        message: "Failed to delete orphaned files. Check console for details."
+      });
+    }
+  }, [progressState.orphanedFiles, triggerRefresh]);
   const handleDeleteClick = useCallback2(() => {
     if (selectedItems.size === 0) return;
     setShowDeleteConfirm(true);
@@ -2181,9 +2232,23 @@ function StudioToolbar() {
       });
       return;
     }
+    let hasRemote = false;
+    let hasLocal = false;
+    for (const imgPath of selectedImagePaths) {
+      const item = fileItems.find((f) => f.path === imgPath);
+      if (item) {
+        if (item.isRemote) {
+          hasRemote = true;
+        } else if (!item.cdnPushed) {
+          hasLocal = true;
+        }
+      }
+    }
     setSyncImageCount(selectedImagePaths.length);
+    setSyncHasRemote(hasRemote);
+    setSyncHasLocal(hasLocal);
     setShowSyncConfirm(true);
-  }, [selectedItems]);
+  }, [selectedItems, fileItems]);
   const handleSyncConfirm = useCallback2(async () => {
     setShowSyncConfirm(false);
     const selectedPaths2 = Array.from(selectedItems);
@@ -2440,7 +2505,7 @@ function StudioToolbar() {
       ConfirmModal,
       {
         title: "Push to CDN",
-        message: `Push ${syncImageCount} image${syncImageCount !== 1 ? "s" : ""} to Cloudflare R2? Local images must be processed first. Remote images will be downloaded first. After pushing, local files will be deleted.`,
+        message: `Push ${syncImageCount} image${syncImageCount !== 1 ? "s" : ""} to Cloudflare R2?${syncHasRemote ? " Remote images will be downloaded first." : ""}${syncHasLocal ? " After pushing, local files will be deleted." : ""}`,
         confirmLabel: "Push",
         onConfirm: handleSyncConfirm,
         onCancel: () => setShowSyncConfirm(false)
@@ -2462,6 +2527,7 @@ function StudioToolbar() {
         title: progressTitle,
         progress: progressState,
         onStop: handleStopProcessing,
+        onDeleteOrphans: handleDeleteOrphans,
         onClose: () => {
           setShowProgress(false);
           setProgressState({
@@ -3371,7 +3437,7 @@ function GridItem({ item, isSelected, onClick, onOpen, onGenerateThumbnail }) {
   const [showCopied, setShowCopied] = useState6(false);
   const isFolder = item.type === "folder";
   const isImage = !isFolder && item.thumbnail !== void 0;
-  const isImagesFolder = isFolder && (item.name === "images" || item.path.includes("/images/"));
+  const isProtected = item.isProtected || isFolder && item.name === "images" && item.path === "public/images";
   const handleCopyPath = (e) => {
     e.stopPropagation();
     const pathToCopy = "/" + item.path.replace(/^public\//, "");
@@ -3379,13 +3445,21 @@ function GridItem({ item, isSelected, onClick, onOpen, onGenerateThumbnail }) {
     setShowCopied(true);
     setTimeout(() => setShowCopied(false), 1500);
   };
+  const handleClick = (e) => {
+    if (isProtected) {
+      e.stopPropagation();
+      onOpen();
+      return;
+    }
+    onClick(e);
+  };
   return /* @__PURE__ */ jsxs6(
     "div",
     {
-      css: [styles6.item, isSelected && styles6.itemSelected],
-      onClick,
+      css: [styles6.item, isSelected && !isProtected && styles6.itemSelected],
+      onClick: handleClick,
       children: [
-        /* @__PURE__ */ jsx6(
+        !isProtected && /* @__PURE__ */ jsx6(
           "div",
           {
             css: styles6.checkboxWrapper,
@@ -3402,7 +3476,7 @@ function GridItem({ item, isSelected, onClick, onOpen, onGenerateThumbnail }) {
           }
         ),
         /* @__PURE__ */ jsxs6("div", { css: styles6.content, children: [
-          item.cdnPushed && !item.isRemote && /* @__PURE__ */ jsx6("span", { css: styles6.statusBtn, title: "Pushed to CDN", children: /* @__PURE__ */ jsx6("svg", { css: styles6.cloudIcon, fill: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx6("path", { d: "M19.35 10.04C18.67 6.59 15.64 4 12 4 9.11 4 6.6 5.64 5.35 8.04 2.34 8.36 0 10.91 0 14c0 3.31 2.69 6 6 6h13c2.76 0 5-2.24 5-5 0-2.64-2.05-4.78-4.65-4.96z" }) }) }),
+          item.cdnPushed && !item.isRemote && /* @__PURE__ */ jsx6("span", { css: styles6.statusBtn, title: "Pushed to CDN", children: /* @__PURE__ */ jsx6("svg", { css: styles6.cloudIcon, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx6("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M3 15a4 4 0 004 4h9a5 5 0 10-.1-9.999 5.002 5.002 0 10-9.78 2.096A4.001 4.001 0 003 15z" }) }) }),
           item.isRemote && /* @__PURE__ */ jsx6("span", { css: styles6.statusBtn, title: "Remote image", children: /* @__PURE__ */ jsx6("svg", { css: styles6.globeIcon, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx6("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M21 12a9 9 0 01-9 9m9-9a9 9 0 00-9-9m9 9H3m9 9a9 9 0 01-9-9m9 9c1.657 0 3-4.03 3-9s-1.343-9-3-9m0 18c-1.657 0-3-4.03-3-9s1.343-9 3-9m-9 9a9 9 0 019-9" }) }) }),
           /* @__PURE__ */ jsxs6(
             "button",
@@ -3427,7 +3501,7 @@ function GridItem({ item, isSelected, onClick, onOpen, onGenerateThumbnail }) {
               children: "Open"
             }
           ),
-          isFolder ? isImagesFolder ? /* @__PURE__ */ jsxs6("div", { css: styles6.imagesFolderWrapper, children: [
+          isFolder ? isProtected ? /* @__PURE__ */ jsxs6("div", { css: styles6.imagesFolderWrapper, children: [
             /* @__PURE__ */ jsx6("svg", { css: styles6.imagesFolderIcon, fill: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx6("path", { d: "M10 4H4a2 2 0 00-2 2v12a2 2 0 002 2h16a2 2 0 002-2V8a2 2 0 00-2-2h-8l-2-2z" }) }),
             /* @__PURE__ */ jsx6("svg", { css: styles6.lockIcon, fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsx6("path", { fillRule: "evenodd", d: "M5 9V7a5 5 0 0110 0v2a2 2 0 012 2v5a2 2 0 01-2 2H5a2 2 0 01-2-2v-5a2 2 0 012-2zm8-2v2H7V7a3 3 0 016 0z", clipRule: "evenodd" }) })
           ] }) : /* @__PURE__ */ jsx6("svg", { css: styles6.folderIcon, fill: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx6("path", { d: "M10 4H4a2 2 0 00-2 2v12a2 2 0 002 2h16a2 2 0 002-2V8a2 2 0 00-2-2h-8l-2-2z" }) }) : isImage && item.thumbnail ? /* @__PURE__ */ jsx6(
@@ -3915,7 +3989,7 @@ function ListRow({ item, isSelected, onClick, onOpen, onGenerateThumbnail }) {
   const [showCopied, setShowCopied] = useState7(false);
   const isFolder = item.type === "folder";
   const isImage = !isFolder && item.thumbnail !== void 0;
-  const isImagesFolder = isFolder && (item.name === "images" || item.path.includes("/images/"));
+  const isProtected = item.isProtected || isFolder && item.name === "images" && item.path === "public/images";
   const handleCopyPath = (e) => {
     e.stopPropagation();
     const pathToCopy = "/" + item.path.replace(/^public\//, "");
@@ -3923,18 +3997,26 @@ function ListRow({ item, isSelected, onClick, onOpen, onGenerateThumbnail }) {
     setShowCopied(true);
     setTimeout(() => setShowCopied(false), 1500);
   };
+  const handleClick = (e) => {
+    if (isProtected) {
+      e.stopPropagation();
+      onOpen();
+      return;
+    }
+    onClick(e);
+  };
   return /* @__PURE__ */ jsxs7(
     "tr",
     {
-      css: [styles7.row, isSelected && styles7.rowSelected],
-      onClick,
+      css: [styles7.row, isSelected && !isProtected && styles7.rowSelected],
+      onClick: handleClick,
       children: [
         /* @__PURE__ */ jsx7(
           "td",
           {
             css: [styles7.td, styles7.checkboxCell],
             onClick: (e) => e.stopPropagation(),
-            children: /* @__PURE__ */ jsx7(
+            children: !isProtected && /* @__PURE__ */ jsx7(
               "input",
               {
                 type: "checkbox",
@@ -3946,13 +4028,13 @@ function ListRow({ item, isSelected, onClick, onOpen, onGenerateThumbnail }) {
           }
         ),
         /* @__PURE__ */ jsx7("td", { css: styles7.td, children: /* @__PURE__ */ jsxs7("div", { css: styles7.nameCell, children: [
-          isFolder ? isImagesFolder ? /* @__PURE__ */ jsxs7("div", { css: styles7.imagesFolderWrapper, children: [
+          isFolder ? isProtected ? /* @__PURE__ */ jsxs7("div", { css: styles7.imagesFolderWrapper, children: [
             /* @__PURE__ */ jsx7("svg", { css: styles7.imagesFolderIcon, fill: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx7("path", { d: "M10 4H4a2 2 0 00-2 2v12a2 2 0 002 2h16a2 2 0 002-2V8a2 2 0 00-2-2h-8l-2-2z" }) }),
             /* @__PURE__ */ jsx7("svg", { css: styles7.lockIcon, fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsx7("path", { fillRule: "evenodd", d: "M5 9V7a5 5 0 0110 0v2a2 2 0 012 2v5a2 2 0 01-2 2H5a2 2 0 01-2-2v-5a2 2 0 012-2zm8-2v2H7V7a3 3 0 016 0z", clipRule: "evenodd" }) })
           ] }) : /* @__PURE__ */ jsx7("div", { css: styles7.folderIconWrapper, children: /* @__PURE__ */ jsx7("svg", { css: styles7.folderIcon, fill: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx7("path", { d: "M10 4H4a2 2 0 00-2 2v12a2 2 0 002 2h16a2 2 0 002-2V8a2 2 0 00-2-2h-8l-2-2z" }) }) }) : isImage && item.thumbnail ? /* @__PURE__ */ jsx7("div", { css: styles7.thumbnailWrapper, children: /* @__PURE__ */ jsx7("img", { css: styles7.thumbnail, src: item.thumbnail, alt: item.name, loading: "lazy" }) }) : /* @__PURE__ */ jsx7("div", { css: styles7.thumbnailWrapper, children: /* @__PURE__ */ jsx7("svg", { css: styles7.fileIcon, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx7("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M7 21h10a2 2 0 002-2V9.414a1 1 0 00-.293-.707l-5.414-5.414A1 1 0 0012.586 3H7a2 2 0 00-2 2v14a2 2 0 002 2z" }) }) }),
           /* @__PURE__ */ jsx7("span", { css: styles7.name, title: item.name, children: truncateMiddle(item.name) }),
           /* @__PURE__ */ jsxs7("div", { css: styles7.actionsCell, children: [
-            item.cdnPushed && !item.isRemote && /* @__PURE__ */ jsx7("span", { css: styles7.statusBtn, title: "Pushed to CDN", children: /* @__PURE__ */ jsx7("svg", { css: styles7.cloudIcon, fill: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx7("path", { d: "M19.35 10.04C18.67 6.59 15.64 4 12 4 9.11 4 6.6 5.64 5.35 8.04 2.34 8.36 0 10.91 0 14c0 3.31 2.69 6 6 6h13c2.76 0 5-2.24 5-5 0-2.64-2.05-4.78-4.65-4.96z" }) }) }),
+            item.cdnPushed && !item.isRemote && /* @__PURE__ */ jsx7("span", { css: styles7.statusBtn, title: "Pushed to CDN", children: /* @__PURE__ */ jsx7("svg", { css: styles7.cloudIcon, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx7("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M3 15a4 4 0 004 4h9a5 5 0 10-.1-9.999 5.002 5.002 0 10-9.78 2.096A4.001 4.001 0 003 15z" }) }) }),
             item.isRemote && /* @__PURE__ */ jsx7("span", { css: styles7.statusBtn, title: "Remote image", children: /* @__PURE__ */ jsx7("svg", { css: styles7.globeIcon, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx7("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M21 12a9 9 0 01-9 9m9-9a9 9 0 00-9-9m9 9H3m9 9a9 9 0 01-9-9m9 9c1.657 0 3-4.03 3-9s-1.343-9-3-9m0 18c-1.657 0-3-4.03-3-9s1.343-9 3-9m-9 9a9 9 0 019-9" }) }) }),
             /* @__PURE__ */ jsxs7(
               "button",
@@ -4613,7 +4695,7 @@ function StudioDetailView() {
     /* @__PURE__ */ jsx8("div", { css: styles8.overlay, onClick: handleClose, children: /* @__PURE__ */ jsxs8("div", { css: styles8.container, onClick: (e) => e.stopPropagation(), children: [
       /* @__PURE__ */ jsxs8("div", { css: styles8.main, children: [
         /* @__PURE__ */ jsxs8("div", { css: styles8.headerButtons, children: [
-          focusedItem.cdnPushed && !focusedItem.isRemote && /* @__PURE__ */ jsx8("span", { css: styles8.statusIcon, title: "Pushed to CDN", children: /* @__PURE__ */ jsx8("svg", { css: styles8.cloudIcon, fill: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx8("path", { d: "M19.35 10.04C18.67 6.59 15.64 4 12 4 9.11 4 6.6 5.64 5.35 8.04 2.34 8.36 0 10.91 0 14c0 3.31 2.69 6 6 6h13c2.76 0 5-2.24 5-5 0-2.64-2.05-4.78-4.65-4.96z" }) }) }),
+          focusedItem.cdnPushed && !focusedItem.isRemote && /* @__PURE__ */ jsx8("span", { css: styles8.statusIcon, title: "Pushed to CDN", children: /* @__PURE__ */ jsx8("svg", { css: styles8.cloudIcon, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx8("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M3 15a4 4 0 004 4h9a5 5 0 10-.1-9.999 5.002 5.002 0 10-9.78 2.096A4.001 4.001 0 003 15z" }) }) }),
           focusedItem.isRemote && /* @__PURE__ */ jsx8("span", { css: styles8.statusIcon, title: "Remote image", children: /* @__PURE__ */ jsx8("svg", { css: styles8.globeIcon, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx8("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M21 12a9 9 0 01-9 9m9-9a9 9 0 00-9-9m9 9H3m9 9a9 9 0 01-9-9m9 9c1.657 0 3-4.03 3-9s-1.343-9-3-9m0 18c-1.657 0-3-4.03-3-9s1.343-9 3-9m-9 9a9 9 0 019-9" }) }) }),
           /* @__PURE__ */ jsxs8("button", { css: styles8.copyBtn, onClick: handleCopyPath, title: "Copy file path", children: [
             showCopied && /* @__PURE__ */ jsx8("span", { css: styles8.tooltip, children: "Copied!" }),
@@ -5680,4 +5762,4 @@ export {
   StudioUI,
   StudioUI_default as default
 };
-//# sourceMappingURL=StudioUI-73XFVFV4.mjs.map
+//# sourceMappingURL=StudioUI-KCUI5YUD.mjs.map