@gallop.software/studio 0.1.88 → 0.1.90

package/dist/{StudioUI-Y35A2T7S.js → StudioUI-HWUO2H6J.js}

@@ -50,6 +50,11 @@ var defaultState = {
   refreshKey: 0,
   triggerRefresh: () => {
   },
+  scanRequested: false,
+  triggerScan: () => {
+  },
+  clearScanRequest: () => {
+  },
   searchQuery: "",
   setSearchQuery: () => {
   },
@@ -1285,11 +1290,11 @@ var styles4 = {
   `
 };
 function StudioToolbar() {
-  const { selectedItems, viewMode, setViewMode, clearSelection, currentPath, triggerRefresh, focusedItem } = useStudio();
+  const { selectedItems, viewMode, setViewMode, clearSelection, currentPath, triggerRefresh, focusedItem, scanRequested, clearScanRequest } = useStudio();
   const fileInputRef = _react.useRef.call(void 0, null);
   const abortControllerRef = _react.useRef.call(void 0, null);
   const [uploading, setUploading] = _react.useState.call(void 0, false);
-  const [refreshing, setRefreshing] = _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);
@@ -1315,11 +1320,88 @@ function StudioToolbar() {
   const handleUpload = _react.useCallback.call(void 0, () => {
     _optionalChain([fileInputRef, 'access', _2 => _2.current, 'optionalAccess', _3 => _3.click, 'call', _4 => _4()]);
   }, []);
-  const handleRefresh = _react.useCallback.call(void 0, () => {
-    setRefreshing(true);
-    triggerRefresh();
-    setTimeout(() => setRefreshing(false), 600);
+  const handleScan = _react.useCallback.call(void 0, async () => {
+    setScanning(true);
+    setShowProgress(true);
+    setProgressState({
+      current: 0,
+      total: 0,
+      percent: 0,
+      status: "processing",
+      message: "Scanning for files..."
+    });
+    try {
+      const response = await fetch("/api/studio/scan", { method: "POST" });
+      const reader = _optionalChain([response, 'access', _5 => _5.body, 'optionalAccess', _6 => _6.getReader, 'call', _7 => _7()]);
+      if (!reader) throw new Error("No reader");
+      const decoder = new TextDecoder();
+      let buffer = "";
+      while (true) {
+        const { done, value } = await reader.read();
+        if (done) break;
+        buffer += decoder.decode(value, { stream: true });
+        const lines = buffer.split("\n\n");
+        buffer = lines.pop() || "";
+        for (const line of lines) {
+          if (!line.startsWith("data: ")) continue;
+          const data = JSON.parse(line.slice(6));
+          if (data.type === "start") {
+            setProgressState({
+              current: 0,
+              total: data.total,
+              percent: 0,
+              status: "processing",
+              message: `Scanning ${data.total} files...`
+            });
+          } else if (data.type === "progress") {
+            setProgressState({
+              current: data.current,
+              total: data.total,
+              percent: data.percent,
+              status: "processing",
+              currentFile: data.currentFile
+            });
+          } else if (data.type === "complete") {
+            setProgressState({
+              current: data.total || 0,
+              total: data.total || 0,
+              percent: 100,
+              status: "complete",
+              processed: data.added,
+              errors: data.errors,
+              message: data.renamed > 0 ? `${data.renamed} file(s) renamed due to conflicts` : void 0
+            });
+            triggerRefresh();
+          } else if (data.type === "error") {
+            setProgressState({
+              current: 0,
+              total: 0,
+              percent: 0,
+              status: "error",
+              message: data.message || "Scan failed"
+            });
+          }
+        }
+      }
+    } catch (error) {
+      console.error("Scan error:", error);
+      setProgressState({
+        current: 0,
+        total: 0,
+        percent: 0,
+        status: "error",
+        message: "Scan failed"
+      });
+    } finally {
+      setScanning(false);
+    }
   }, [triggerRefresh]);
+  _react.useEffect.call(void 0, () => {
+    if (scanRequested && !scanning) {
+      clearScanRequest();
+      handleScan();
+    }
+  }, [scanRequested, scanning, clearScanRequest, handleScan]);
   const handleFileChange = _react.useCallback.call(void 0, async (e) => {
     const files = e.target.files;
     if (!files || files.length === 0) return;
@@ -1422,7 +1504,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', _5 => _5.split, 'call', _6 => _6("."), 'access', _7 => _7.pop, 'call', _8 => _8(), 'optionalAccess', _9 => _9.toLowerCase, 'call', _10 => _10()]) || "";
+        const ext = _optionalChain([p, 'access', _8 => _8.split, 'call', _9 => _9("."), 'access', _10 => _10.pop, 'call', _11 => _11(), 'optionalAccess', _12 => _12.toLowerCase, 'call', _13 => _13()]) || "";
         return imageExtensions.includes(ext);
       });
       const selectedFolders = selectedPaths2.filter((p) => !p.includes(".") || p.endsWith("/"));
@@ -1583,12 +1665,12 @@ function StudioToolbar() {
         const data = await response.json();
         if (response.ok) {
           setProgressState({
-            current: _optionalChain([data, 'access', _11 => _11.processed, 'optionalAccess', _12 => _12.length]) || 0,
-            total: _optionalChain([data, 'access', _13 => _13.processed, 'optionalAccess', _14 => _14.length]) || 0,
+            current: _optionalChain([data, 'access', _14 => _14.processed, 'optionalAccess', _15 => _15.length]) || 0,
+            total: _optionalChain([data, 'access', _16 => _16.processed, 'optionalAccess', _17 => _17.length]) || 0,
             percent: 100,
             status: "complete",
-            processed: _optionalChain([data, 'access', _15 => _15.processed, 'optionalAccess', _16 => _16.length]) || 0,
-            errors: _optionalChain([data, 'access', _17 => _17.errors, 'optionalAccess', _18 => _18.length]) || 0
+            processed: _optionalChain([data, 'access', _18 => _18.processed, 'optionalAccess', _19 => _19.length]) || 0,
+            errors: _optionalChain([data, 'access', _20 => _20.errors, 'optionalAccess', _21 => _21.length]) || 0
           });
           clearSelection();
           triggerRefresh();
@@ -1665,7 +1747,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', _19 => _19.split, 'call', _20 => _20("."), 'access', _21 => _21.pop, 'call', _22 => _22(), 'optionalAccess', _23 => _23.toLowerCase, 'call', _24 => _24()]) || "";
+      const ext = _optionalChain([p, 'access', _22 => _22.split, 'call', _23 => _23("."), 'access', _24 => _24.pop, 'call', _25 => _25(), 'optionalAccess', _26 => _26.toLowerCase, 'call', _27 => _27()]) || "";
       return imageExtensions.includes(ext);
     });
     const selectedFolders = selectedPaths2.filter((p) => !p.includes(".") || p.endsWith("/"));
@@ -1700,7 +1782,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', _25 => _25.split, 'call', _26 => _26("."), 'access', _27 => _27.pop, 'call', _28 => _28(), 'optionalAccess', _29 => _29.toLowerCase, 'call', _30 => _30()]) || "";
+      const ext = _optionalChain([p, 'access', _28 => _28.split, 'call', _29 => _29("."), 'access', _30 => _30.pop, 'call', _31 => _31(), 'optionalAccess', _32 => _32.toLowerCase, 'call', _33 => _33()]) || "";
       return imageExtensions.includes(ext);
     });
     const selectedFolders = selectedPaths2.filter((p) => !p.includes(".") || p.endsWith("/"));
@@ -1750,16 +1832,16 @@ function StudioToolbar() {
           });
           const data = await response.json();
           if (!response.ok) {
-            if (_optionalChain([data, 'access', _31 => _31.error, 'optionalAccess', _32 => _32.includes, 'call', _33 => _33("R2 not configured")]) || _optionalChain([data, 'access', _34 => _34.error, 'optionalAccess', _35 => _35.includes, 'call', _36 => _36("CLOUDFLARE_R2")])) {
+            if (_optionalChain([data, 'access', _34 => _34.error, 'optionalAccess', _35 => _35.includes, 'call', _36 => _36("R2 not configured")]) || _optionalChain([data, 'access', _37 => _37.error, 'optionalAccess', _38 => _38.includes, 'call', _39 => _39("CLOUDFLARE_R2")])) {
               setShowProgress(false);
               setShowR2SetupModal(true);
               return;
             }
             errors++;
             errorMessages.push(data.error || `Failed: ${imageKey}`);
-          } else if (_optionalChain([data, 'access', _37 => _37.synced, 'optionalAccess', _38 => _38.length]) > 0) {
+          } else if (_optionalChain([data, 'access', _40 => _40.synced, 'optionalAccess', _41 => _41.length]) > 0) {
             synced++;
-          } else if (_optionalChain([data, 'access', _39 => _39.errors, 'optionalAccess', _40 => _40.length]) > 0) {
+          } else if (_optionalChain([data, 'access', _42 => _42.errors, 'optionalAccess', _43 => _43.length]) > 0) {
             errors++;
             for (const errMsg of data.errors) {
               errorMessages.push(errMsg);
@@ -1903,8 +1985,8 @@ function StudioToolbar() {
     showSyncConfirm && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
       ConfirmModal,
       {
-        title: "Sync to CDN",
-        message: `Sync ${syncImageCount} image${syncImageCount !== 1 ? "s" : ""} to Cloudflare R2? Images must be processed first. After syncing, local thumbnails will be deleted.`,
+        title: "Push to CDN",
+        message: `Push ${syncImageCount} image${syncImageCount !== 1 ? "s" : ""} to Cloudflare R2? Images must be processed first. After pushing, local files will be deleted.`,
         confirmLabel: "Sync",
         onConfirm: handleSyncConfirm,
         onCancel: () => setShowSyncConfirm(false)
@@ -2071,7 +2153,7 @@ function StudioToolbar() {
             disabled: !hasSelection,
             children: [
               /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CloudIcon, {}),
-              "Sync CDN"
+              "Push CDN"
             ]
           }
         ),
@@ -2104,12 +2186,16 @@ function StudioToolbar() {
           " selected",
           /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "button", { css: styles4.clearBtn, onClick: clearSelection, children: "Clear" })
         ] }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
           "button",
           {
-            css: [styles4.btn, styles4.btnIconOnly],
-            onClick: handleRefresh,
-            children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, RefreshIcon, { spinning: refreshing })
+            css: styles4.btn,
+            onClick: handleScan,
+            disabled: scanning,
+            children: [
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ScanIcon, { spinning: scanning }),
+              "Scan"
+            ]
           }
         ),
         /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { css: styles4.viewToggle, children: [
@@ -2139,7 +2225,7 @@ function StudioToolbar() {
 function UploadIcon() {
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { css: styles4.icon, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-8l-4-4m0 0L8 8m4-4v12" }) });
 }
-function RefreshIcon({ spinning }) {
+function ScanIcon({ spinning }) {
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { css: [styles4.icon, spinning && styles4.iconSpin], fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15" }) });
 }
 function TrashIcon() {
@@ -2268,11 +2354,13 @@ function useFileList() {
     refreshKey,
     setFocusedItem,
     triggerRefresh,
+    triggerScan,
     searchQuery,
     showError
   } = useStudio();
   const [items, setItems] = _react.useState.call(void 0, []);
   const [loading, setLoading] = _react.useState.call(void 0, true);
+  const [metaEmpty, setMetaEmpty] = _react.useState.call(void 0, false);
   const isInitialLoad = _react.useRef.call(void 0, true);
   const lastPath = _react.useRef.call(void 0, currentPath);
   _react.useEffect.call(void 0, () => {
@@ -2285,10 +2373,12 @@ function useFileList() {
       try {
         const data = searchQuery && searchQuery.length >= 2 ? await studioApi.search(searchQuery) : await studioApi.list(currentPath);
         setItems(data.items || []);
+        setMetaEmpty(data.isEmpty === true);
       } catch (error) {
         const message = error instanceof Error ? error.message : "Failed to load items";
         showError("Load Error", message);
         setItems([]);
+        setMetaEmpty(false);
       }
       setLoading(false);
       isInitialLoad.current = false;
@@ -2340,6 +2430,7 @@ function useFileList() {
     items,
     loading,
     sortedItems,
+    metaEmpty,
     // Computed
     isAtRoot,
     isSearching,
@@ -2353,7 +2444,8 @@ function useFileList() {
     handleItemClick,
     handleOpen,
     handleGenerateThumbnail,
-    handleSelectAll
+    handleSelectAll,
+    triggerScan
   };
 }
 
@@ -2367,7 +2459,8 @@ var styles5 = {
     display: flex;
     align-items: center;
     justify-content: center;
-    height: 256px;
+    flex: 1;
+    min-height: 300px;
   `,
   spinner: _react3.css`
     width: 32px;
@@ -2382,7 +2475,8 @@ var styles5 = {
     flex-direction: column;
     align-items: center;
     justify-content: center;
-    height: 256px;
+    flex: 1;
+    min-height: 300px;
     color: ${_chunkUFCWGUAGjs.colors.textSecondary};
   `,
   emptyIcon: _react3.css`
@@ -2400,6 +2494,27 @@ var styles5 = {
       font-size: ${_chunkUFCWGUAGjs.fontSize.sm};
     }
   `,
+  scanButton: _react3.css`
+    margin-top: 16px;
+    padding: 10px 24px;
+    font-size: ${_chunkUFCWGUAGjs.fontSize.base};
+    font-weight: 500;
+    background: ${_chunkUFCWGUAGjs.colors.primary};
+    color: white;
+    border: none;
+    border-radius: 8px;
+    cursor: pointer;
+    transition: background 0.15s ease;
+    
+    &:hover:not(:disabled) {
+      background: ${_chunkUFCWGUAGjs.colors.primaryHover};
+    }
+    
+    &:disabled {
+      opacity: 0.6;
+      cursor: not-allowed;
+    }
+  `,
   grid: _react3.css`
     display: grid;
     grid-template-columns: 1fr;
@@ -2683,6 +2798,7 @@ function StudioFileGrid() {
   const {
     loading,
     sortedItems,
+    metaEmpty,
     isAtRoot,
     isSearching,
     allItemsSelected,
@@ -2692,16 +2808,32 @@ function StudioFileGrid() {
     handleItemClick,
     handleOpen,
     handleGenerateThumbnail,
-    handleSelectAll
+    handleSelectAll,
+    triggerScan
   } = useFileList();
   if (loading) {
     return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { css: styles5.loading, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { css: styles5.spinner }) });
   }
+  if (metaEmpty && isAtRoot) {
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { css: styles5.empty, children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { css: styles5.emptyIcon, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" }) }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { css: styles5.emptyText, children: "No files tracked yet" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { css: styles5.emptyText, children: "Click Scan to discover files in your public folder" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        "button",
+        {
+          css: styles5.scanButton,
+          onClick: triggerScan,
+          children: "Scan for Files"
+        }
+      )
+    ] });
+  }
   if (sortedItems.length === 0 && isAtRoot) {
     return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { css: styles5.empty, children: [
       /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { css: styles5.emptyIcon, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z" }) }),
       /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { css: styles5.emptyText, children: "No files in this folder" }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { css: styles5.emptyText, children: "Upload images to get started" })
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { css: styles5.emptyText, children: "Upload images or click Scan in the toolbar" })
     ] });
   }
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { children: [
@@ -2880,7 +3012,8 @@ var styles6 = {
     display: flex;
     align-items: center;
     justify-content: center;
-    height: 256px;
+    flex: 1;
+    min-height: 300px;
   `,
   spinner: _react3.css`
     width: 32px;
@@ -2895,9 +3028,36 @@ var styles6 = {
     flex-direction: column;
     align-items: center;
     justify-content: center;
-    height: 256px;
+    flex: 1;
+    min-height: 300px;
     color: ${_chunkUFCWGUAGjs.colors.textSecondary};
   `,
+  emptyHint: _react3.css`
+    font-size: ${_chunkUFCWGUAGjs.fontSize.sm};
+    color: ${_chunkUFCWGUAGjs.colors.textMuted};
+    margin-top: 4px;
+  `,
+  scanButton: _react3.css`
+    margin-top: 16px;
+    padding: 10px 24px;
+    font-size: ${_chunkUFCWGUAGjs.fontSize.base};
+    font-weight: 500;
+    background: ${_chunkUFCWGUAGjs.colors.primary};
+    color: white;
+    border: none;
+    border-radius: 8px;
+    cursor: pointer;
+    transition: background 0.15s ease;
+    
+    &:hover:not(:disabled) {
+      background: ${_chunkUFCWGUAGjs.colors.primaryHover};
+    }
+    
+    &:disabled {
+      opacity: 0.6;
+      cursor: not-allowed;
+    }
+  `,
   tableWrapper: _react3.css`
     background: ${_chunkUFCWGUAGjs.colors.surface};
     border-radius: 8px;
@@ -3184,6 +3344,7 @@ function StudioFileList() {
   const {
     loading,
     sortedItems,
+    metaEmpty,
     isAtRoot,
     isSearching,
     allItemsSelected,
@@ -3193,13 +3354,31 @@ function StudioFileList() {
     handleItemClick,
     handleOpen,
     handleGenerateThumbnail,
-    handleSelectAll
+    handleSelectAll,
+    triggerScan
   } = useFileList();
   if (loading) {
     return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { css: styles6.loading, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { css: styles6.spinner }) });
   }
+  if (metaEmpty && isAtRoot) {
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { css: styles6.empty, children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { children: "No files tracked yet" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { css: styles6.emptyHint, children: "Click Scan to discover files in your public folder" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        "button",
+        {
+          css: styles6.scanButton,
+          onClick: triggerScan,
+          children: "Scan for Files"
+        }
+      )
+    ] });
+  }
   if (sortedItems.length === 0 && isAtRoot) {
-    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { css: styles6.empty, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { children: "No files in this folder" }) });
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { css: styles6.empty, children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { children: "No files in this folder" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { css: styles6.emptyHint, children: "Upload images or click Scan in the toolbar" })
+    ] });
   }
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { css: styles6.tableWrapper, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "table", { css: styles6.table, children: [
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "thead", { children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "tr", { children: [
@@ -3709,7 +3888,7 @@ function StudioDetailView() {
         });
         triggerRefresh();
       } else {
-        if (_optionalChain([data, 'access', _41 => _41.error, 'optionalAccess', _42 => _42.includes, 'call', _43 => _43("R2 not configured")]) || _optionalChain([data, 'access', _44 => _44.error, 'optionalAccess', _45 => _45.includes, 'call', _46 => _46("CLOUDFLARE_R2")])) {
+        if (_optionalChain([data, 'access', _44 => _44.error, 'optionalAccess', _45 => _45.includes, 'call', _46 => _46("R2 not configured")]) || _optionalChain([data, 'access', _47 => _47.error, 'optionalAccess', _48 => _48.includes, 'call', _49 => _49("CLOUDFLARE_R2")])) {
           setShowR2SetupModal(true);
         } else {
           setAlertMessage({
@@ -3748,7 +3927,7 @@ function StudioDetailView() {
       if (!response.ok) {
         throw new Error("Processing failed");
       }
-      const reader = _optionalChain([response, 'access', _47 => _47.body, 'optionalAccess', _48 => _48.getReader, 'call', _49 => _49()]);
+      const reader = _optionalChain([response, 'access', _50 => _50.body, 'optionalAccess', _51 => _51.getReader, 'call', _52 => _52()]);
       if (!reader) {
         throw new Error("No response body");
       }
@@ -3898,7 +4077,7 @@ function StudioDetailView() {
             ] }),
             /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "button", { css: styles7.actionBtn, onClick: handleSync, disabled: syncing, children: [
               /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { css: styles7.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: "M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12" }) }),
-              syncing ? "Syncing..." : "Sync to CDN"
+              syncing ? "Pushing..." : "Push to CDN"
             ] }),
             /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "button", { css: styles7.actionBtn, onClick: () => setShowProcessConfirm(true), children: [
               /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { css: styles7.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: "M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z" }) }),
@@ -4428,6 +4607,8 @@ var styles10 = {
     min-width: 0;
     overflow: auto;
     padding: 20px 24px;
+    display: flex;
+    flex-direction: column;
   `,
   dropOverlay: _react3.css`
     position: absolute;
@@ -4467,12 +4648,19 @@ function StudioUI({ onClose, isVisible = true }) {
   const [meta, setMeta] = _react.useState.call(void 0, null);
   const [isLoading, setIsLoading] = _react.useState.call(void 0, false);
   const [refreshKey, setRefreshKey] = _react.useState.call(void 0, 0);
+  const [scanRequested, setScanRequested] = _react.useState.call(void 0, false);
   const [searchQuery, setSearchQuery] = _react.useState.call(void 0, "");
   const [error, setError] = _react.useState.call(void 0, null);
   const [isDragging, setIsDragging] = _react.useState.call(void 0, false);
   const triggerRefresh = _react.useCallback.call(void 0, () => {
     setRefreshKey((k) => k + 1);
   }, []);
+  const triggerScan = _react.useCallback.call(void 0, () => {
+    setScanRequested(true);
+  }, []);
+  const clearScanRequest = _react.useCallback.call(void 0, () => {
+    setScanRequested(false);
+  }, []);
   const showError = _react.useCallback.call(void 0, (title, message) => {
     setError({ title, message });
   }, []);
@@ -4609,6 +4797,9 @@ function StudioUI({ onClose, isVisible = true }) {
     setIsLoading,
     refreshKey,
     triggerRefresh,
+    scanRequested,
+    triggerScan,
+    clearScanRequest,
     searchQuery,
     setSearchQuery,
     error,
@@ -4695,4 +4886,4 @@ var StudioUI_default = StudioUI;
 
 
 exports.StudioUI = StudioUI; exports.default = StudioUI_default;
-//# sourceMappingURL=StudioUI-Y35A2T7S.js.map
+//# sourceMappingURL=StudioUI-HWUO2H6J.js.map