@loopstack/loopstack-studio 0.23.0 → 0.24.0

package/dist/features/workbench/Workbench.js

@@ -1,11 +1,9 @@
 import { useWorkspace } from "../../hooks/useWorkspaces.js";
 import PageBreadcrumbs_default from "../../components/page/PageBreadcrumbs.js";
-import { CodeExplorerProvider, useCodeExplorerContext } from "../code-explorer/providers/CodeExplorerProvider.js";
-import { FileContentViewer } from "../code-explorer/components/FileContentViewer.js";
-import { FileTabsBar } from "../code-explorer/components/FileTabsBar.js";
-import "../code-explorer/index.js";
 import { WorkbenchLayoutProvider, useWorkbenchLayout } from "./providers/WorkbenchLayoutProvider.js";
 import WorkflowList_default from "./WorkflowList.js";
+import { RemoteFileExplorerProvider } from "./providers/RemoteFileExplorerProvider.js";
+import { WorkbenchFilesPanel } from "./components/WorkbenchFilesPanel.js";
 import { ScrollProvider } from "./providers/ScrollProvider.js";
 import { WorkbenchFloatingPanel } from "./components/WorkbenchFloatingPanel.js";
 import { WorkbenchFlowPanel } from "./components/WorkbenchFlowPanel.js";
@@ -14,110 +12,96 @@ import { WorkbenchPreviewPanel } from "./components/WorkbenchPreviewPanel.js";
 import { c } from "react/compiler-runtime";
 import { jsx, jsxs } from "react/jsx-runtime";
 function WorkbenchContent(t) {
-	let i = c(16), { pipeline: l, breadcrumbData: u } = t, { openFiles: p, selectedFile: m, fileContent: h, workflowConfig: g, isContentLoading: v } = useCodeExplorerContext(), y;
-	i[0] === u ? y = i[1] : (y = /* @__PURE__ */ jsx("div", {
+	let i = c(7), { pipeline: a, breadcrumbData: s } = t, l;
+	i[0] === s ? l = i[1] : (l = /* @__PURE__ */ jsx("div", {
 		className: "border-b flex h-12 shrink-0 items-center",
-		children: u ? /* @__PURE__ */ jsx(PageBreadcrumbs_default, { breadcrumbData: u }) : /* @__PURE__ */ jsx("span", {
+		children: s ? /* @__PURE__ */ jsx(PageBreadcrumbs_default, { breadcrumbData: s }) : /* @__PURE__ */ jsx("span", {
 			className: "px-3 text-sm font-medium",
 			children: "Workflows"
 		})
-	}), i[0] = u, i[1] = y);
-	let b;
-	i[2] === l ? b = i[3] : (b = /* @__PURE__ */ jsx(ScrollProvider, { children: /* @__PURE__ */ jsx("div", {
+	}), i[0] = s, i[1] = l);
+	let d;
+	i[2] === a ? d = i[3] : (d = /* @__PURE__ */ jsx(ScrollProvider, { children: /* @__PURE__ */ jsx("div", {
 		className: "flex-1 overflow-auto",
-		children: /* @__PURE__ */ jsx(WorkflowList_default, { pipeline: l })
-	}) }), i[2] = l, i[3] = b);
-	let x;
-	i[4] !== y || i[5] !== b ? (x = /* @__PURE__ */ jsxs("div", {
-		className: "flex flex-1 flex-col overflow-hidden",
-		children: [y, b]
-	}), i[4] = y, i[5] = b, i[6] = x) : x = i[6];
-	let S;
-	i[7] !== h || i[8] !== v || i[9] !== p.length || i[10] !== m || i[11] !== g ? (S = p.length > 0 && /* @__PURE__ */ jsxs("div", {
-		className: "w-full md:w-1/2 shrink-0 overflow-hidden flex flex-col",
-		children: [/* @__PURE__ */ jsx(FileTabsBar, {}), /* @__PURE__ */ jsx("div", {
-			className: "flex-1 overflow-hidden",
-			children: /* @__PURE__ */ jsx(FileContentViewer, {
-				selectedFile: m,
-				content: h,
-				workflowConfig: g,
-				isLoading: v,
-				className: "h-full"
-			})
-		})]
-	}), i[7] = h, i[8] = v, i[9] = p.length, i[10] = m, i[11] = g, i[12] = S) : S = i[12];
-	let C;
-	return i[13] !== x || i[14] !== S ? (C = /* @__PURE__ */ jsx("div", {
+		children: /* @__PURE__ */ jsx(WorkflowList_default, { pipeline: a })
+	}) }), i[2] = a, i[3] = d);
+	let f;
+	return i[4] !== l || i[5] !== d ? (f = /* @__PURE__ */ jsx("div", {
 		className: "flex h-full flex-col",
-		children: /* @__PURE__ */ jsxs("div", {
+		children: /* @__PURE__ */ jsx("div", {
 			className: "flex flex-1 gap-4 overflow-hidden md:flex-row flex-col",
-			children: [x, S]
+			children: /* @__PURE__ */ jsxs("div", {
+				className: "flex flex-1 flex-col overflow-hidden",
+				children: [l, d]
+			})
 		})
-	}), i[13] = x, i[14] = S, i[15] = C) : C = i[15], C;
+	}), i[4] = l, i[5] = d, i[6] = f) : f = i[6], f;
 }
 function WorkbenchInner(t) {
-	let r = c(18), { pipeline: i, breadcrumbData: a } = t, { activeSidePanel: o } = useWorkbenchLayout(), s = o ? "w-1/2 overflow-hidden" : "w-full overflow-hidden", l;
-	r[0] !== a || r[1] !== i ? (l = /* @__PURE__ */ jsx(WorkbenchContent, {
+	let r = c(21), { pipeline: i, breadcrumbData: o } = t, { activeSidePanel: s } = useWorkbenchLayout(), u = s ? "w-1/2 overflow-hidden" : "w-full overflow-hidden", _;
+	r[0] !== o || r[1] !== i ? (_ = /* @__PURE__ */ jsx(WorkbenchContent, {
 		pipeline: i,
-		breadcrumbData: a
-	}), r[0] = a, r[1] = i, r[2] = l) : l = r[2];
-	let d;
-	r[3] !== s || r[4] !== l ? (d = /* @__PURE__ */ jsx("div", {
-		className: s,
-		children: l
-	}), r[3] = s, r[4] = l, r[5] = d) : d = r[5];
-	let f;
-	r[6] === o ? f = r[7] : (f = o === "preview" && /* @__PURE__ */ jsx(WorkbenchPreviewPanel, {}), r[6] = o, r[7] = f);
+		breadcrumbData: o
+	}), r[0] = o, r[1] = i, r[2] = _) : _ = r[2];
+	let v;
+	r[3] !== u || r[4] !== _ ? (v = /* @__PURE__ */ jsx("div", {
+		className: u,
+		children: _
+	}), r[3] = u, r[4] = _, r[5] = v) : v = r[5];
 	let y;
-	r[8] === o ? y = r[9] : (y = o === "flow" && /* @__PURE__ */ jsx(WorkbenchFlowPanel, {}), r[8] = o, r[9] = y);
+	r[6] === s ? y = r[7] : (y = s === "preview" && /* @__PURE__ */ jsx(WorkbenchPreviewPanel, {}), r[6] = s, r[7] = y);
 	let b;
-	r[10] === Symbol.for("react.memo_cache_sentinel") ? (b = /* @__PURE__ */ jsx(WorkbenchFloatingPanel, {}), r[10] = b) : b = r[10];
+	r[8] === s ? b = r[9] : (b = s === "flow" && /* @__PURE__ */ jsx(WorkbenchFlowPanel, {}), r[8] = s, r[9] = b);
 	let x;
-	r[11] !== d || r[12] !== f || r[13] !== y ? (x = /* @__PURE__ */ jsxs("div", {
+	r[10] === s ? x = r[11] : (x = s === "files" && /* @__PURE__ */ jsx(WorkbenchFilesPanel, {}), r[10] = s, r[11] = x);
+	let S;
+	r[12] === Symbol.for("react.memo_cache_sentinel") ? (S = /* @__PURE__ */ jsx(WorkbenchFloatingPanel, {}), r[12] = S) : S = r[12];
+	let C;
+	r[13] !== v || r[14] !== y || r[15] !== b || r[16] !== x ? (C = /* @__PURE__ */ jsxs("div", {
 		className: "relative flex flex-1 overflow-hidden",
 		children: [
-			d,
-			f,
+			v,
 			y,
-			b
+			b,
+			x,
+			S
 		]
-	}), r[11] = d, r[12] = f, r[13] = y, r[14] = x) : x = r[14];
-	let S;
-	r[15] === Symbol.for("react.memo_cache_sentinel") ? (S = /* @__PURE__ */ jsx(WorkbenchIconSidebar, {}), r[15] = S) : S = r[15];
-	let C;
-	return r[16] === x ? C = r[17] : (C = /* @__PURE__ */ jsxs("div", {
+	}), r[13] = v, r[14] = y, r[15] = b, r[16] = x, r[17] = C) : C = r[17];
+	let w;
+	r[18] === Symbol.for("react.memo_cache_sentinel") ? (w = /* @__PURE__ */ jsx(WorkbenchIconSidebar, {}), r[18] = w) : w = r[18];
+	let T;
+	return r[19] === C ? T = r[20] : (T = /* @__PURE__ */ jsxs("div", {
 		className: "flex h-full w-full",
-		children: [x, S]
-	}), r[16] = x, r[17] = C), C;
+		children: [C, w]
+	}), r[19] = C, r[20] = T), T;
 }
 function Workbench(r) {
-	let a = c(19), { pipeline: o, breadcrumbData: s, previewPanelOpen: u, onPreviewPanelOpenChange: d, isDeveloperMode: f, getPreviewUrl: p, getEnvironmentPreviewUrl: m, environments: h } = r, g = o?.workspaceId, _ = useWorkspace(g), v = _.data?.features?.fileExplorer?.enabled ?? !1, b;
-	a[0] === _.data ? b = a[1] : (b = _.data ? {
-		volumes: _.data.volumes,
-		features: _.data.features
-	} : void 0, a[0] = _.data, a[1] = b);
-	let x = b, S = h ?? _.data?.environments, C = o?.id, w;
-	a[2] !== s || a[3] !== o ? (w = /* @__PURE__ */ jsx(WorkbenchInner, {
+	let a = c(20), { pipeline: o, breadcrumbData: l, previewPanelOpen: u, onPreviewPanelOpenChange: d, isDeveloperMode: f, getPreviewUrl: p, getEnvironmentPreviewUrl: m, environments: h } = r, g = o?.workspaceId, v = useWorkspace(g), y;
+	a[0] !== h?.[0]?.slotId || a[1] !== v.data?.features?.fileExplorer?.enabled || a[2] !== v.data?.features?.fileExplorer?.environments ? (y = v.data?.features?.fileExplorer?.enabled && v.data?.features?.fileExplorer?.environments?.includes(h?.[0]?.slotId ?? ""), a[0] = h?.[0]?.slotId, a[1] = v.data?.features?.fileExplorer?.enabled, a[2] = v.data?.features?.fileExplorer?.environments, a[3] = y) : y = a[3];
+	let b = y, x;
+	a[4] === v.data ? x = a[5] : (x = v.data ? {
+		volumes: v.data.volumes,
+		features: v.data.features
+	} : void 0, a[4] = v.data, a[5] = x);
+	let S = x, C = h ?? v.data?.environments, w;
+	a[6] !== l || a[7] !== b || a[8] !== o ? (w = b ? /* @__PURE__ */ jsx(RemoteFileExplorerProvider, { children: /* @__PURE__ */ jsx(WorkbenchInner, {
+		pipeline: o,
+		breadcrumbData: l
+	}) }) : /* @__PURE__ */ jsx(WorkbenchInner, {
 		pipeline: o,
-		breadcrumbData: s
-	}), a[2] = s, a[3] = o, a[4] = w) : w = a[4];
+		breadcrumbData: l
+	}), a[6] = l, a[7] = b, a[8] = o, a[9] = w) : w = a[9];
 	let T;
-	a[5] !== v || a[6] !== C || a[7] !== w ? (T = /* @__PURE__ */ jsx(CodeExplorerProvider, {
-		pipelineId: C,
-		fileExplorerEnabled: v,
-		children: w
-	}), a[5] = v, a[6] = C, a[7] = w, a[8] = T) : T = a[8];
-	let E;
-	return a[9] !== m || a[10] !== p || a[11] !== f || a[12] !== d || a[13] !== o || a[14] !== u || a[15] !== S || a[16] !== T || a[17] !== x ? (E = /* @__PURE__ */ jsx(WorkbenchLayoutProvider, {
+	return a[10] !== m || a[11] !== p || a[12] !== f || a[13] !== d || a[14] !== o || a[15] !== u || a[16] !== C || a[17] !== w || a[18] !== S ? (T = /* @__PURE__ */ jsx(WorkbenchLayoutProvider, {
 		pipeline: o,
 		isDeveloperMode: f,
-		workspaceConfig: x,
+		workspaceConfig: S,
 		getPreviewUrl: p,
 		getEnvironmentPreviewUrl: m,
-		environments: S,
+		environments: C,
 		previewPanelOpen: u,
 		onPreviewPanelOpenChange: d,
-		children: T
-	}), a[9] = m, a[10] = p, a[11] = f, a[12] = d, a[13] = o, a[14] = u, a[15] = S, a[16] = T, a[17] = x, a[18] = E) : E = a[18], E;
+		children: w
+	}), a[10] = m, a[11] = p, a[12] = f, a[13] = d, a[14] = o, a[15] = u, a[16] = C, a[17] = w, a[18] = S, a[19] = T) : T = a[19], T;
 }
 export { Workbench as default };

package/dist/features/workbench/WorkflowItem.js

@@ -11,7 +11,7 @@ import React, { useEffect } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useParams } from "react-router-dom";
 var WorkflowItem_default = (p) => {
-	let m = c(46), { pipeline: h, workflowId: g, scrollTo: _, settings: v, embed: y } = p, { workflowId: b, clickId: x } = useParams(), S;
+	let m = c(45), { pipeline: h, workflowId: g, scrollTo: _, settings: v, embed: y } = p, { workflowId: b, clickId: x } = useParams(), S;
 	m[0] !== v.showFullMessageHistory || m[1] !== g ? (S = {
 		workflowId: g,
 		showFullMessageHistory: v.showFullMessageHistory
@@ -49,15 +49,15 @@ var WorkflowItem_default = (p) => {
 	let H;
 	m[32] === j ? H = m[33] : (H = /* @__PURE__ */ jsx(LoadingCentered_default, { loading: j }), m[32] = j, m[33] = H);
 	let U;
-	m[34] !== y || m[35] !== M || m[36] !== C ? (U = !!C && !y && /* @__PURE__ */ jsx("div", {
+	m[34] !== M || m[35] !== C ? (U = !!C && /* @__PURE__ */ jsx("div", {
 		className: "mt-6",
 		children: /* @__PURE__ */ jsx(WorkflowForms_default, {
 			workflow: C,
 			onSubmit: M
 		})
-	}), m[34] = y, m[35] = M, m[36] = C, m[37] = U) : U = m[37];
+	}), m[34] = M, m[35] = C, m[36] = U) : U = m[36];
 	let W;
-	return m[38] !== V || m[39] !== H || m[40] !== U || m[41] !== I || m[42] !== R || m[43] !== z || m[44] !== B ? (W = /* @__PURE__ */ jsxs("div", {
+	return m[37] !== V || m[38] !== H || m[39] !== U || m[40] !== I || m[41] !== R || m[42] !== z || m[43] !== B ? (W = /* @__PURE__ */ jsxs("div", {
 		className: I,
 		children: [
 			R,
@@ -67,6 +67,6 @@ var WorkflowItem_default = (p) => {
 			H,
 			U
 		]
-	}), m[38] = V, m[39] = H, m[40] = U, m[41] = I, m[42] = R, m[43] = z, m[44] = B, m[45] = W) : W = m[45], W;
+	}), m[37] = V, m[38] = H, m[39] = U, m[40] = I, m[41] = R, m[42] = z, m[43] = B, m[44] = W) : W = m[44], W;
 };
 export { WorkflowItem_default as default };

package/dist/features/workbench/components/RemoteFileTabsBar.js

@@ -0,0 +1,18 @@
+import { FileTabsBarBase } from "../../code-explorer/components/FileTabsBarBase.js";
+import { useRemoteFileExplorer } from "../providers/RemoteFileExplorerProvider.js";
+import { c } from "react/compiler-runtime";
+import { jsx } from "react/jsx-runtime";
+function RemoteFileTabsBar() {
+	let i = c(9), { openFiles: a, selectedFile: o, selectFile: s, closeFile: l, closeAll: u, closeOthers: d, closeToLeft: f, closeToRight: p } = useRemoteFileExplorer(), m;
+	return i[0] !== u || i[1] !== l || i[2] !== d || i[3] !== f || i[4] !== p || i[5] !== a || i[6] !== s || i[7] !== o ? (m = /* @__PURE__ */ jsx(FileTabsBarBase, {
+		openFiles: a,
+		selectedFile: o,
+		selectFile: s,
+		closeFile: l,
+		closeAll: u,
+		closeOthers: d,
+		closeToLeft: f,
+		closeToRight: p
+	}), i[0] = u, i[1] = l, i[2] = d, i[3] = f, i[4] = p, i[5] = a, i[6] = s, i[7] = o, i[8] = m) : m = i[8], m;
+}
+export { RemoteFileTabsBar };

package/dist/features/workbench/components/RemoteFileTree.js

@@ -0,0 +1,90 @@
+import { Button } from "../../../components/ui/button.js";
+import { ScrollArea } from "../../../components/ui/scroll-area.js";
+import { CodeExplorerTreeNode } from "../../code-explorer/components/CodeExplorerTreeNode.js";
+import { useRemoteFileExplorer } from "../providers/RemoteFileExplorerProvider.js";
+import { c } from "react/compiler-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { AlertCircle, Loader2, RefreshCw } from "lucide-react";
+var RemoteFileTree_default = () => {
+	let d = c(35), { nodes: f, isTreeLoading: p, treeError: m, isFetchingTree: h, expandedFolders: g, toggleFolder: _, selectFile: v, closeFile: y, selectedFile: b, refreshTree: x } = useRemoteFileExplorer();
+	if (p) {
+		let e;
+		return d[0] === Symbol.for("react.memo_cache_sentinel") ? (e = /* @__PURE__ */ jsxs("div", {
+			className: "flex items-center gap-2 p-3 text-sm text-muted-foreground",
+			children: [/* @__PURE__ */ jsx(Loader2, { className: "h-4 w-4 animate-spin" }), "Loading file tree…"]
+		}), d[0] = e) : e = d[0], e;
+	}
+	if (m) {
+		let a;
+		d[1] === Symbol.for("react.memo_cache_sentinel") ? (a = /* @__PURE__ */ jsx(AlertCircle, { className: "mt-0.5 h-4 w-4 shrink-0" }), d[1] = a) : a = d[1];
+		let o = m instanceof Error ? m.message : String(m), s;
+		d[2] === o ? s = d[3] : (s = /* @__PURE__ */ jsxs("div", {
+			className: "flex items-start gap-2 text-sm text-destructive",
+			children: [a, /* @__PURE__ */ jsx("span", { children: o })]
+		}), d[2] = o, d[3] = s);
+		let l;
+		d[4] === Symbol.for("react.memo_cache_sentinel") ? (l = /* @__PURE__ */ jsx(RefreshCw, { className: "mr-1.5 h-3.5 w-3.5" }), d[4] = l) : l = d[4];
+		let u;
+		d[5] === x ? u = d[6] : (u = /* @__PURE__ */ jsxs(Button, {
+			variant: "outline",
+			size: "sm",
+			onClick: x,
+			children: [l, "Retry"]
+		}), d[5] = x, d[6] = u);
+		let f;
+		return d[7] !== s || d[8] !== u ? (f = /* @__PURE__ */ jsxs("div", {
+			className: "space-y-2 p-3",
+			children: [s, u]
+		}), d[7] = s, d[8] = u, d[9] = f) : f = d[9], f;
+	}
+	if (f.length === 0) {
+		let e;
+		return d[10] === Symbol.for("react.memo_cache_sentinel") ? (e = /* @__PURE__ */ jsx("p", {
+			className: "px-2 py-4 text-sm text-muted-foreground",
+			children: "No files found"
+		}), d[10] = e) : e = d[10], e;
+	}
+	let S = `h-3 w-3 ${h ? "animate-spin" : ""}`, C;
+	d[11] === S ? C = d[12] : (C = /* @__PURE__ */ jsx(RefreshCw, { className: S }), d[11] = S, d[12] = C);
+	let w;
+	d[13] !== h || d[14] !== x || d[15] !== C ? (w = /* @__PURE__ */ jsx("div", {
+		className: "flex items-center justify-end px-1",
+		children: /* @__PURE__ */ jsx(Button, {
+			variant: "ghost",
+			size: "icon",
+			className: "h-6 w-6",
+			onClick: x,
+			disabled: h,
+			children: C
+		})
+	}), d[13] = h, d[14] = x, d[15] = C, d[16] = w) : w = d[16];
+	let T;
+	if (d[17] !== y || d[18] !== g || d[19] !== f || d[20] !== v || d[21] !== b?.id || d[22] !== _) {
+		let e;
+		d[24] !== y || d[25] !== g || d[26] !== v || d[27] !== b?.id || d[28] !== _ ? (e = (e) => /* @__PURE__ */ jsx(CodeExplorerTreeNode, {
+			node: e,
+			depth: 0,
+			expandedFolders: g,
+			toggleFolder: _,
+			onSelectFile: v,
+			onCloseFile: y,
+			selectedFileId: b?.id
+		}, e.id), d[24] = y, d[25] = g, d[26] = v, d[27] = b?.id, d[28] = _, d[29] = e) : e = d[29], T = f.map(e), d[17] = y, d[18] = g, d[19] = f, d[20] = v, d[21] = b?.id, d[22] = _, d[23] = T;
+	} else T = d[23];
+	let E;
+	d[30] === T ? E = d[31] : (E = /* @__PURE__ */ jsx(ScrollArea, {
+		className: "h-full w-full",
+		children: /* @__PURE__ */ jsx("div", {
+			className: "w-full py-1",
+			role: "tree",
+			"aria-label": "Remote file tree",
+			children: T
+		})
+	}), d[30] = T, d[31] = E);
+	let D;
+	return d[32] !== w || d[33] !== E ? (D = /* @__PURE__ */ jsxs("div", {
+		className: "flex h-full flex-col gap-1.5",
+		children: [w, E]
+	}), d[32] = w, d[33] = E, d[34] = D) : D = d[34], D;
+};
+export { RemoteFileTree_default as default };

package/dist/features/workbench/components/WorkbenchFilesPanel.js

@@ -0,0 +1,67 @@
+import { cn } from "../../../lib/utils.js";
+import { Button } from "../../../components/ui/button.js";
+import { useWorkbenchLayout } from "../providers/WorkbenchLayoutProvider.js";
+import { FileContentViewer } from "../../code-explorer/components/FileContentViewer.js";
+import "../../code-explorer/index.js";
+import { useOptionalRemoteFileExplorer } from "../providers/RemoteFileExplorerProvider.js";
+import { RemoteFileTabsBar } from "./RemoteFileTabsBar.js";
+import RemoteFileTree_default from "./RemoteFileTree.js";
+import { c } from "react/compiler-runtime";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { X } from "lucide-react";
+function WorkbenchFilesPanel() {
+	let p = c(10), { closeSidePanel: m, fileExplorerEnabled: h } = useWorkbenchLayout(), g = useOptionalRemoteFileExplorer();
+	if (!h) return null;
+	let _;
+	p[0] === Symbol.for("react.memo_cache_sentinel") ? (_ = /* @__PURE__ */ jsx("span", {
+		className: "text-sm font-medium",
+		children: "Files"
+	}), p[0] = _) : _ = p[0];
+	let v;
+	p[1] === Symbol.for("react.memo_cache_sentinel") ? (v = cn("h-5 w-5 shrink-0 rounded transition-opacity", "hover:bg-destructive/10 hover:text-destructive"), p[1] = v) : v = p[1];
+	let y;
+	p[2] === Symbol.for("react.memo_cache_sentinel") ? (y = /* @__PURE__ */ jsx(X, { className: "h-3.5 w-3.5" }), p[2] = y) : y = p[2];
+	let b;
+	p[3] === m ? b = p[4] : (b = /* @__PURE__ */ jsxs("div", {
+		className: "border-b flex h-12 shrink-0 items-center justify-between px-3",
+		children: [_, /* @__PURE__ */ jsx(Button, {
+			variant: "ghost",
+			size: "icon",
+			className: v,
+			onClick: m,
+			"aria-label": "Close Files Panel",
+			children: y
+		})]
+	}), p[3] = m, p[4] = b);
+	let x;
+	p[5] === g ? x = p[6] : (x = /* @__PURE__ */ jsx("div", {
+		className: "flex-1 overflow-hidden flex",
+		children: g ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("div", {
+			className: "w-64 shrink-0 border-r bg-muted/40",
+			children: /* @__PURE__ */ jsx(RemoteFileTree_default, {})
+		}), /* @__PURE__ */ jsxs("div", {
+			className: "flex-1 flex flex-col min-w-0",
+			children: [/* @__PURE__ */ jsx(RemoteFileTabsBar, {}), /* @__PURE__ */ jsx("div", {
+				className: "flex-1 overflow-hidden p-3 pt-2",
+				children: /* @__PURE__ */ jsx(FileContentViewer, {
+					selectedFile: g.selectedFile,
+					content: g.fileContent,
+					isLoading: g.isContentLoading,
+					className: "h-full"
+				})
+			})]
+		})] }) : /* @__PURE__ */ jsx("div", {
+			className: "flex-1 flex items-center justify-center p-4",
+			children: /* @__PURE__ */ jsx("p", {
+				className: "text-sm text-muted-foreground",
+				children: "Remote file explorer is not available for this workspace."
+			})
+		})
+	}), p[5] = g, p[6] = x);
+	let S;
+	return p[7] !== b || p[8] !== x ? (S = /* @__PURE__ */ jsxs("div", {
+		className: "border-l bg-background flex w-2/3 shrink-0 flex-col",
+		children: [b, x]
+	}), p[7] = b, p[8] = x, p[9] = S) : S = p[9], S;
+}
+export { WorkbenchFilesPanel };

package/dist/features/workbench/components/WorkbenchFloatingPanel.js

@@ -4,85 +4,93 @@ import { useWorkbenchLayout } from "../providers/WorkbenchLayoutProvider.js";
 import { useNamespaceTree } from "../../../hooks/useNamespaceTree.js";
 import WorkbenchNavigation_default from "../WorkbenchNavigation.js";
 import PipelineHistoryList_default from "./PipelineHistoryList.js";
+import { WorkbenchSecretsPanel } from "./WorkbenchSecretsPanel.js";
 import { c } from "react/compiler-runtime";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { X } from "lucide-react";
 var PANEL_TITLES = {
 	navigation: "Navigate",
-	history: "Run Log"
+	history: "Run Log",
+	secrets: "Secrets"
 };
 function NavigationContent() {
-	let e = c(3), { pipeline: f } = useWorkbenchLayout(), p;
-	e[0] === Symbol.for("react.memo_cache_sentinel") ? (p = { "--sidebar-width": "100%" }, e[0] = p) : p = e[0];
-	let m;
-	return e[1] === f.id ? m = e[2] : (m = /* @__PURE__ */ jsx(SidebarProvider, {
+	let e = c(3), { pipeline: p } = useWorkbenchLayout(), m;
+	e[0] === Symbol.for("react.memo_cache_sentinel") ? (m = { "--sidebar-width": "100%" }, e[0] = m) : m = e[0];
+	let h;
+	return e[1] === p.id ? h = e[2] : (h = /* @__PURE__ */ jsx(SidebarProvider, {
 		defaultOpen: !0,
 		className: "min-h-0",
-		style: p,
+		style: m,
 		children: /* @__PURE__ */ jsx("div", {
 			className: "w-full overflow-auto p-2",
-			children: /* @__PURE__ */ jsx(SidebarMenu, { children: /* @__PURE__ */ jsx(NavigationContentInner, { pipelineId: f.id }) })
+			children: /* @__PURE__ */ jsx(SidebarMenu, { children: /* @__PURE__ */ jsx(NavigationContentInner, { pipelineId: p.id }) })
 		})
-	}), e[1] = f.id, e[2] = m), m;
+	}), e[1] = p.id, e[2] = h), h;
 }
 function NavigationContentInner(e) {
-	let l = c(3), { pipelineId: u } = e, d = useNamespaceTree(u);
-	if (!d || d.length === 0) {
+	let u = c(3), { pipelineId: d } = e, f = useNamespaceTree(d);
+	if (!f || f.length === 0) {
 		let e;
-		return l[0] === Symbol.for("react.memo_cache_sentinel") ? (e = /* @__PURE__ */ jsx("div", {
+		return u[0] === Symbol.for("react.memo_cache_sentinel") ? (e = /* @__PURE__ */ jsx("div", {
 			className: "text-muted-foreground py-4 text-center text-sm",
 			children: "No navigation items"
-		}), l[0] = e) : e = l[0], e;
+		}), u[0] = e) : e = u[0], e;
 	}
-	let m;
-	return l[1] === d ? m = l[2] : (m = /* @__PURE__ */ jsx(WorkbenchNavigation_default, {
-		namespaceTree: d,
+	let h;
+	return u[1] === f ? h = u[2] : (h = /* @__PURE__ */ jsx(WorkbenchNavigation_default, {
+		namespaceTree: f,
 		indent: 0
-	}), l[1] = d, l[2] = m), m;
+	}), u[1] = f, u[2] = h), h;
 }
 function HistoryContent() {
-	let e = c(2), { pipeline: l } = useWorkbenchLayout(), u;
-	return e[0] === l ? u = e[1] : (u = /* @__PURE__ */ jsx("div", {
+	let e = c(2), { pipeline: u } = useWorkbenchLayout(), d;
+	return e[0] === u ? d = e[1] : (d = /* @__PURE__ */ jsx("div", {
 		className: "overflow-auto p-2",
-		children: /* @__PURE__ */ jsx(PipelineHistoryList_default, { pipeline: l })
-	}), e[0] = l, e[1] = u), u;
+		children: /* @__PURE__ */ jsx(PipelineHistoryList_default, { pipeline: u })
+	}), e[0] = u, e[1] = d), d;
 }
 function WorkbenchFloatingPanel() {
-	let l = c(19), { activeFloatingPanel: u, closeFloatingPanel: f } = useWorkbenchLayout();
-	if (!u) return null;
-	let p;
-	l[0] === Symbol.for("react.memo_cache_sentinel") ? (p = cn("border-l bg-background absolute right-0 top-0 bottom-0 z-20 flex w-80 flex-col shadow-lg", "animate-in slide-in-from-right duration-200"), l[0] = p) : p = l[0];
-	let m = PANEL_TITLES[u], h;
-	l[1] === m ? h = l[2] : (h = /* @__PURE__ */ jsx("span", {
+	let u = c(22), { activeFloatingPanel: d, closeFloatingPanel: p } = useWorkbenchLayout();
+	if (!d) return null;
+	let m;
+	u[0] === Symbol.for("react.memo_cache_sentinel") ? (m = cn("border-l bg-background absolute right-0 top-0 bottom-0 z-20 flex w-80 flex-col shadow-lg", "animate-in slide-in-from-right duration-200"), u[0] = m) : m = u[0];
+	let h = PANEL_TITLES[d], g;
+	u[1] === h ? g = u[2] : (g = /* @__PURE__ */ jsx("span", {
 		className: "text-sm font-medium",
-		children: m
-	}), l[1] = m, l[2] = h);
-	let g;
-	l[3] === Symbol.for("react.memo_cache_sentinel") ? (g = /* @__PURE__ */ jsx(X, { className: "h-4 w-4" }), l[3] = g) : g = l[3];
+		children: h
+	}), u[1] = h, u[2] = g);
 	let _;
-	l[4] === f ? _ = l[5] : (_ = /* @__PURE__ */ jsx("button", {
-		onClick: f,
-		className: "text-muted-foreground hover:text-foreground flex h-8 w-8 items-center justify-center rounded-md transition-colors hover:cursor-pointer",
-		children: g
-	}), l[4] = f, l[5] = _);
+	u[3] === Symbol.for("react.memo_cache_sentinel") ? (_ = /* @__PURE__ */ jsx(X, { className: "h-4 w-4" }), u[3] = _) : _ = u[3];
 	let v;
-	l[6] !== h || l[7] !== _ ? (v = /* @__PURE__ */ jsxs("div", {
-		className: "border-b flex h-12 shrink-0 items-center justify-between px-3",
-		children: [h, _]
-	}), l[6] = h, l[7] = _, l[8] = v) : v = l[8];
+	u[4] === p ? v = u[5] : (v = /* @__PURE__ */ jsx("button", {
+		onClick: p,
+		className: "text-muted-foreground hover:text-foreground flex h-8 w-8 items-center justify-center rounded-md transition-colors hover:cursor-pointer",
+		children: _
+	}), u[4] = p, u[5] = v);
 	let y;
-	l[9] === u ? y = l[10] : (y = u === "navigation" && /* @__PURE__ */ jsx(NavigationContent, {}), l[9] = u, l[10] = y);
+	u[6] !== g || u[7] !== v ? (y = /* @__PURE__ */ jsxs("div", {
+		className: "border-b flex h-12 shrink-0 items-center justify-between px-3",
+		children: [g, v]
+	}), u[6] = g, u[7] = v, u[8] = y) : y = u[8];
 	let b;
-	l[11] === u ? b = l[12] : (b = u === "history" && /* @__PURE__ */ jsx(HistoryContent, {}), l[11] = u, l[12] = b);
+	u[9] === d ? b = u[10] : (b = d === "navigation" && /* @__PURE__ */ jsx(NavigationContent, {}), u[9] = d, u[10] = b);
 	let x;
-	l[13] !== y || l[14] !== b ? (x = /* @__PURE__ */ jsxs("div", {
-		className: "flex-1 overflow-hidden",
-		children: [y, b]
-	}), l[13] = y, l[14] = b, l[15] = x) : x = l[15];
+	u[11] === d ? x = u[12] : (x = d === "history" && /* @__PURE__ */ jsx(HistoryContent, {}), u[11] = d, u[12] = x);
 	let S;
-	return l[16] !== v || l[17] !== x ? (S = /* @__PURE__ */ jsxs("div", {
-		className: p,
-		children: [v, x]
-	}), l[16] = v, l[17] = x, l[18] = S) : S = l[18], S;
+	u[13] === d ? S = u[14] : (S = d === "secrets" && /* @__PURE__ */ jsx(WorkbenchSecretsPanel, {}), u[13] = d, u[14] = S);
+	let C;
+	u[15] !== b || u[16] !== x || u[17] !== S ? (C = /* @__PURE__ */ jsxs("div", {
+		className: "flex-1 overflow-hidden",
+		children: [
+			b,
+			x,
+			S
+		]
+	}), u[15] = b, u[16] = x, u[17] = S, u[18] = C) : C = u[18];
+	let w;
+	return u[19] !== y || u[20] !== C ? (w = /* @__PURE__ */ jsxs("div", {
+		className: m,
+		children: [y, C]
+	}), u[19] = y, u[20] = C, u[21] = w) : w = u[21], w;
 }
 export { WorkbenchFloatingPanel };

package/dist/features/workbench/components/WorkbenchFlowPanel.js

@@ -1,10 +1,10 @@
 import { usePipeline, usePipelineConfigByName } from "../../../hooks/usePipelines.js";
 import { useWorkspace } from "../../../hooks/useWorkspaces.js";
-import { ReactFlowProvider } from "../../../node_modules/@xyflow/react/dist/esm/index.js";
 import { useFetchWorkflowsByPipeline } from "../../../hooks/useWorkflows.js";
+import { useWorkbenchLayout } from "../providers/WorkbenchLayoutProvider.js";
+import { ReactFlowProvider } from "../../../node_modules/@xyflow/react/dist/esm/index.js";
 import PipelineFlowViewer_default from "../../debug/components/PipelineFlowViewer.js";
 import "../../debug/index.js";
-import { useWorkbenchLayout } from "../providers/WorkbenchLayoutProvider.js";
 import { c } from "react/compiler-runtime";
 import { useMemo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";