@loopstack/loopstack-studio 0.21.3 → 0.23.0

package/dist/features/workbench/Workbench.js

@@ -1,101 +1,123 @@
 import { useWorkspace } from "../../hooks/useWorkspaces.js";
-import { SidebarInsetDiv, SidebarProvider, SidebarTrigger } from "../../components/ui/sidebar.js";
-import { FileContentViewer } from "../code-explorer/components/FileContentViewer.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 { useNamespaceTree } from "../../hooks/useNamespaceTree.js";
-import { WorkbenchContextProvider } from "./providers/WorkbenchContextProvider.js";
+import "../code-explorer/index.js";
+import { WorkbenchLayoutProvider, useWorkbenchLayout } from "./providers/WorkbenchLayoutProvider.js";
 import WorkflowList_default from "./WorkflowList.js";
 import { ScrollProvider } from "./providers/ScrollProvider.js";
-import WorkbenchSidebar_default from "./components/WorkbenchSidebar.js";
+import { WorkbenchFloatingPanel } from "./components/WorkbenchFloatingPanel.js";
+import { WorkbenchFlowPanel } from "./components/WorkbenchFlowPanel.js";
+import { WorkbenchIconSidebar } from "./components/WorkbenchIconSidebar.js";
+import { WorkbenchPreviewPanel } from "./components/WorkbenchPreviewPanel.js";
 import { c } from "react/compiler-runtime";
-import { useCallback, useMemo, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-function WorkbenchContent(e) {
-	let a = c(11), { pipeline: o } = e, { openFiles: s, selectedFile: u, fileContent: p, workflowConfig: m, isContentLoading: _ } = useCodeExplorerContext(), v;
-	a[0] === o ? v = a[1] : (v = /* @__PURE__ */ jsx("div", {
-		className: "flex-1 overflow-hidden",
-		children: /* @__PURE__ */ jsx(ScrollProvider, { children: /* @__PURE__ */ jsx("div", {
-			className: "flex h-full flex-col",
-			children: /* @__PURE__ */ jsx("div", {
-				className: "flex-1 overflow-hidden",
-				children: /* @__PURE__ */ jsx(WorkflowList_default, { pipeline: o })
-			})
-		}) })
-	}), a[0] = o, a[1] = v);
-	let y;
-	a[2] !== p || a[3] !== _ || a[4] !== s.length || a[5] !== u || a[6] !== m ? (y = s.length > 0 && /* @__PURE__ */ jsxs("div", {
+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", {
+		className: "border-b flex h-12 shrink-0 items-center",
+		children: u ? /* @__PURE__ */ jsx(PageBreadcrumbs_default, { breadcrumbData: u }) : /* @__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", {
+		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: u,
-				content: p,
-				workflowConfig: m,
-				isLoading: _,
+				selectedFile: m,
+				content: h,
+				workflowConfig: g,
+				isLoading: v,
 				className: "h-full"
 			})
 		})]
-	}), a[2] = p, a[3] = _, a[4] = s.length, a[5] = u, a[6] = m, a[7] = y) : y = a[7];
-	let b;
-	return a[8] !== v || a[9] !== y ? (b = /* @__PURE__ */ jsx("div", {
+	}), 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", {
 		className: "flex h-full flex-col",
 		children: /* @__PURE__ */ jsxs("div", {
 			className: "flex flex-1 gap-4 overflow-hidden md:flex-row flex-col",
-			children: [v, y]
+			children: [x, S]
 		})
-	}), a[8] = v, a[9] = y, a[10] = b) : b = a[10], b;
+	}), i[13] = x, i[14] = S, i[15] = C) : C = i[15], C;
 }
-function Workbench(l) {
-	let d = c(23), { pipeline: f } = l, h = useNamespaceTree(f?.id), g = f?.workspaceId, v = useWorkspace(g), y;
-	d[0] === Symbol.for("react.memo_cache_sentinel") ? (y = { activeSectionId: null }, d[0] = y) : y = d[0];
-	let [x, S] = useState(y), C;
-	d[1] === Symbol.for("react.memo_cache_sentinel") ? (C = (e) => {
-		S({ activeSectionId: e });
-	}, d[1] = C) : C = d[1];
-	let w = C, T;
-	d[2] === x ? T = d[3] : (T = {
-		state: x,
-		setActiveSectionId: w
-	}, d[2] = x, d[3] = T);
-	let E = T, D = v.data?.features?.fileExplorer?.enabled ?? !1, O = f?.id, k;
-	d[4] === Symbol.for("react.memo_cache_sentinel") ? (k = /* @__PURE__ */ jsx(SidebarTrigger, { className: "fixed top-0 right-0 z-40 flex h-8 w-8 items-center justify-center p-8 hover:cursor-pointer md:hidden" }), d[4] = k) : k = d[4];
-	let A;
-	d[5] === f ? A = d[6] : (A = /* @__PURE__ */ jsx(SidebarInsetDiv, { children: /* @__PURE__ */ jsx("div", {
-		className: "flex-1",
-		children: /* @__PURE__ */ jsx(WorkbenchContent, { pipeline: f })
-	}) }), d[5] = f, d[6] = A);
-	let j;
-	d[7] === v.data ? j = d[8] : (j = v.data ? {
-		volumes: v.data.volumes,
-		features: v.data.features
-	} : void 0, d[7] = v.data, d[8] = j);
-	let M;
-	d[9] !== h || d[10] !== f || d[11] !== j ? (M = /* @__PURE__ */ jsx(WorkbenchSidebar_default, {
-		namespaceTree: h,
-		pipeline: f,
-		workspaceConfig: j
-	}), d[9] = h, d[10] = f, d[11] = j, d[12] = M) : M = d[12];
-	let N;
-	d[13] !== A || d[14] !== M ? (N = /* @__PURE__ */ jsxs(SidebarProvider, {
-		defaultOpen: !0,
-		className: "workbench-sidebar min-h-0",
+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, {
+		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);
+	let y;
+	r[8] === o ? y = r[9] : (y = o === "flow" && /* @__PURE__ */ jsx(WorkbenchFlowPanel, {}), r[8] = o, r[9] = y);
+	let b;
+	r[10] === Symbol.for("react.memo_cache_sentinel") ? (b = /* @__PURE__ */ jsx(WorkbenchFloatingPanel, {}), r[10] = b) : b = r[10];
+	let x;
+	r[11] !== d || r[12] !== f || r[13] !== y ? (x = /* @__PURE__ */ jsxs("div", {
+		className: "relative flex flex-1 overflow-hidden",
 		children: [
-			k,
-			A,
-			M
+			d,
+			f,
+			y,
+			b
 		]
-	}), d[13] = A, d[14] = M, d[15] = N) : N = d[15];
-	let P;
-	d[16] !== D || d[17] !== O || d[18] !== N ? (P = /* @__PURE__ */ jsx(CodeExplorerProvider, {
-		pipelineId: O,
-		fileExplorerEnabled: D,
-		children: N
-	}), d[16] = D, d[17] = O, d[18] = N, d[19] = P) : P = d[19];
-	let F;
-	return d[20] !== E || d[21] !== P ? (F = /* @__PURE__ */ jsx(WorkbenchContextProvider.Provider, {
-		value: E,
-		children: P
-	}), d[20] = E, d[21] = P, d[22] = F) : F = d[22], F;
+	}), 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", {
+		className: "flex h-full w-full",
+		children: [x, S]
+	}), r[16] = x, r[17] = C), C;
+}
+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, {
+		pipeline: o,
+		breadcrumbData: s
+	}), a[2] = s, a[3] = o, a[4] = w) : w = a[4];
+	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, {
+		pipeline: o,
+		isDeveloperMode: f,
+		workspaceConfig: x,
+		getPreviewUrl: p,
+		getEnvironmentPreviewUrl: m,
+		environments: S,
+		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;
 }
 export { Workbench as default };

package/dist/features/workbench/WorkflowItem.js

@@ -1,67 +1,72 @@
-import { useFilterDocuments } from "../../hooks/useDocuments.js";
-import { useWorkflow } from "../../hooks/useWorkflows.js";
 import { cn } from "../../lib/utils.js";
-import ErrorSnackbar_default from "../../components/snackbars/ErrorSnackbar.js";
-import LoadingCentered_default from "../../components/LoadingCentered.js";
-import { useRunPipeline } from "../../hooks/useProcessor.js";
-import DocumentList_default from "./components/DocumentList.js";
+import LoadingCentered_default from "../../components/feedback/LoadingCentered.js";
+import ErrorSnackbar_default from "../../components/feedback/ErrorSnackbar.js";
+import ErrorAlert_default from "../../components/feedback/ErrorAlert.js";
+import DocumentList_default from "../documents/components/DocumentList.js";
+import "../documents/index.js";
 import WorkflowForms_default from "./components/WorkflowForms.js";
-import ErrorAlert_default from "../../components/content/ErrorAlert.js";
-import WorkflowButtons_default from "./components/buttons/WorkflowButtons.js";
-import React, { useCallback, useEffect, useMemo } from "react";
+import { useWorkflowData } from "./hooks/useWorkflowData.js";
+import { c } from "react/compiler-runtime";
+import React, { useEffect } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useParams } from "react-router-dom";
-var WorkflowItem_default = ({ pipeline: g, workflowId: _, scrollTo: v, settings: y, embed: b }) => {
-	let { workflowId: x, clickId: S } = useParams(), C = useWorkflow(_), w = useFilterDocuments(_);
-	useEffect(() => {
-		x === _ && C.isSuccess && w.isSuccess && v(_);
-	}, [
-		C.isSuccess,
-		w.isSuccess,
-		_,
+var WorkflowItem_default = (p) => {
+	let m = c(46), { 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
+	}, m[0] = v.showFullMessageHistory, m[1] = g, m[2] = S) : S = m[2];
+	let { workflow: C, workflowLoading: w, workflowReady: T, workflowError: E, documents: D, documentsLoading: O, documentsReady: k, documentsError: A, isLoading: j, handleRun: M } = useWorkflowData(S), N;
+	m[3] !== k || m[4] !== b || m[5] !== _ || m[6] !== g || m[7] !== T ? (N = () => {
+		b === g && T && k && _(g);
+	}, m[3] = k, m[4] = b, m[5] = _, m[6] = g, m[7] = T, m[8] = N) : N = m[8];
+	let P;
+	m[9] !== x || m[10] !== k || m[11] !== b || m[12] !== _ || m[13] !== g || m[14] !== T ? (P = [
+		T,
+		k,
+		g,
+		b,
 		x,
-		S,
-		v
-	]);
-	let T = useCallback((e) => {
-		let p = e.meta, m = e.ui, h = p?.hidden || m?.hidden || !!p?.hideAtPlaces?.includes(C.data?.place ?? "");
-		return !y.showFullMessageHistory && e.tags?.includes("internal") && (h = !0), !h;
-	}, [C.data, y.showFullMessageHistory]), E = useMemo(() => w.data ? w.data.filter(T) : [], [w.data, T]), D = useRunPipeline(), O = (e, p) => {
-		D.mutate({
-			pipelineId: C.data.pipelineId,
-			runPipelinePayloadDto: { transition: {
-				id: e,
-				workflowId: _,
-				payload: p
-			} }
-		});
-	}, k = D.isPending || C.data?.status === "running";
-	return /* @__PURE__ */ jsxs("div", {
-		className: cn("flex flex-col", b ? "p-0" : "min-h-[calc(100vh-16rem)] p-4"),
+		_
+	], m[9] = x, m[10] = k, m[11] = b, m[12] = _, m[13] = g, m[14] = T, m[15] = P) : P = m[15], useEffect(N, P);
+	let F = y ? "p-0" : "p-4", I;
+	m[16] === F ? I = m[17] : (I = cn("flex flex-col", F), m[16] = F, m[17] = I);
+	let L = w || O, R;
+	m[18] === L ? R = m[19] : (R = /* @__PURE__ */ jsx(LoadingCentered_default, { loading: L }), m[18] = L, m[19] = R);
+	let z;
+	m[20] === A ? z = m[21] : (z = /* @__PURE__ */ jsx(ErrorSnackbar_default, { error: A }), m[20] = A, m[21] = z);
+	let B;
+	m[22] === E ? B = m[23] : (B = /* @__PURE__ */ jsx(ErrorAlert_default, { error: E }), m[22] = E, m[23] = B);
+	let V;
+	m[24] !== D || m[25] !== j || m[26] !== h || m[27] !== _ || m[28] !== v || m[29] !== C || m[30] !== T ? (V = T && C && /* @__PURE__ */ jsx(DocumentList_default, {
+		pipeline: h,
+		workflow: C,
+		documents: D,
+		scrollTo: _,
+		settings: v,
+		isLoading: j
+	}), m[24] = D, m[25] = j, m[26] = h, m[27] = _, m[28] = v, m[29] = C, m[30] = T, m[31] = V) : V = m[31];
+	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", {
+		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];
+	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", {
+		className: I,
 		children: [
-			/* @__PURE__ */ jsx(LoadingCentered_default, { loading: C.isLoading || w.isLoading }),
-			/* @__PURE__ */ jsx(ErrorSnackbar_default, { error: w.error }),
-			/* @__PURE__ */ jsx(ErrorAlert_default, { error: C.data?.errorMessage }),
-			C.isSuccess && /* @__PURE__ */ jsx(DocumentList_default, {
-				pipeline: g,
-				workflow: C.data,
-				documents: E,
-				scrollTo: v,
-				settings: y,
-				isLoading: k
-			}),
-			/* @__PURE__ */ jsx(LoadingCentered_default, { loading: k }),
-			!!C.data && !b && /* @__PURE__ */ jsxs("div", {
-				className: "mt-auto flex flex-col gap-6 pt-12",
-				children: [/* @__PURE__ */ jsx(WorkflowForms_default, {
-					workflow: C.data,
-					onSubmit: O
-				}), /* @__PURE__ */ jsx(WorkflowButtons_default, {
-					pipeline: g,
-					workflow: C.data
-				})]
-			})
+			R,
+			z,
+			B,
+			V,
+			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;
 };
 export { WorkflowItem_default as default };

package/dist/features/workbench/WorkflowList.js

@@ -1,110 +1,90 @@
-import { useFetchWorkflowsByPipeline } from "../../hooks/useWorkflows.js";
 import { cn } from "../../lib/utils.js";
 import { Button } from "../../components/ui/button.js";
-import ErrorSnackbar_default from "../../components/snackbars/ErrorSnackbar.js";
-import LoadingCentered_default from "../../components/LoadingCentered.js";
+import LoadingCentered_default from "../../components/feedback/LoadingCentered.js";
+import ErrorSnackbar_default from "../../components/feedback/ErrorSnackbar.js";
+import { useFetchWorkflowsByPipeline } from "../../hooks/useWorkflows.js";
 import WorkflowItem_default from "./WorkflowItem.js";
-import { useScrollToBottom } from "./hooks/useAutoScrollBottom.js";
-import { useIntersectionObserver } from "./hooks/useIntersectionObserver.js";
-import { useScrollToListItem } from "./hooks/useScrollToListItem.js";
-import { WorkbenchContextProvider } from "./providers/WorkbenchContextProvider.js";
 import WorkbenchSettingsModal_default from "./components/WorkbenchSettingsModal.js";
+import WorkflowButtons_default from "./components/buttons/WorkflowButtons.js";
+import { useWorkflowListState } from "./hooks/useWorkflowListState.js";
 import { c } from "react/compiler-runtime";
-import React, { useContext, useEffect, useState } from "react";
+import React, { useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { ArrowDownIcon, ChevronDownIcon, ChevronRightIcon, LayersIcon } from "lucide-react";
-var WorkflowList_default = (S) => {
-	let C = c(33), { pipeline: w } = S, T = useFetchWorkflowsByPipeline(w.id), [E, D] = useState(!1), O;
-	C[0] === Symbol.for("react.memo_cache_sentinel") ? (O = {}, C[0] = O) : O = C[0];
-	let [k, A] = useState(O), j;
-	C[1] === Symbol.for("react.memo_cache_sentinel") ? (j = {
+import { ArrowDownIcon, ChevronRightIcon, Play } from "lucide-react";
+var WorkflowList_default = (_) => {
+	let v = c(24), { pipeline: y } = _, b = useFetchWorkflowsByPipeline(y.id), [x, S] = useState(!1), C;
+	v[0] === Symbol.for("react.memo_cache_sentinel") ? (C = {
 		enableDebugMode: !1,
 		showFullMessageHistory: !1
-	}, C[1] = j) : j = C[1];
-	let [M, N] = useState(j), { activeId: P, observe: F } = useIntersectionObserver("0px 0px 0px 0px"), { listRef: I, scrollTo: L } = useScrollToListItem(), { canScrollDown: R, scrollToBottom: z } = useScrollToBottom(), B = useContext(WorkbenchContextProvider), V, H;
-	C[2] !== P || C[3] !== B ? (V = () => {
-		B && B.setActiveSectionId && B.state.activeSectionId !== P && (B.setActiveSectionId(P), P && A((t) => ({
-			...t,
-			[P]: !0
-		})));
-	}, H = [P, B], C[2] = P, C[3] = B, C[4] = V, C[5] = H) : (V = C[4], H = C[5]), useEffect(V, H);
-	let U, W;
-	C[6] !== P || C[7] !== T.data ? (U = () => {
-		if (T.data && T.data.length > 0) {
-			let t = T.data.length - 1, y = T.data[t], b = `section-${y.index}-${y.id}`;
-			A({
-				[b]: !0,
-				...P && P !== b ? { [P]: !0 } : {}
-			});
-		}
-	}, W = [T.data, P], C[6] = P, C[7] = T.data, C[8] = U, C[9] = W) : (U = C[8], W = C[9]), useEffect(U, W);
-	let G;
-	C[10] === Symbol.for("react.memo_cache_sentinel") ? (G = (t) => {
-		A((y) => ({
-			...y,
-			[t]: !y[t]
-		}));
-	}, C[10] = G) : G = C[10];
-	let K = G, q;
-	C[11] !== R || C[12] !== z ? (q = R && /* @__PURE__ */ jsx(Button, {
+	}, v[0] = C) : C = v[0];
+	let [w, T] = useState(C), { activeId: E, expandedSections: D, observe: O, listRef: k, scrollTo: A, canScrollDown: j, scrollToBottom: M, toggleSection: N } = useWorkflowListState(b.data), P;
+	v[1] !== j || v[2] !== M ? (P = j && /* @__PURE__ */ jsx(Button, {
 		variant: "outline",
 		size: "icon",
-		onClick: z,
+		onClick: M,
 		className: "bg-background/80 fixed right-[calc(var(--sidebar-width)+1.5rem)] bottom-6 z-50 rounded-full shadow-md backdrop-blur-sm",
 		children: /* @__PURE__ */ jsx(ArrowDownIcon, { className: "size-4" })
-	}), C[11] = R, C[12] = z, C[13] = q) : q = C[13];
-	let J;
-	C[14] === T.isLoading ? J = C[15] : (J = /* @__PURE__ */ jsx(LoadingCentered_default, { loading: T.isLoading }), C[14] = T.isLoading, C[15] = J);
-	let Y;
-	C[16] === T.error ? Y = C[17] : (Y = /* @__PURE__ */ jsx(ErrorSnackbar_default, { error: T.error }), C[16] = T.error, C[17] = Y);
-	let X;
-	C[18] !== P || C[19] !== k || C[20] !== T.data || C[21] !== I || C[22] !== F || C[23] !== E || C[24] !== w || C[25] !== L || C[26] !== M ? (X = T.data ? /* @__PURE__ */ jsx("div", {
+	}), v[1] = j, v[2] = M, v[3] = P) : P = v[3];
+	let F;
+	v[4] === b.isLoading ? F = v[5] : (F = /* @__PURE__ */ jsx(LoadingCentered_default, { loading: b.isLoading }), v[4] = b.isLoading, v[5] = F);
+	let I;
+	v[6] === b.error ? I = v[7] : (I = /* @__PURE__ */ jsx(ErrorSnackbar_default, { error: b.error }), v[6] = b.error, v[7] = I);
+	let L;
+	v[8] !== E || v[9] !== D || v[10] !== b.data || v[11] !== k || v[12] !== O || v[13] !== x || v[14] !== y || v[15] !== A || v[16] !== w || v[17] !== N ? (L = b.data ? /* @__PURE__ */ jsx("div", {
 		className: "mb-10",
-		ref: I,
-		children: /* @__PURE__ */ jsx("div", { children: T.data.map((t) => {
-			let b = `section-${t.index}-${t.id}`, x = P === b;
+		ref: k,
+		children: /* @__PURE__ */ jsx("div", { children: b.data.map((f) => {
+			let p = `section-${f.index}-${f.id}`, m = E === p, h = b.data.length === 1, g = h || D[p];
 			return /* @__PURE__ */ jsxs("div", {
-				ref: (t) => F(t),
-				"data-id": b,
-				className: "space-y-0",
+				ref: (i) => O(i),
+				"data-id": p,
 				children: [/* @__PURE__ */ jsx("div", {
 					className: "bg-background/95 supports-[backdrop-filter]:bg-background/60 sticky top-0 z-10 backdrop-blur",
 					children: /* @__PURE__ */ jsxs("div", {
-						className: "mb-4 flex items-center gap-2 py-2 px-3 cursor-pointer border-b border-border bg-muted/50 rounded-t-sm",
-						onClick: () => K(b),
+						role: "button",
+						tabIndex: h ? void 0 : 0,
+						className: cn("flex w-full items-center gap-2 rounded-md p-2 px-3 text-left text-sm font-medium", !h && "hover:bg-accent hover:text-accent-foreground cursor-pointer", h && "cursor-default"),
+						onClick: h ? void 0 : () => N(p),
+						onKeyDown: h ? void 0 : (i) => {
+							(i.key === "Enter" || i.key === " ") && (i.preventDefault(), N(p));
+						},
 						children: [
-							k[b] ? /* @__PURE__ */ jsx(ChevronDownIcon, { className: cn("size-4", x ? "text-primary" : "text-muted-foreground") }) : /* @__PURE__ */ jsx(ChevronRightIcon, { className: cn("size-4", x ? "text-primary" : "text-muted-foreground") }),
-							/* @__PURE__ */ jsx(LayersIcon, { className: cn("size-4", x ? "text-primary" : "text-muted-foreground") }),
+							/* @__PURE__ */ jsx(Play, { className: "text-primary h-3.5 w-3.5 fill-current" }),
 							/* @__PURE__ */ jsx("span", {
-								className: cn("text-base font-medium transition-colors flex-1", x ? "text-primary" : "text-muted-foreground text-gray-400"),
-								children: t.title ?? t.blockName
+								className: "flex-1 truncate text-sm",
+								children: f.title ?? f.blockName
+							}),
+							/* @__PURE__ */ jsx(WorkflowButtons_default, {
+								pipeline: y,
+								workflowId: f.id
+							}),
+							m && /* @__PURE__ */ jsx(WorkbenchSettingsModal_default, {
+								settings: w,
+								onSettingsChange: T,
+								open: x,
+								onOpenChange: S
 							}),
-							x && /* @__PURE__ */ jsx(WorkbenchSettingsModal_default, {
-								settings: M,
-								onSettingsChange: N,
-								open: E,
-								onOpenChange: D
-							})
+							!h && /* @__PURE__ */ jsx(ChevronRightIcon, { className: cn("text-muted-foreground h-3.5 w-3.5 transition-transform", g && "rotate-90") })
 						]
 					})
-				}), k[b] && /* @__PURE__ */ jsx("div", {
-					className: "max-w-4xl pl-9",
+				}), g && /* @__PURE__ */ jsx("div", {
+					className: "max-w-4xl py-1",
 					children: /* @__PURE__ */ jsx(WorkflowItem_default, {
-						pipeline: w,
-						workflowId: t.id,
-						scrollTo: L,
-						settings: M
+						pipeline: y,
+						workflowId: f.id,
+						scrollTo: A,
+						settings: w
 					})
 				})]
-			}, t.id);
+			}, f.id);
 		}) })
-	}) : null, C[18] = P, C[19] = k, C[20] = T.data, C[21] = I, C[22] = F, C[23] = E, C[24] = w, C[25] = L, C[26] = M, C[27] = X) : X = C[27];
-	let Z;
-	return C[28] !== Y || C[29] !== X || C[30] !== q || C[31] !== J ? (Z = /* @__PURE__ */ jsxs("div", { children: [
-		q,
-		J,
-		Y,
-		X
-	] }), C[28] = Y, C[29] = X, C[30] = q, C[31] = J, C[32] = Z) : Z = C[32], Z;
+	}) : null, v[8] = E, v[9] = D, v[10] = b.data, v[11] = k, v[12] = O, v[13] = x, v[14] = y, v[15] = A, v[16] = w, v[17] = N, v[18] = L) : L = v[18];
+	let R;
+	return v[19] !== P || v[20] !== F || v[21] !== I || v[22] !== L ? (R = /* @__PURE__ */ jsxs("div", { children: [
+		P,
+		F,
+		I,
+		L
+	] }), v[19] = P, v[20] = F, v[21] = I, v[22] = L, v[23] = R) : R = v[23], R;
 };
 export { WorkflowList_default as default };