@gallop.software/studio 0.1.78 → 0.1.79

package/dist/{StudioUI-5P7Y3LQK.js → StudioUI-JGKWCQSR.js}

@@ -1719,11 +1719,15 @@ var styles4 = {
     flex: 1;
     min-width: 0;
   `,
-  copyBtn: _react3.css`
+  actionBtns: _react3.css`
     position: absolute;
     top: 4px;
     right: 4px;
     z-index: 10;
+    display: flex;
+    gap: 2px;
+  `,
+  copyBtn: _react3.css`
     height: 28px;
     width: 28px;
     color: ${_chunkUFCWGUAGjs.colors.textMuted};
@@ -1736,6 +1740,7 @@ var styles4 = {
     display: flex;
     align-items: center;
     justify-content: center;
+    position: relative;
     
     &:hover {
       color: ${_chunkUFCWGUAGjs.colors.text};
@@ -1841,6 +1846,7 @@ function StudioFileGrid() {
   const { currentPath, setCurrentPath, navigateUp, selectedItems, toggleSelection, selectRange, lastSelectedPath, selectAll, clearSelection, refreshKey, setFocusedItem, triggerRefresh, searchQuery } = useStudio();
   const [items, setItems] = _react.useState.call(void 0, []);
   const [loading, setLoading] = _react.useState.call(void 0, true);
+  const [renameItem, setRenameItem] = _react.useState.call(void 0, null);
   const isInitialLoad = _react.useRef.call(void 0, true);
   const lastPath = _react.useRef.call(void 0, currentPath);
   _react.useEffect.call(void 0, () => {
@@ -1909,6 +1915,22 @@ function StudioFileGrid() {
       console.error("Failed to generate thumbnail:", error);
     }
   };
+  const handleRename = async (newName) => {
+    if (!renameItem) return;
+    setRenameItem(null);
+    try {
+      const response = await fetch("/api/studio/rename", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ oldPath: renameItem.path, newName })
+      });
+      if (response.ok) {
+        triggerRefresh();
+      }
+    } catch (error) {
+      console.error("Failed to rename:", error);
+    }
+  };
   const allItemsSelected = sortedItems.length > 0 && sortedItems.every((item) => selectedItems.has(item.path));
   const someItemsSelected = sortedItems.some((item) => selectedItems.has(item.path));
   const handleSelectAll = () => {
@@ -1919,6 +1941,18 @@ function StudioFileGrid() {
     }
   };
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { children: [
+    renameItem && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      InputModal,
+      {
+        title: renameItem.type === "folder" ? "Rename Folder" : "Rename File",
+        message: "Enter a new name:",
+        placeholder: renameItem.name,
+        defaultValue: renameItem.name,
+        confirmLabel: "Rename",
+        onConfirm: handleRename,
+        onCancel: () => setRenameItem(null)
+      }
+    ),
     sortedItems.length > 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { css: styles4.selectAllRow, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "label", { css: styles4.selectAllLabel, children: [
       /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
         "input",
@@ -1958,14 +1992,15 @@ function StudioFileGrid() {
           isSelected: selectedItems.has(item.path),
           onClick: (e) => handleItemClick(item, e),
           onOpen: () => handleOpen(item),
-          onGenerateThumbnail: () => handleGenerateThumbnail(item)
+          onGenerateThumbnail: () => handleGenerateThumbnail(item),
+          onRename: () => setRenameItem(item)
         },
         item.path
       ))
     ] })
   ] });
 }
-function GridItem({ item, isSelected, onClick, onOpen, onGenerateThumbnail }) {
+function GridItem({ item, isSelected, onClick, onOpen, onGenerateThumbnail, onRename }) {
   const [showCopied, setShowCopied] = _react.useState.call(void 0, false);
   const isFolder = item.type === "folder";
   const isImage = !isFolder && item.thumbnail !== void 0;
@@ -2001,18 +2036,32 @@ function GridItem({ item, isSelected, onClick, onOpen, onGenerateThumbnail }) {
         ),
         item.cdnSynced && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles4.cdnBadge, children: "CDN" }),
         /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { css: styles4.content, children: [
-          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-            "button",
-            {
-              css: styles4.copyBtn,
-              onClick: handleCopyPath,
-              title: "Copy file path",
-              children: [
-                showCopied && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles4.tooltip, children: "Copied!" }),
-                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { css: styles4.copyIcon, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2" }) })
-              ]
-            }
-          ),
+          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { css: styles4.actionBtns, children: [
+            /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+              "button",
+              {
+                css: styles4.copyBtn,
+                onClick: handleCopyPath,
+                title: "Copy file path",
+                children: [
+                  showCopied && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles4.tooltip, children: "Copied!" }),
+                  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { css: styles4.copyIcon, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2" }) })
+                ]
+              }
+            ),
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              "button",
+              {
+                css: styles4.copyBtn,
+                onClick: (e) => {
+                  e.stopPropagation();
+                  onRename();
+                },
+                title: "Rename",
+                children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { css: styles4.copyIcon, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z" }) })
+              }
+            )
+          ] }),
           /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
             "button",
             {
@@ -2398,6 +2447,7 @@ function StudioFileList() {
   const { currentPath, setCurrentPath, navigateUp, selectedItems, toggleSelection, selectRange, lastSelectedPath, selectAll, clearSelection, refreshKey, setFocusedItem, triggerRefresh, searchQuery } = useStudio();
   const [items, setItems] = _react.useState.call(void 0, []);
   const [loading, setLoading] = _react.useState.call(void 0, true);
+  const [renameItem, setRenameItem] = _react.useState.call(void 0, null);
   const isInitialLoad = _react.useRef.call(void 0, true);
   const lastPath = _react.useRef.call(void 0, currentPath);
   _react.useEffect.call(void 0, () => {
@@ -2462,6 +2512,22 @@ function StudioFileList() {
       console.error("Failed to generate thumbnail:", error);
     }
   };
+  const handleRename = async (newName) => {
+    if (!renameItem) return;
+    setRenameItem(null);
+    try {
+      const response = await fetch("/api/studio/rename", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ oldPath: renameItem.path, newName })
+      });
+      if (response.ok) {
+        triggerRefresh();
+      }
+    } catch (error) {
+      console.error("Failed to rename:", error);
+    }
+  };
   const allItemsSelected = sortedItems.length > 0 && sortedItems.every((item) => selectedItems.has(item.path));
   const someItemsSelected = sortedItems.some((item) => selectedItems.has(item.path));
   const handleSelectAll = () => {
@@ -2471,51 +2537,66 @@ function StudioFileList() {
       selectAll(sortedItems);
     }
   };
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { css: styles5.tableWrapper, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "table", { css: styles5.table, children: [
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "thead", { children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "tr", { children: [
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "th", { css: [styles5.th, styles5.thCheckbox], children: sortedItems.length > 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        "input",
-        {
-          type: "checkbox",
-          css: styles5.checkbox,
-          checked: allItemsSelected,
-          ref: (el) => {
-            if (el) el.indeterminate = someItemsSelected && !allItemsSelected;
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { css: styles5.tableWrapper, children: [
+    renameItem && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      InputModal,
+      {
+        title: renameItem.type === "folder" ? "Rename Folder" : "Rename File",
+        message: "Enter a new name:",
+        placeholder: renameItem.name,
+        defaultValue: renameItem.name,
+        confirmLabel: "Rename",
+        onConfirm: handleRename,
+        onCancel: () => setRenameItem(null)
+      }
+    ),
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "table", { css: styles5.table, children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "thead", { children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "tr", { children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "th", { css: [styles5.th, styles5.thCheckbox], children: sortedItems.length > 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          "input",
+          {
+            type: "checkbox",
+            css: styles5.checkbox,
+            checked: allItemsSelected,
+            ref: (el) => {
+              if (el) el.indeterminate = someItemsSelected && !allItemsSelected;
+            },
+            onChange: handleSelectAll
+          }
+        ) }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "th", { css: styles5.th, children: "Name" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "th", { css: [styles5.th, styles5.thSize], children: "Size" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "th", { css: [styles5.th, styles5.thDimensions], children: "Dimensions" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "th", { css: [styles5.th, styles5.thCdn], children: "CDN" })
+      ] }) }),
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "tbody", { css: styles5.tbody, children: [
+        !isAtRoot && !isSearching && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "tr", { css: styles5.parentRow, onClick: navigateUp, children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "td", { css: styles5.td }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "td", { css: styles5.td, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { css: styles5.nameCell, children: [
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { css: styles5.parentIcon, 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: "M3 10h10a8 8 0 018 8v2M3 10l6 6m-6-6l6-6" }) }),
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles5.name, children: ".." })
+          ] }) }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "td", { css: [styles5.td, styles5.meta], children: "--" }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "td", { css: [styles5.td, styles5.meta], children: "Parent folder" }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "td", { css: styles5.td, children: "--" })
+        ] }),
+        sortedItems.map((item) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          ListRow,
+          {
+            item,
+            isSelected: selectedItems.has(item.path),
+            onClick: (e) => handleItemClick(item, e),
+            onOpen: () => handleOpen(item),
+            onGenerateThumbnail: () => handleGenerateThumbnail(item),
+            onRename: () => setRenameItem(item)
           },
-          onChange: handleSelectAll
-        }
-      ) }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "th", { css: styles5.th, children: "Name" }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "th", { css: [styles5.th, styles5.thSize], children: "Size" }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "th", { css: [styles5.th, styles5.thDimensions], children: "Dimensions" }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "th", { css: [styles5.th, styles5.thCdn], children: "CDN" })
-    ] }) }),
-    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "tbody", { css: styles5.tbody, children: [
-      !isAtRoot && !isSearching && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "tr", { css: styles5.parentRow, onClick: navigateUp, children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "td", { css: styles5.td }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "td", { css: styles5.td, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { css: styles5.nameCell, children: [
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { css: styles5.parentIcon, 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: "M3 10h10a8 8 0 018 8v2M3 10l6 6m-6-6l6-6" }) }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles5.name, children: ".." })
-        ] }) }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "td", { css: [styles5.td, styles5.meta], children: "--" }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "td", { css: [styles5.td, styles5.meta], children: "Parent folder" }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "td", { css: styles5.td, children: "--" })
-      ] }),
-      sortedItems.map((item) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        ListRow,
-        {
-          item,
-          isSelected: selectedItems.has(item.path),
-          onClick: (e) => handleItemClick(item, e),
-          onOpen: () => handleOpen(item),
-          onGenerateThumbnail: () => handleGenerateThumbnail(item)
-        },
-        item.path
-      ))
+          item.path
+        ))
+      ] })
     ] })
-  ] }) });
+  ] });
 }
-function ListRow({ item, isSelected, onClick, onOpen, onGenerateThumbnail }) {
+function ListRow({ item, isSelected, onClick, onOpen, onGenerateThumbnail, onRename }) {
   const [showCopied, setShowCopied] = _react.useState.call(void 0, false);
   const isFolder = item.type === "folder";
   const isImage = !isFolder && item.thumbnail !== void 0;
@@ -2579,6 +2660,18 @@ function ListRow({ item, isSelected, onClick, onOpen, onGenerateThumbnail }) {
                 ]
               }
             ),
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              "button",
+              {
+                css: styles5.copyBtn,
+                onClick: (e) => {
+                  e.stopPropagation();
+                  onRename();
+                },
+                title: "Rename",
+                children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { css: styles5.copyIcon, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z" }) })
+              }
+            ),
             /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
               "button",
               {
@@ -3837,4 +3930,4 @@ var StudioUI_default = StudioUI;
 
 
 exports.StudioUI = StudioUI; exports.default = StudioUI_default;
-//# sourceMappingURL=StudioUI-5P7Y3LQK.js.map
+//# sourceMappingURL=StudioUI-JGKWCQSR.js.map