@mevdragon/vidfarm-devcli 0.18.1 → 0.19.1

package/dist/src/frontend/file-directory.js

@@ -16,7 +16,7 @@
 // callbacks, or, for the auto-mounted dock instance, read from a
 // `window.__rkDirectoryHost` hook the dock's inline script sets synchronously
 // before this deferred module runs.
-import { buildDirectoryPath, DIRECTORY_ROOTS, normalizeFolderPath, parseDirectoryPath } from "../services/file-directory.js";
+import { buildDirectoryPath, DIRECTORY_ROOT_KEYS, DIRECTORY_ROOTS, normalizeFolderPath, parseDirectoryPath } from "../services/file-directory.js";
 const DEFAULT_API_BASE = "/api/v1/user/me";
 // ── small DOM helpers ────────────────────────────────────────────────────────
 function el(tag, cls, text) {
@@ -159,13 +159,16 @@ function openMenuAt(anchor, actions) {
 // ── the explorer ─────────────────────────────────────────────────────────────
 export function createDirectoryExplorer(mount, opts = {}) {
     const apiBase = opts.apiBase || DEFAULT_API_BASE;
-    const roots = (opts.roots && opts.roots.length ? opts.roots : ["files", "temp", "raws"]);
+    const roots = (opts.roots && opts.roots.length ? opts.roots : DIRECTORY_ROOT_KEYS.slice());
     const singleRoot = roots.length === 1 ? roots[0] : null;
     const mode = opts.mode || "attach";
     const showSearch = opts.showSearch !== false;
     const showMultiSelect = opts.showMultiSelect !== false;
     const showUpload = opts.showUpload != null ? opts.showUpload : mode === "attach";
     const primaryClick = opts.primaryClick || "copyPath";
+    const cloudAvailable = opts.cloudAvailable != null
+        ? opts.cloudAvailable
+        : typeof window !== "undefined" && window.__vidfarmCloudSpace === true;
     const host = window.__rkDirectoryHost || {};
     const emitAttach = (items) => (opts.onAttach || host.onAttach || (() => showToast("Attached " + items.length + " item(s)")))(items);
     const emitPreview = (items, i) => {
@@ -189,6 +192,11 @@ export function createDirectoryExplorer(mount, opts = {}) {
     let searchResults = [];
     let searchStatus = "idle";
     let destroyed = false;
+    // Which backend the explorer reads: "local" (this box's disk backend) or
+    // "cloud" (vidfarm.cc via the serve-box passthrough). Only meaningful when
+    // cloudAvailable; the /cloud fetches hit /me/cloud/directory*.
+    let space = "local";
+    function spacePrefix() { return space === "cloud" ? "/cloud" : ""; }
     function normalizeInitial(p, single) {
         const parsed = parseDirectoryPath(p || "");
         if (parsed.root)
@@ -216,6 +224,33 @@ export function createDirectoryExplorer(mount, opts = {}) {
     dropInput.hidden = true;
     dropEl.appendChild(dropText);
     dropEl.appendChild(dropInput);
+    // Local ⇄ Cloud space switch (serve boxes with an upstream only).
+    const spaceBar = el("div", "rk-dir-space");
+    const localBtn = el("button", "rk-dir-space-btn is-on", "Local");
+    const cloudBtn = el("button", "rk-dir-space-btn", "Cloud");
+    localBtn.type = "button";
+    cloudBtn.type = "button";
+    spaceBar.appendChild(localBtn);
+    spaceBar.appendChild(cloudBtn);
+    function setSpace(next) {
+        if (space === next)
+            return;
+        space = next;
+        localBtn.classList.toggle("is-on", next === "local");
+        cloudBtn.classList.toggle("is-on", next === "cloud");
+        // Reset to the space's root view and clear any active search.
+        searchMode = false;
+        searchResults = [];
+        searchInput.value = "";
+        selection.clear();
+        currentPath = singleRoot ? "/" + singleRoot : "/";
+        status = "idle";
+        load(true);
+    }
+    localBtn.addEventListener("click", () => setSpace("local"));
+    cloudBtn.addEventListener("click", () => setSpace("cloud"));
+    if (cloudAvailable)
+        mount.appendChild(spaceBar);
     if (showSearch)
         mount.appendChild(searchWrap);
     mount.appendChild(crumbsEl);
@@ -226,7 +261,7 @@ export function createDirectoryExplorer(mount, opts = {}) {
         mount.appendChild(dropEl);
     // ── fetch ──
     function dirUrl(path, offset) {
-        const u = new URL(apiBase + "/directory", window.location.href);
+        const u = new URL(apiBase + spacePrefix() + "/directory", window.location.href);
         u.searchParams.set("path", path);
         if (offset)
             u.searchParams.set("offset", String(offset));
@@ -313,7 +348,7 @@ export function createDirectoryExplorer(mount, opts = {}) {
         searchStatus = "loading";
         render();
         const scope = singleRoot ? "/" + singleRoot : (currentPath !== "/" ? currentPath : "");
-        fetch(apiBase + "/directory/search", {
+        fetch(apiBase + spacePrefix() + "/directory/search", {
             method: "POST",
             credentials: "same-origin",
             headers: { "content-type": "application/json", accept: "application/json" },
@@ -339,10 +374,14 @@ export function createDirectoryExplorer(mount, opts = {}) {
         status = "idle";
         searchMode = false;
         searchInput.value = "";
+        (opts.onNavigate || (() => { }))(currentPath);
         load(true);
     }
     function currentRoot() { return parseDirectoryPath(currentPath).root; }
     function currentFolder() { return parseDirectoryPath(currentPath).folderPath; }
+    // /projects mirrors the user's composition forks — its folders and files are
+    // backed by fork storage, not user-managed, so no create/rename/upload there.
+    function canWriteRoot(r) { return !!r && r !== "projects"; }
     // Create an empty folder under `parentFolder` (defaults to the current folder).
     // Only valid inside a root — at the virtual root there's nowhere to put it.
     function createFolder(parentFolder) {
@@ -351,6 +390,10 @@ export function createDirectoryExplorer(mount, opts = {}) {
             toast("Open a root (/files, /temp, /raws) first");
             return;
         }
+        if (!canWriteRoot(root)) {
+            toast("/projects is read-only");
+            return;
+        }
         const name = (window.prompt("New folder name") || "").trim();
         if (!name)
             return;
@@ -366,6 +409,33 @@ export function createDirectoryExplorer(mount, opts = {}) {
             .then((res) => { navigate(res.path || (root === currentRoot() ? currentPath : "/" + root)); toast("Created " + (res.path || name)); })
             .catch((e) => toast(e.message || "Couldn't create folder"));
     }
+    // Rename a file or folder in place via POST /me/directory/rename. Files carry
+    // their backend id (display-name-only rename); folders rename their trailing
+    // path segment (files + nested subfolders move with them server-side).
+    function renameItem(it) {
+        const isFolder = it.kind === "folder";
+        const next = (window.prompt(isFolder ? "Rename folder" : "Rename file", it.name) || "").trim();
+        if (!next || next === it.name)
+            return;
+        fetch(apiBase + "/directory/rename", {
+            method: "POST",
+            credentials: "same-origin",
+            headers: { "content-type": "application/json", accept: "application/json" },
+            body: JSON.stringify({ path: it.path, new_name: next, ...(isFolder ? {} : { file_id: it.id }) })
+        })
+            .then((r) => (r.ok ? r.json() : r.json().then((j) => Promise.reject(new Error(j.error || "http " + r.status)))))
+            .then(() => {
+            // Renaming shifts the item's path, so drop any stale selection and
+            // reload the current folder (the renamed child re-renders in place).
+            if (selection.has(it.path)) {
+                selection.delete(it.path);
+                (opts.onSelectionChange || (() => { }))(Array.from(selection.values()));
+            }
+            load(true);
+            toast("Renamed to " + next);
+        })
+            .catch((e) => toast(e.message || "Couldn't rename"));
+    }
     // ── selection ──
     function toggleSelect(it, on) {
         if (on)
@@ -412,11 +482,14 @@ export function createDirectoryExplorer(mount, opts = {}) {
             crumbsEl.appendChild(crumb(part, idx === arr.length - 1, () => navigate(target)));
         });
         // Discoverable "New folder" affordance (right-click also works anywhere).
-        const nf = el("button", "rk-dir-newfolder", "+ Folder");
-        nf.type = "button";
-        nf.title = "New folder here (or right-click)";
-        nf.addEventListener("click", () => createFolder());
-        crumbsEl.appendChild(nf);
+        // Read-only roots (/projects) don't get it.
+        if (canWriteRoot(root)) {
+            const nf = el("button", "rk-dir-newfolder", "+ Folder");
+            nf.type = "button";
+            nf.title = "New folder here (or right-click)";
+            nf.addEventListener("click", () => createFolder());
+            crumbsEl.appendChild(nf);
+        }
     }
     function sep() { return el("span", "rk-aichat-crumb-sep", "/"); }
     function renderSelbar() {
@@ -475,12 +548,14 @@ export function createDirectoryExplorer(mount, opts = {}) {
         open.title = "Open folder";
         open.addEventListener("click", (e) => { e.stopPropagation(); navigate(it.path); });
         row.appendChild(open);
-        // Kebab.
-        row.appendChild(kebab(it, [
-            { label: "Open folder", run: () => navigate(it.path) },
-            { label: "New subfolder", run: () => createFolder(it.folderPath) },
-            { label: "Copy path", run: () => copyPath(it.path) }
-        ]));
+        // Kebab. Create/rename only for writable roots (not /projects forks).
+        const folderActions = [{ label: "Open folder", run: () => navigate(it.path) }];
+        if (canWriteRoot(it.root)) {
+            folderActions.push({ label: "New subfolder", run: () => createFolder(it.folderPath) });
+            folderActions.push({ label: "Rename", run: () => renameItem(it) });
+        }
+        folderActions.push({ label: "Copy path", run: () => copyPath(it.path) });
+        row.appendChild(kebab(it, folderActions));
         return row;
     }
     function fileRowEl(it, siblings, index, showPath) {
@@ -507,6 +582,17 @@ export function createDirectoryExplorer(mount, opts = {}) {
                 copyPath(it.path);
         });
         row.appendChild(b);
+        // When the row's primary click previews (chat dock), keep attaching one click
+        // away with a dedicated inline "+" button so files stay easy to add to the
+        // composer without going through the kebab.
+        if (mode === "attach" && primaryClick === "preview") {
+            const add = el("button", "rk-aichat-fadd rk-dir-attach", "+");
+            add.type = "button";
+            add.title = "Attach " + it.name;
+            add.setAttribute("aria-label", "Attach " + it.name);
+            add.addEventListener("click", (e) => { e.stopPropagation(); emitAttach([it]); });
+            row.appendChild(add);
+        }
         // Kebab: Attach / View / Preview / Copy path.
         const actions = [];
         if (mode === "attach")
@@ -515,6 +601,10 @@ export function createDirectoryExplorer(mount, opts = {}) {
             actions.push({ label: "View", run: () => window.open(it.viewUrl, "_blank", "noopener") });
         if (it.viewUrl)
             actions.push({ label: "Preview", run: () => emitPreview(siblings, index) });
+        // Raws (source-named) and approved posts (title-named) can't be file-renamed;
+        // only /files + /temp files rename in place. Folders rename in every root.
+        if ((it.root === "files" || it.root === "temp") && it.id)
+            actions.push({ label: "Rename", run: () => renameItem(it) });
         actions.push({ label: "Copy path", run: () => copyPath(it.path) });
         row.appendChild(kebab(it, actions));
         return row;
@@ -663,8 +753,10 @@ export function createDirectoryExplorer(mount, opts = {}) {
         const it = rowEl ? findItem(rowEl.getAttribute("data-path") || "") : undefined;
         if (it && it.kind === "folder") {
             actions.push({ label: "Open folder", run: () => navigate(it.path) });
-            if (rootSet)
+            if (canWriteRoot(it.root))
                 actions.push({ label: "New subfolder", run: () => createFolder(it.folderPath) });
+            if (canWriteRoot(it.root))
+                actions.push({ label: "Rename", run: () => renameItem(it) });
             actions.push({ label: "Copy path", run: () => copyPath(it.path) });
         }
         else if (it) {
@@ -674,10 +766,12 @@ export function createDirectoryExplorer(mount, opts = {}) {
                 actions.push({ label: "View", run: () => window.open(it.viewUrl, "_blank", "noopener") });
             if (it.viewUrl)
                 actions.push({ label: "Preview", run: () => emitPreview(files, files.indexOf(it)) });
+            if (it.root !== "raws" && canWriteRoot(it.root) && it.id)
+                actions.push({ label: "Rename", run: () => renameItem(it) });
             actions.push({ label: "Copy path", run: () => copyPath(it.path) });
         }
-        // Always offer "New folder" in the current folder when inside a root.
-        if (rootSet)
+        // Always offer "New folder" in the current folder when inside a writable root.
+        if (rootSet && canWriteRoot(currentRoot()))
             actions.push({ label: "New folder here", run: () => createFolder() });
         if (!actions.length)
             return; // virtual root, empty space → let the browser menu show
@@ -698,11 +792,13 @@ export function createDirectoryExplorer(mount, opts = {}) {
         if (e.dataTransfer && e.dataTransfer.files)
             uploadFiles(e.dataTransfer.files);
     });
+    (opts.onNavigate || (() => { }))(currentPath);
     load(true);
     return {
         refresh: () => load(true),
         navigate,
         getSelection: () => Array.from(selection.values()),
+        getCurrentPath: () => currentPath,
         destroy: () => { destroyed = true; if (closeOpenMenu)
             closeOpenMenu(); mount.innerHTML = ""; }
     };
@@ -712,6 +808,160 @@ function cssEscape(s) {
         return window.CSS.escape(s);
     return s.replace(/["\\]/g, "\\$&");
 }
+// ── pop-panel picker (modal) ──────────────────────────────────────────────────
+// A self-contained modal wrapper around createDirectoryExplorer so any surface
+// (editor "Replace media", inpaint "Save to Files", …) can pick a file or a
+// destination folder without reimplementing the overlay + CSS each time.
+const PICKER_STYLE_ID = "rk-dirpick-style";
+function ensurePickerStyle() {
+    if (document.getElementById(PICKER_STYLE_ID))
+        return;
+    const s = document.createElement("style");
+    s.id = PICKER_STYLE_ID;
+    // Uses reskin --rk-* tokens where present, with plain fallbacks so the modal
+    // is legible even on a page that hasn't loaded the design-system variables.
+    s.textContent = [
+        ".rk-dirpick{position:fixed;inset:0;z-index:1200;display:grid;place-items:center;padding:20px;",
+        "background:rgba(28,25,23,.44);backdrop-filter:blur(2px);animation:rk-dirpick-fade .16s ease}",
+        "@keyframes rk-dirpick-fade{from{opacity:0}to{opacity:1}}",
+        ".rk-dirpick-panel{width:min(560px,100%);max-height:min(82vh,700px);display:flex;flex-direction:column;",
+        "background:var(--rk-surface,#fff);border:1px solid var(--rk-border,#e6e0d6);border-radius:var(--rk-r-3xl,20px);",
+        "box-shadow:var(--rk-shadow-lg,0 24px 60px rgba(28,25,23,.28));overflow:hidden}",
+        ".rk-dirpick-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 18px;",
+        "border-bottom:1px solid var(--rk-border,#e6e0d6)}",
+        ".rk-dirpick-title{font-family:var(--rk-font-display,inherit);font-weight:800;font-size:15px;color:var(--rk-ink,#1c1917)}",
+        ".rk-dirpick-close{border:0;background:transparent;font-size:22px;line-height:1;color:var(--rk-text-muted,#78716c);cursor:pointer;padding:0 4px}",
+        ".rk-dirpick-close:hover{color:var(--rk-ink,#1c1917)}",
+        ".rk-dirpick-hint{padding:10px 18px 0;font-size:12.5px;line-height:1.4;color:var(--rk-text-muted,#78716c)}",
+        ".rk-dirpick-mount{padding:12px 14px;overflow:auto;flex:1;min-height:0}",
+        ".rk-dirpick-foot{display:flex;align-items:center;gap:10px;padding:12px 18px;border-top:1px solid var(--rk-border,#e6e0d6)}",
+        ".rk-dirpick-dest{flex:1;min-width:0;font-size:12.5px;color:var(--rk-text-muted,#78716c);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}",
+        ".rk-dirpick-dest b{color:var(--rk-ink,#1c1917);font-weight:700}",
+        ".rk-dirpick-btn{flex:none;min-height:36px;padding:0 16px;border-radius:999px;border:0;cursor:pointer;",
+        "font:inherit;font-size:13px;font-weight:800;background:var(--rk-gold-500,var(--rk-gold-600,#fcb900));color:var(--rk-ink,#1c1917)}",
+        ".rk-dirpick-btn:hover:not(:disabled){background:var(--rk-gold-600,#e0a500)}",
+        ".rk-dirpick-btn:disabled{opacity:.5;cursor:default}",
+        ".rk-dirpick-btn.is-ghost{background:transparent;border:1px solid var(--rk-border,#e6e0d6);color:var(--rk-ink,#1c1917)}"
+    ].join("");
+    document.head.appendChild(s);
+}
+export function openDirectoryPicker(opts = {}) {
+    ensurePickerStyle();
+    const select = opts.select === "folder" ? "folder" : "file";
+    let done = false;
+    let explorer = null;
+    const overlay = el("div", "rk-dirpick");
+    const panel = el("div", "rk-dirpick-panel");
+    const head = el("div", "rk-dirpick-head");
+    head.appendChild(el("span", "rk-dirpick-title", opts.title || (select === "folder" ? "Choose a folder" : "Choose a file")));
+    const closeBtn = el("button", "rk-dirpick-close");
+    closeBtn.type = "button";
+    closeBtn.setAttribute("aria-label", "Close");
+    closeBtn.innerHTML = "×";
+    head.appendChild(closeBtn);
+    panel.appendChild(head);
+    if (opts.hint)
+        panel.appendChild(el("div", "rk-dirpick-hint", opts.hint));
+    const mountEl = el("div", "rk-dirpick-mount");
+    panel.appendChild(mountEl);
+    // Folder mode gets a footer that commits the currently-open folder.
+    let destEl = null;
+    let confirmBtn = null;
+    function finish(result) {
+        if (done)
+            return;
+        done = true;
+        close();
+        if (result)
+            (opts.onPick || (() => { }))(result);
+        else
+            (opts.onCancel || (() => { }))();
+    }
+    function folderItemFor(path) {
+        const parsed = parseDirectoryPath(path);
+        if (!parsed.root)
+            return null; // the virtual root "/" isn't a real folder
+        const folder = parsed.folderPath || "";
+        const name = folder ? folder.split("/").filter(Boolean).pop() || folder : parsed.root;
+        return { path: buildDirectoryPath(parsed.root, folder), root: parsed.root, folderPath: folder, name, kind: "folder" };
+    }
+    function syncFooter(path) {
+        if (!destEl || !confirmBtn)
+            return;
+        const item = folderItemFor(path);
+        if (item) {
+            destEl.innerHTML = "";
+            destEl.appendChild(document.createTextNode("Save to "));
+            const b = el("b", undefined, item.path);
+            destEl.appendChild(b);
+            confirmBtn.disabled = false;
+        }
+        else {
+            destEl.textContent = "Open a folder (Files, Temp, …) to choose a destination.";
+            confirmBtn.disabled = true;
+        }
+    }
+    if (select === "folder") {
+        const foot = el("div", "rk-dirpick-foot");
+        destEl = el("div", "rk-dirpick-dest");
+        const cancel = el("button", "rk-dirpick-btn is-ghost", "Cancel");
+        cancel.type = "button";
+        cancel.addEventListener("click", () => finish(null));
+        confirmBtn = el("button", "rk-dirpick-btn", opts.confirmLabel || "Use this folder");
+        confirmBtn.type = "button";
+        confirmBtn.addEventListener("click", () => {
+            const item = explorer ? folderItemFor(explorer.getCurrentPath()) : null;
+            if (item)
+                finish(item);
+        });
+        foot.appendChild(destEl);
+        foot.appendChild(cancel);
+        foot.appendChild(confirmBtn);
+        panel.appendChild(foot);
+    }
+    overlay.appendChild(panel);
+    document.body.appendChild(overlay);
+    function onKey(e) { if (e.key === "Escape")
+        finish(null); }
+    function close() {
+        document.removeEventListener("keydown", onKey, true);
+        try {
+            explorer && explorer.destroy();
+        }
+        catch { /* noop */ }
+        overlay.remove();
+    }
+    closeBtn.addEventListener("click", () => finish(null));
+    overlay.addEventListener("click", (e) => { if (e.target === overlay)
+        finish(null); });
+    document.addEventListener("keydown", onKey, true);
+    explorer = createDirectoryExplorer(mountEl, {
+        roots: opts.roots,
+        initialPath: opts.initialPath,
+        apiBase: opts.apiBase,
+        // Standalone hides Attach chrome; picking is our own affordance.
+        mode: "standalone",
+        showSearch: true,
+        showMultiSelect: false,
+        showUpload: false, // the picker only selects; it doesn't upload
+        // In file mode a name-click resolves the pick; folders still navigate.
+        primaryClick: select === "file" ? "attach" : "copyPath",
+        onNavigate: (p) => syncFooter(p),
+        onAttach: (items) => {
+            if (select !== "file")
+                return;
+            const it = items && items[0];
+            if (!it)
+                return;
+            if (opts.accept && !opts.accept(it)) {
+                showToast(opts.rejectMessage || "That file can't be used here.");
+                return;
+            }
+            finish(it);
+        }
+    });
+    return { close: () => finish(null) };
+}
 // ── auto-mount + global bridge ───────────────────────────────────────────────
 function readDataOpts(node) {
     const d = node.dataset;
@@ -723,7 +973,8 @@ function readDataOpts(node) {
         showSearch: d.showSearch !== "false",
         showMultiSelect: d.showMultiselect !== "false",
         showUpload: d.showUpload != null ? d.showUpload === "true" : undefined,
-        primaryClick: d.primaryClick || "copyPath"
+        primaryClick: d.primaryClick || "copyPath",
+        cloudAvailable: d.cloudAvailable != null ? d.cloudAvailable === "true" : undefined
     };
 }
 function autoMount() {
@@ -735,7 +986,7 @@ function autoMount() {
         window.__rkDirectoryInstance = createDirectoryExplorer(node, readDataOpts(node));
     });
 }
-window.__vidfarmDirectory = { mount: createDirectoryExplorer };
+window.__vidfarmDirectory = { mount: createDirectoryExplorer, pick: openDirectoryPicker };
 if (document.readyState === "loading")
     document.addEventListener("DOMContentLoaded", autoMount);
 else

package/dist/src/frontend/homepage-view.js

@@ -66,7 +66,7 @@ function PrimaryNav({ account }) {
         ? [
             { id: "chat", href: withAccountQuery("/chat", account.userId), label: "Chat" },
             { id: "job-runs", href: withAccountQuery("/job-runs", account.userId), label: "Run History" },
-            { id: "inpaint", href: withAccountQuery("/inpaint", account.userId), label: "Inpaint" },
+            { id: "tools", href: withAccountQuery("/tools/image", account.userId), label: "Tools" },
             { id: "help", href: "/help", label: "Help" },
             { id: "logout", action: "logout", label: "Log Out" }
         ]
@@ -286,7 +286,7 @@ function editorHref(templateId, accountUserId) {
         : withAccountQuery(`/templates/${encodeURIComponent(templateId)}/editor/docs`, accountUserId);
 }
 function CreateButton({ templateId, accountUserId }) {
-    return _jsx("a", { className: "cta-button", href: editorHref(templateId, accountUserId), children: "Editor" });
+    return _jsx("a", { className: "cta-button", href: editorHref(templateId, accountUserId), target: "_blank", rel: "noopener", children: "Editor" });
 }
 function CardMenu(input) {
     const { template } = input;
@@ -343,7 +343,7 @@ function CardMenu(input) {
             window.alert(result.error || "Unable to delete this template.");
         }
     };
-    return (_jsxs("div", { className: "discover-card-menu", ref: menuRef, children: [_jsx("button", { type: "button", className: "discover-card-menu-trigger", "aria-haspopup": "menu", "aria-expanded": isOpen, "aria-label": `More actions for ${template.title}`, title: "More actions", onClick: () => setIsOpen((prev) => !prev), children: _jsx(MoreIcon, {}) }), isOpen ? (_jsxs("div", { className: "discover-card-menu-panel", role: "menu", children: [_jsx("button", { type: "button", className: "discover-card-menu-item", role: "menuitem", onClick: () => void handleCopyId(), children: copied ? "Copied!" : "Copy ID" }), isPending ? (_jsx("span", { className: "discover-card-menu-item is-disabled", role: "menuitem", "aria-disabled": "true", children: "Open in Editor" })) : (_jsx("a", { className: "discover-card-menu-item", role: "menuitem", href: editorHref(template.templateId, input.accountUserId), children: "Open in Editor" })), _jsx("button", { type: "button", className: "discover-card-menu-item", role: "menuitem", onClick: () => {
+    return (_jsxs("div", { className: "discover-card-menu", ref: menuRef, children: [_jsx("button", { type: "button", className: "discover-card-menu-trigger", "aria-haspopup": "menu", "aria-expanded": isOpen, "aria-label": `More actions for ${template.title}`, title: "More actions", onClick: () => setIsOpen((prev) => !prev), children: _jsx(MoreIcon, {}) }), isOpen ? (_jsxs("div", { className: "discover-card-menu-panel", role: "menu", children: [_jsx("button", { type: "button", className: "discover-card-menu-item", role: "menuitem", onClick: () => void handleCopyId(), children: copied ? "Copied!" : "Copy ID" }), isPending ? (_jsx("span", { className: "discover-card-menu-item is-disabled", role: "menuitem", "aria-disabled": "true", children: "Open in Editor" })) : (_jsx("a", { className: "discover-card-menu-item", role: "menuitem", href: editorHref(template.templateId, input.accountUserId), target: "_blank", rel: "noopener", children: "Open in Editor" })), _jsx("button", { type: "button", className: "discover-card-menu-item", role: "menuitem", onClick: () => {
                             input.onToggleBookmark?.(template.templateId);
                             setIsOpen(false);
                         }, children: input.isBookmarked ? "Remove Bookmark" : "Bookmark" }), canDelete ? (_jsx("button", { type: "button", className: "discover-card-menu-item is-danger", role: "menuitem", disabled: deleting, onClick: () => void handleDelete(), children: deleting ? "Deleting…" : "Delete" })) : null] })) : null] }));

package/dist/src/frontend/template-editor-chat.js

@@ -390,8 +390,11 @@ function collectLabeledUrls(value, output, seen = new Set(), path = []) {
     }
 }
 function buildJobQueuedMessage(job) {
+    // MUST stay string-identical to buildAsyncJobHandoffText in src/editor-chat.ts —
+    // the server streams that text and this client copy dedupes it by substring.
+    // Job-KIND-agnostic ("job", not "render"): fires for any queued async job.
     return [
-        `Started render \`${job.job_id}\`${job.tracer ? ` with tracer \`${job.tracer}\`` : ""}.`,
+        `Started job \`${job.job_id}\`${job.tracer ? ` with tracer \`${job.tracer}\`` : ""}.`,
         "If it takes a while, ask for an update later and I can check it for you."
     ].join("\n\n");
 }
@@ -1479,7 +1482,7 @@ function mediaInpaintHref(preview, ensureTracer = false) {
     if (typeof window === "undefined" || preview.kind !== "image" || !preview.url) {
         return "";
     }
-    const pageUrl = new URL("/inpaint", window.location.origin);
+    const pageUrl = new URL("/tools/image", window.location.origin);
     const bridge = window.__vidfarmEditorTracers;
     const existingTracers = bridge?.get() ?? readTracersFromLocation();
     const tracer = existingTracers[0] || (ensureTracer ? bridge?.add() ?? "" : "");
@@ -1500,7 +1503,7 @@ function MediaPreviewModal(props) {
     const activePreview = gallery[activeIndex] || props.preview;
     const canNavigate = gallery.length > 1;
     const canInpaint = activePreview.kind === "image";
-    const initialInpaintHref = canInpaint ? mediaInpaintHref(activePreview, false) || "/inpaint" : "/inpaint";
+    const initialInpaintHref = canInpaint ? mediaInpaintHref(activePreview, false) || "/tools/image" : "/tools/image";
     useEffect(() => {
         setIsMounted(true);
     }, []);

package/dist/src/page-shell.js

@@ -82,7 +82,7 @@ export function renderPrimaryNav(input) {
         ? [
             { id: "chat", href: withAccountQuery("/chat", input.accountId), label: "Chat" },
             { id: "job-runs", href: withAccountQuery("/job-runs", input.accountId), label: "Run History" },
-            { id: "inpaint", href: withAccountQuery("/inpaint", input.accountId), label: "Inpaint" },
+            { id: "tools", href: withAccountQuery("/tools/image", input.accountId), label: "Tools" },
             { id: "help", href: "/help", label: "Help" },
             { id: "logout", action: "logout", label: "Log Out" }
         ]

package/dist/src/primitive-context.js

@@ -4,6 +4,7 @@ import { config } from "./config.js";
 import { devErrorFields, devLog } from "./lib/dev-log.js";
 import { createId } from "./lib/ids.js";
 import { jobLogStore } from "./services/job-logs.js";
+import { RenderInProgressError } from "./services/hyperframes.js";
 import { estimateNormalizationCostUsd, normalizeVideoAsset } from "./services/video-normalization.js";
 export function createPrimitiveJobContext(input) {
     const prefix = input.storage.primitiveJobPrefix(input.primitive.id, input.customer.id, input.job.id);
@@ -202,11 +203,30 @@ export function createPrimitiveJobContext(input) {
         hyperframes: {
             async render(request) {
                 const hyperframesOutputKey = `renders/vidfarm/primitives/${input.primitive.id}/${input.customer.id}/${input.job.id}/output.mp4`;
-                const render = await input.hyperframes.render({
+                // Re-entrant, non-blocking render: the first invocation dispatches the
+                // render to its own Step Functions state machine and throws
+                // RenderInProgressError so the job runner parks as `waiting_for_render`;
+                // Step Functions waits + re-invokes, and a later invocation resumes the
+                // SAME render (keyed by the deterministic execution name) and finalizes
+                // once it terminates. No single Lambda holds the render open for its
+                // 15-minute lifetime.
+                const step = await input.hyperframes.renderStep({
                     ...request,
                     outputKey: hyperframesOutputKey,
-                    wait: true
+                    executionName: renderExecutionName(input.job.id)
                 });
+                if (step.state === "running") {
+                    throw new RenderInProgressError({
+                        executionArn: step.executionArn,
+                        renderId: step.renderId,
+                        waitSeconds: config.RENDER_POLL_WAIT_SECONDS,
+                        progressFraction: step.progressFraction
+                    });
+                }
+                if (step.state === "failed") {
+                    throw new Error(step.message);
+                }
+                const render = step;
                 let outputUrl = render.outputUrl;
                 let platformOutputKey = null;
                 const localOutputLocation = typeof render.metadata.outputLocation === "string"
@@ -370,4 +390,13 @@ export function createPrimitiveJobContext(input) {
 function buildPlatformMediaUrl(storageKey) {
     return `${config.PUBLIC_BASE_URL.replace(/\/$/, "")}/template-media?key=${encodeURIComponent(storageKey)}`;
 }
+/**
+ * Deterministic Step Functions execution name for a job's render. Stable across
+ * job-runner re-invocations so each poll resumes the same render execution
+ * rather than starting a new one. Step Functions execution names allow
+ * [A-Za-z0-9-_] and cap at 80 chars.
+ */
+function renderExecutionName(jobId) {
+    return `vfr-${jobId.replace(/[^A-Za-z0-9_-]/g, "-")}`.slice(0, 80);
+}
 //# sourceMappingURL=primitive-context.js.map