@loopstack/loopstack-studio 0.25.1 → 0.25.2

package/dist/pages/PreviewWorkbenchPage.js

@@ -1,158 +1,200 @@
-import { useStudio as e } from "../providers/StudioProvider.js";
-import { useFilterWorkflows as t, useWorkflow as n, useWorkflowConfigByName as r } from "../hooks/useWorkflows.js";
-import { Button as i } from "../components/ui/button.js";
-import a from "../components/feedback/LoadingCentered.js";
-import o from "../components/feedback/ErrorSnackbar.js";
-import { require_enums as s } from "../packages/contracts/dist/enums/index.js";
-import c from "../features/workbench/WorkflowItem.js";
-import { ReactFlowProvider as l } from "../node_modules/@xyflow/react/dist/esm/index.js";
-import u from "../features/debug/components/WorkflowFlowViewer.js";
+import { useStudio } from "../providers/StudioProvider.js";
+import { useFilterWorkflows, useWorkflow, useWorkflowConfigByName } from "../hooks/useWorkflows.js";
+import { Button } from "../components/ui/button.js";
+import LoadingCentered_default from "../components/feedback/LoadingCentered.js";
+import ErrorSnackbar_default from "../components/feedback/ErrorSnackbar.js";
+import { require_enums } from "../packages/contracts/dist/enums/index.js";
+import WorkflowItem_default from "../features/workbench/WorkflowItem.js";
+import { ReactFlowProvider } from "../node_modules/@xyflow/react/dist/esm/index.js";
+import WorkflowFlowViewer_default from "../features/debug/components/WorkflowFlowViewer.js";
 import "../features/debug/index.js";
-import d from "../features/workbench/components/WorkflowHistoryList.js";
-import { NewRunDialog as f } from "../features/workbench/components/NewRunDialog.js";
+import WorkflowHistoryList_default from "../features/workbench/components/WorkflowHistoryList.js";
+import { NewRunDialog } from "../features/workbench/components/NewRunDialog.js";
 import "../features/workbench/index.js";
-import { useCallback as p, useEffect as m, useMemo as h, useRef as g, useState as _ } from "react";
-import { jsx as v, jsxs as y } from "react/jsx-runtime";
-import { useQuery as b } from "@tanstack/react-query";
-import { useNavigate as x, useParams as S } from "react-router-dom";
-import { ChevronDown as C, ListOrdered as w, Loader2 as T, Play as E, RefreshCw as D, ScrollText as O, Workflow as k } from "lucide-react";
-import { formatDistanceToNow as A } from "date-fns";
-//#region src/pages/PreviewWorkbenchPage.tsx
-var j = s(), M = "loopstack:embed:workflow-completed", N = "loopstack:embed:resize", P = "loopstack:embed:new-run";
-function F() {
-	let { workflowId: e } = S(), [t, n] = _(!1), r = p((e) => {
-		n(!1), window.parent !== window && window.parent.postMessage({
-			type: P,
+import { c } from "react/compiler-runtime";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useQuery } from "@tanstack/react-query";
+import { useNavigate, useParams } from "react-router-dom";
+import { ChevronDown, ListOrdered, Loader2, Play, RefreshCw, ScrollText, Workflow } from "lucide-react";
+import { formatDistanceToNow } from "date-fns";
+var import_enums = require_enums(), EMBED_MESSAGE_TYPE = "loopstack:embed:workflow-completed", EMBED_RESIZE_MESSAGE_TYPE = "loopstack:embed:resize", EMBED_NEW_RUN_MESSAGE_TYPE = "loopstack:embed:new-run";
+function PreviewWorkbenchPage() {
+	let e = c(5), { workflowId: t } = useParams(), [n, r] = useState(!1), i;
+	e[0] === Symbol.for("react.memo_cache_sentinel") ? (i = (e) => {
+		r(!1), window.parent !== window && window.parent.postMessage({
+			type: EMBED_NEW_RUN_MESSAGE_TYPE,
 			workflowId: e
 		}, window.location.origin);
-	}, []);
-	return e ? /* @__PURE__ */ v(I, {
-		workflowId: e,
-		onNewRunSuccess: r
-	}) : /* @__PURE__ */ v(R, {
-		newRunDialogOpen: t,
-		onNewRunDialogOpenChange: n,
-		onNewRunSuccess: r
-	});
+	}, e[0] = i) : i = e[0];
+	let a = i;
+	if (!t) {
+		let t;
+		return e[1] === n ? t = e[2] : (t = /* @__PURE__ */ jsx(PreviewEmptyState, {
+			newRunDialogOpen: n,
+			onNewRunDialogOpenChange: r,
+			onNewRunSuccess: a
+		}), e[1] = n, e[2] = t), t;
+	}
+	let o;
+	return e[3] === t ? o = e[4] : (o = /* @__PURE__ */ jsx(PreviewWorkbenchContent, {
+		workflowId: t,
+		onNewRunSuccess: a
+	}), e[3] = t, e[4] = o), o;
 }
-function I({ workflowId: e, onNewRunSuccess: t }) {
-	let s = g(null), [h, b] = _("output"), [x, S] = _(!1), C = n(e), T = g(!1), D = r(C.data?.className ?? void 0);
-	m(() => {
-		!C.data || T.current || C.data.status === j.WorkflowState.Completed && window.parent !== window && (T.current = !0, window.parent.postMessage({
-			type: M,
-			workflowId: e
+function PreviewWorkbenchContent(e) {
+	let t = c(49), { workflowId: s, onNewRunSuccess: m } = e, g = useRef(null), [v, ce] = useState("output"), [y, b] = useState(!1), S = useWorkflow(s), C = useRef(!1), E = useWorkflowConfigByName(S.data?.className ?? void 0), k, A;
+	t[0] !== S.data || t[1] !== s ? (k = () => {
+		!S.data || C.current || S.data.status === import_enums.WorkflowState.Completed && window.parent !== window && (C.current = !0, window.parent.postMessage({
+			type: EMBED_MESSAGE_TYPE,
+			workflowId: s
 		}, window.location.origin));
-	}, [C.data, e]), m(() => {
-		if (window.parent === window || !s.current) return;
-		let t = new ResizeObserver(() => {
-			if (!s.current) return;
-			let t = Math.max(document.body.scrollHeight, document.body.offsetHeight, document.documentElement.scrollHeight, document.documentElement.offsetHeight);
+	}, A = [S.data, s], t[0] = S.data, t[1] = s, t[2] = k, t[3] = A) : (k = t[2], A = t[3]), useEffect(k, A);
+	let j, M;
+	t[4] === s ? (j = t[5], M = t[6]) : (j = () => {
+		if (window.parent === window || !g.current) return;
+		let e = new ResizeObserver(() => {
+			if (!g.current) return;
+			let e = Math.max(document.body.scrollHeight, document.body.offsetHeight, document.documentElement.scrollHeight, document.documentElement.offsetHeight);
 			window.parent.postMessage({
-				type: N,
-				workflowId: e,
-				height: t
+				type: EMBED_RESIZE_MESSAGE_TYPE,
+				workflowId: s,
+				height: e
 			}, window.location.origin);
 		});
-		return t.observe(s.current), () => t.disconnect();
-	}, [e]);
-	let A = p((e) => {
-		S(!1), t(e);
-	}, [t]);
-	return /* @__PURE__ */ y("div", {
-		ref: s,
+		return e.observe(g.current), () => e.disconnect();
+	}, M = [s], t[4] = s, t[5] = j, t[6] = M), useEffect(j, M);
+	let N;
+	t[7] === m ? N = t[8] : (N = (e) => {
+		b(!1), m(e);
+	}, t[7] = m, t[8] = N);
+	let P = N, F = _temp, I;
+	t[9] === Symbol.for("react.memo_cache_sentinel") ? (I = {
+		enableDebugMode: !1,
+		showFullMessageHistory: !1
+	}, t[9] = I) : I = t[9];
+	let L = I, R;
+	t[10] === Symbol.for("react.memo_cache_sentinel") ? (R = {
+		value: "output",
+		label: "Output",
+		icon: /* @__PURE__ */ jsx(ScrollText, { className: "h-3.5 w-3.5" })
+	}, t[10] = R) : R = t[10];
+	let z;
+	t[11] === Symbol.for("react.memo_cache_sentinel") ? (z = {
+		value: "graph",
+		label: "Graph",
+		icon: /* @__PURE__ */ jsx(Workflow, { className: "h-3.5 w-3.5" })
+	}, t[11] = z) : z = t[11];
+	let B;
+	t[12] === Symbol.for("react.memo_cache_sentinel") ? (B = {
+		value: "run-log",
+		label: "Run Log",
+		icon: /* @__PURE__ */ jsx(ListOrdered, { className: "h-3.5 w-3.5" })
+	}, t[12] = B) : B = t[12];
+	let V;
+	t[13] === Symbol.for("react.memo_cache_sentinel") ? (V = [
+		R,
+		z,
+		B,
+		{
+			value: "logs",
+			label: "Logs",
+			icon: /* @__PURE__ */ jsx(ScrollText, { className: "h-3.5 w-3.5" })
+		}
+	], t[13] = V) : V = t[13];
+	let H = V, U;
+	t[14] === v ? U = t[15] : (U = /* @__PURE__ */ jsx("div", {
+		className: "bg-background flex items-center rounded-md border p-0.5",
+		children: H.map((e) => /* @__PURE__ */ jsxs("button", {
+			onClick: () => ce(e.value),
+			className: `flex items-center gap-1.5 rounded-sm px-2.5 py-1 text-xs font-medium transition-colors ${v === e.value ? "bg-foreground text-background shadow-sm" : "text-muted-foreground hover:text-foreground"}`,
+			children: [e.icon, e.label]
+		}, e.value))
+	}), t[14] = v, t[15] = U);
+	let W;
+	t[16] === Symbol.for("react.memo_cache_sentinel") ? (W = /* @__PURE__ */ jsxs(Button, {
+		variant: "outline",
+		size: "sm",
+		className: "h-7 gap-1.5",
+		onClick: () => b(!0),
+		children: [/* @__PURE__ */ jsx(Play, { className: "h-3 w-3" }), "New Run"]
+	}), t[16] = W) : W = t[16];
+	let G;
+	t[17] === U ? G = t[18] : (G = /* @__PURE__ */ jsxs("div", {
+		className: "bg-muted/50 flex h-11 shrink-0 items-center justify-between border-b px-3",
+		children: [U, W]
+	}), t[17] = U, t[18] = G);
+	let K;
+	t[19] === S.error ? K = t[20] : (K = /* @__PURE__ */ jsx(ErrorSnackbar_default, { error: S.error }), t[19] = S.error, t[20] = K);
+	let q;
+	t[21] !== v || t[22] !== S.data || t[23] !== S.isLoading ? (q = v === "output" && /* @__PURE__ */ jsx("div", {
+		className: "px-4 py-3",
+		children: /* @__PURE__ */ jsx(LoadingCentered_default, {
+			loading: S.isLoading,
+			children: S.data ? /* @__PURE__ */ jsx(WorkflowItem_default, {
+				workflow: S.data,
+				workflowId: S.data.id,
+				scrollTo: F,
+				settings: L
+			}) : null
+		})
+	}), t[21] = v, t[22] = S.data, t[23] = S.isLoading, t[24] = q) : q = t[24];
+	let J;
+	t[25] !== v || t[26] !== S.data || t[27] !== S.isLoading || t[28] !== E || t[29] !== s ? (J = v === "graph" && /* @__PURE__ */ jsx("div", {
+		className: "h-full",
+		children: /* @__PURE__ */ jsx(LoadingCentered_default, {
+			loading: S.isLoading,
+			children: S.data ? /* @__PURE__ */ jsx(ReactFlowProvider, { children: /* @__PURE__ */ jsx(WorkflowFlowViewer_default, {
+				workflowId: s,
+				workflows: [S.data],
+				workflowConfig: E.data,
+				direction: "TB"
+			}) }) : /* @__PURE__ */ jsx("div", {
+				className: "text-muted-foreground flex h-full items-center justify-center",
+				children: /* @__PURE__ */ jsx("p", {
+					className: "text-sm",
+					children: "No workflows found"
+				})
+			})
+		})
+	}), t[25] = v, t[26] = S.data, t[27] = S.isLoading, t[28] = E, t[29] = s, t[30] = J) : J = t[30];
+	let Y;
+	t[31] !== v || t[32] !== S.data ? (Y = v === "run-log" && /* @__PURE__ */ jsx("div", {
+		className: "px-4",
+		children: /* @__PURE__ */ jsx(WorkflowHistoryList_default, { workflow: S.data })
+	}), t[31] = v, t[32] = S.data, t[33] = Y) : Y = t[33];
+	let X;
+	t[34] === v ? X = t[35] : (X = v === "logs" && /* @__PURE__ */ jsx(EmbedLogsContent, {}), t[34] = v, t[35] = X);
+	let Z;
+	t[36] !== K || t[37] !== q || t[38] !== J || t[39] !== Y || t[40] !== X ? (Z = /* @__PURE__ */ jsxs("div", {
+		className: "flex-1 overflow-auto",
+		children: [
+			K,
+			q,
+			J,
+			Y,
+			X
+		]
+	}), t[36] = K, t[37] = q, t[38] = J, t[39] = Y, t[40] = X, t[41] = Z) : Z = t[41];
+	let Q;
+	t[42] !== P || t[43] !== y ? (Q = /* @__PURE__ */ jsx(NewRunDialog, {
+		open: y,
+		onOpenChange: b,
+		onSuccess: P
+	}), t[42] = P, t[43] = y, t[44] = Q) : Q = t[44];
+	let $;
+	return t[45] !== G || t[46] !== Z || t[47] !== Q ? ($ = /* @__PURE__ */ jsxs("div", {
+		ref: g,
 		className: "flex h-screen flex-col overflow-hidden",
 		children: [
-			/* @__PURE__ */ y("div", {
-				className: "bg-muted/50 flex h-11 shrink-0 items-center justify-between border-b px-3",
-				children: [/* @__PURE__ */ v("div", {
-					className: "bg-background flex items-center rounded-md border p-0.5",
-					children: [
-						{
-							value: "output",
-							label: "Output",
-							icon: /* @__PURE__ */ v(O, { className: "h-3.5 w-3.5" })
-						},
-						{
-							value: "graph",
-							label: "Graph",
-							icon: /* @__PURE__ */ v(k, { className: "h-3.5 w-3.5" })
-						},
-						{
-							value: "run-log",
-							label: "Run Log",
-							icon: /* @__PURE__ */ v(w, { className: "h-3.5 w-3.5" })
-						},
-						{
-							value: "logs",
-							label: "Logs",
-							icon: /* @__PURE__ */ v(O, { className: "h-3.5 w-3.5" })
-						}
-					].map((e) => /* @__PURE__ */ y("button", {
-						onClick: () => b(e.value),
-						className: `flex items-center gap-1.5 rounded-sm px-2.5 py-1 text-xs font-medium transition-colors ${h === e.value ? "bg-foreground text-background shadow-sm" : "text-muted-foreground hover:text-foreground"}`,
-						children: [e.icon, e.label]
-					}, e.value))
-				}), /* @__PURE__ */ y(i, {
-					variant: "outline",
-					size: "sm",
-					className: "h-7 gap-1.5",
-					onClick: () => S(!0),
-					children: [/* @__PURE__ */ v(E, { className: "h-3 w-3" }), "New Run"]
-				})]
-			}),
-			/* @__PURE__ */ y("div", {
-				className: "flex-1 overflow-auto",
-				children: [
-					/* @__PURE__ */ v(o, { error: C.error }),
-					h === "output" && /* @__PURE__ */ v("div", {
-						className: "px-4 py-3",
-						children: /* @__PURE__ */ v(a, {
-							loading: C.isLoading,
-							children: C.data ? /* @__PURE__ */ v(c, {
-								workflow: C.data,
-								workflowId: C.data.id,
-								scrollTo: () => {},
-								settings: {
-									enableDebugMode: !1,
-									showFullMessageHistory: !1
-								}
-							}) : null
-						})
-					}),
-					h === "graph" && /* @__PURE__ */ v("div", {
-						className: "h-full",
-						children: /* @__PURE__ */ v(a, {
-							loading: C.isLoading,
-							children: C.data ? /* @__PURE__ */ v(l, { children: /* @__PURE__ */ v(u, {
-								workflowId: e,
-								workflows: [C.data],
-								workflowConfig: D.data,
-								direction: "TB"
-							}) }) : /* @__PURE__ */ v("div", {
-								className: "text-muted-foreground flex h-full items-center justify-center",
-								children: /* @__PURE__ */ v("p", {
-									className: "text-sm",
-									children: "No workflows found"
-								})
-							})
-						})
-					}),
-					h === "run-log" && /* @__PURE__ */ v("div", {
-						className: "px-4",
-						children: /* @__PURE__ */ v(d, { workflow: C.data })
-					}),
-					h === "logs" && /* @__PURE__ */ v(H, {})
-				]
-			}),
-			/* @__PURE__ */ v(f, {
-				open: x,
-				onOpenChange: S,
-				onSuccess: A
-			})
+			G,
+			Z,
+			Q
 		]
-	});
+	}), t[45] = G, t[46] = Z, t[47] = Q, t[48] = $) : $ = t[48], $;
 }
-var L = {
+function _temp() {}
+var STATUS_DOT_COLORS = {
 	completed: "bg-green-500",
 	running: "bg-blue-500",
 	failed: "bg-red-500",
@@ -160,95 +202,135 @@ var L = {
 	canceled: "bg-orange-500",
 	pending: "bg-muted-foreground"
 };
-function R({ newRunDialogOpen: n, onNewRunDialogOpenChange: r, onNewRunSuccess: a }) {
-	let o = x(), { router: s } = e(), [c, l] = _(3), u = t(void 0, { parentId: null }, "createdAt", "DESC", 0, c), d = u.data?.data ?? [], p = u.data?.total ?? 0, m = d.length < p;
-	return /* @__PURE__ */ y("div", {
+function PreviewEmptyState(n) {
+	let r = c(24), { newRunDialogOpen: a, onNewRunDialogOpenChange: o, onNewRunSuccess: s } = n, l = useNavigate(), { router: u } = useStudio(), [d, f] = useState(3), m;
+	r[0] === Symbol.for("react.memo_cache_sentinel") ? (m = { parentId: null }, r[0] = m) : m = r[0];
+	let h = useFilterWorkflows(void 0, m, "createdAt", "DESC", 0, d), g;
+	r[1] === h.data?.data ? g = r[2] : (g = h.data?.data ?? [], r[1] = h.data?.data, r[2] = g);
+	let _ = g, v = h.data?.total ?? 0, y = _.length < v, x;
+	r[3] === o ? x = r[4] : (x = () => o(!0), r[3] = o, r[4] = x);
+	let C;
+	r[5] === Symbol.for("react.memo_cache_sentinel") ? (C = /* @__PURE__ */ jsx(Play, { className: "h-3.5 w-3.5" }), r[5] = C) : C = r[5];
+	let w;
+	r[6] === x ? w = r[7] : (w = /* @__PURE__ */ jsx("div", {
+		className: "flex justify-center",
+		children: /* @__PURE__ */ jsxs(Button, {
+			variant: "secondary",
+			size: "sm",
+			className: "gap-1.5",
+			onClick: x,
+			children: [C, "New Run"]
+		})
+	}), r[6] = x, r[7] = w);
+	let T;
+	r[8] !== h.isLoading || r[9] !== y || r[10] !== l || r[11] !== u || r[12] !== _ ? (T = h.isLoading && _.length === 0 ? /* @__PURE__ */ jsx("div", {
+		className: "flex justify-center py-4",
+		children: /* @__PURE__ */ jsx(Loader2, { className: "text-muted-foreground h-4 w-4 animate-spin" })
+	}) : _.length > 0 ? /* @__PURE__ */ jsxs("div", { children: [
+		/* @__PURE__ */ jsx("p", {
+			className: "text-muted-foreground mb-2 text-xs font-medium",
+			children: "Recent"
+		}),
+		/* @__PURE__ */ jsx("div", {
+			className: "max-h-[280px] overflow-auto",
+			children: /* @__PURE__ */ jsx("div", {
+				className: "divide-border divide-y",
+				children: _.map((e) => /* @__PURE__ */ jsx(RecentRunItem, {
+					workflow: e,
+					onClick: () => void l(u.getPreviewWorkflow(e.id))
+				}, e.id))
+			})
+		}),
+		y && /* @__PURE__ */ jsxs("button", {
+			className: "text-muted-foreground hover:text-foreground mt-2 flex w-full items-center justify-center gap-1 py-1 text-xs transition-colors",
+			onClick: () => f(_temp2),
+			children: [/* @__PURE__ */ jsx(ChevronDown, { className: "h-3 w-3" }), "Load more"]
+		})
+	] }) : null, r[8] = h.isLoading, r[9] = y, r[10] = l, r[11] = u, r[12] = _, r[13] = T) : T = r[13];
+	let E;
+	r[14] !== w || r[15] !== T ? (E = /* @__PURE__ */ jsxs("div", {
+		className: "w-full max-w-sm space-y-6 px-4",
+		children: [w, T]
+	}), r[14] = w, r[15] = T, r[16] = E) : E = r[16];
+	let D;
+	r[17] !== a || r[18] !== o || r[19] !== s ? (D = /* @__PURE__ */ jsx(NewRunDialog, {
+		open: a,
+		onOpenChange: o,
+		onSuccess: s
+	}), r[17] = a, r[18] = o, r[19] = s, r[20] = D) : D = r[20];
+	let O;
+	return r[21] !== E || r[22] !== D ? (O = /* @__PURE__ */ jsxs("div", {
 		className: "flex h-screen flex-col items-center justify-center",
-		children: [/* @__PURE__ */ y("div", {
-			className: "w-full max-w-sm space-y-6 px-4",
-			children: [/* @__PURE__ */ v("div", {
-				className: "flex justify-center",
-				children: /* @__PURE__ */ y(i, {
-					variant: "secondary",
-					size: "sm",
-					className: "gap-1.5",
-					onClick: () => r(!0),
-					children: [/* @__PURE__ */ v(E, { className: "h-3.5 w-3.5" }), "New Run"]
-				})
-			}), u.isLoading && d.length === 0 ? /* @__PURE__ */ v("div", {
-				className: "flex justify-center py-4",
-				children: /* @__PURE__ */ v(T, { className: "text-muted-foreground h-4 w-4 animate-spin" })
-			}) : d.length > 0 ? /* @__PURE__ */ y("div", { children: [
-				/* @__PURE__ */ v("p", {
-					className: "text-muted-foreground mb-2 text-xs font-medium",
-					children: "Recent"
-				}),
-				/* @__PURE__ */ v("div", {
-					className: "max-h-[280px] overflow-auto",
-					children: /* @__PURE__ */ v("div", {
-						className: "divide-border divide-y",
-						children: d.map((e) => /* @__PURE__ */ v(z, {
-							workflow: e,
-							onClick: () => void o(s.getPreviewWorkflow(e.id))
-						}, e.id))
-					})
-				}),
-				m && /* @__PURE__ */ y("button", {
-					className: "text-muted-foreground hover:text-foreground mt-2 flex w-full items-center justify-center gap-1 py-1 text-xs transition-colors",
-					onClick: () => l((e) => e + 5),
-					children: [/* @__PURE__ */ v(C, { className: "h-3 w-3" }), "Load more"]
-				})
-			] }) : null]
-		}), /* @__PURE__ */ v(f, {
-			open: n,
-			onOpenChange: r,
-			onSuccess: a
-		})]
-	});
+		children: [E, D]
+	}), r[21] = E, r[22] = D, r[23] = O) : O = r[23], O;
+}
+function _temp2(e) {
+	return e + 5;
 }
-function z({ workflow: e, onClick: t }) {
-	return /* @__PURE__ */ y("button", {
+function RecentRunItem(e) {
+	let t = c(17), { workflow: n, onClick: r } = e, i = `h-1.5 w-1.5 shrink-0 rounded-full ${STATUS_DOT_COLORS[n.status] ?? "bg-muted-foreground"}`, a;
+	t[0] === i ? a = t[1] : (a = /* @__PURE__ */ jsx("span", { className: i }), t[0] = i, t[1] = a);
+	let o;
+	t[2] !== n.alias || t[3] !== n.run ? (o = /* @__PURE__ */ jsxs("span", {
+		className: "truncate text-sm font-medium",
+		children: [
+			"Run #",
+			n.run,
+			" · ",
+			n.alias
+		]
+	}), t[2] = n.alias, t[3] = n.run, t[4] = o) : o = t[4];
+	let s;
+	t[5] !== a || t[6] !== o ? (s = /* @__PURE__ */ jsxs("div", {
+		className: "flex items-center gap-2",
+		children: [a, o]
+	}), t[5] = a, t[6] = o, t[7] = s) : s = t[7];
+	let l = n.status, u;
+	t[8] === n.createdAt ? u = t[9] : (u = formatDistanceToNow(new Date(n.createdAt), { addSuffix: !0 }), t[8] = n.createdAt, t[9] = u);
+	let d;
+	t[10] !== u || t[11] !== n.status ? (d = /* @__PURE__ */ jsxs("p", {
+		className: "text-muted-foreground mt-0.5 pl-3.5 text-xs",
+		children: [
+			l,
+			" · ",
+			u
+		]
+	}), t[10] = u, t[11] = n.status, t[12] = d) : d = t[12];
+	let f;
+	return t[13] !== r || t[14] !== s || t[15] !== d ? (f = /* @__PURE__ */ jsxs("button", {
 		className: "hover:bg-accent w-full rounded-md px-2 py-2.5 text-left transition-colors",
-		onClick: t,
-		children: [/* @__PURE__ */ y("div", {
-			className: "flex items-center gap-2",
-			children: [/* @__PURE__ */ v("span", { className: `h-1.5 w-1.5 shrink-0 rounded-full ${L[e.status] ?? "bg-muted-foreground"}` }), /* @__PURE__ */ y("span", {
-				className: "truncate text-sm font-medium",
-				children: [
-					"Run #",
-					e.run,
-					" · ",
-					e.alias
-				]
-			})]
-		}), /* @__PURE__ */ y("p", {
-			className: "text-muted-foreground mt-0.5 pl-3.5 text-xs",
-			children: [
-				e.status,
-				" · ",
-				A(new Date(e.createdAt), { addSuffix: !0 })
-			]
-		})]
-	});
+		onClick: r,
+		children: [s, d]
+	}), t[13] = r, t[14] = s, t[15] = d, t[16] = f) : f = t[16], f;
 }
-function B(e) {
+function stripAnsi(e) {
 	return e.replace(/\x1b\[[0-9;]*m/g, "");
 }
-function V({ line: e, index: t }) {
-	let n = B(e), r = /\bERROR\b/.test(n), i = /\bWARN\b/.test(n) || /\b(Warning|WARNING|DeprecationWarning)\b/.test(n);
-	return /* @__PURE__ */ y("div", {
-		className: `group flex border-b border-border/30 hover:bg-accent/30 ${r ? "bg-destructive/5" : i ? "bg-yellow-500/5" : ""}`,
-		children: [/* @__PURE__ */ v("span", {
-			className: "w-10 shrink-0 select-none border-r border-border/30 px-2 py-0.5 text-right text-[10px] text-muted-foreground/50",
-			children: t + 1
-		}), /* @__PURE__ */ v("span", {
-			className: `flex-1 px-3 py-0.5 text-[11px] leading-5 font-mono ${r ? "text-destructive" : i ? "text-yellow-600 dark:text-yellow-400" : ""}`,
-			children: n
-		})]
-	});
+function LogLine(e) {
+	let t = c(14), { line: n, index: r } = e, i, a, o;
+	if (t[0] !== n) {
+		i = stripAnsi(n);
+		let e;
+		t[4] === Symbol.for("react.memo_cache_sentinel") ? (e = /\bERROR\b/, t[4] = e) : e = t[4], a = e.test(i), o = /\bWARN\b/.test(i) || /\b(Warning|WARNING|DeprecationWarning)\b/.test(i), t[0] = n, t[1] = i, t[2] = a, t[3] = o;
+	} else i = t[1], a = t[2], o = t[3];
+	let s = o, l = `group flex border-b border-border/30 hover:bg-accent/30 ${a ? "bg-destructive/5" : s ? "bg-yellow-500/5" : ""}`, u = r + 1, d;
+	t[5] === u ? d = t[6] : (d = /* @__PURE__ */ jsx("span", {
+		className: "w-10 shrink-0 select-none border-r border-border/30 px-2 py-0.5 text-right text-[10px] text-muted-foreground/50",
+		children: u
+	}), t[5] = u, t[6] = d);
+	let f = `flex-1 px-3 py-0.5 text-[11px] leading-5 font-mono ${a ? "text-destructive" : s ? "text-yellow-600 dark:text-yellow-400" : ""}`, p;
+	t[7] !== i || t[8] !== f ? (p = /* @__PURE__ */ jsx("span", {
+		className: f,
+		children: i
+	}), t[7] = i, t[8] = f, t[9] = p) : p = t[9];
+	let m;
+	return t[10] !== l || t[11] !== d || t[12] !== p ? (m = /* @__PURE__ */ jsxs("div", {
+		className: l,
+		children: [d, p]
+	}), t[10] = l, t[11] = d, t[12] = p, t[13] = m) : m = t[13], m;
 }
-function H() {
-	let e = g(null), t = b({
+function EmbedLogsContent() {
+	let e = useRef(null), t = useQuery({
 		queryKey: ["remote-agent-app-logs"],
 		queryFn: async () => {
 			let e = await fetch("http://localhost:8000/api/v1/app/logs?lines=200", { credentials: "include" });
@@ -260,45 +342,45 @@ function H() {
 		},
 		refetchInterval: 5e3
 	});
-	m(() => {
+	useEffect(() => {
 		e.current?.scrollIntoView({ behavior: "smooth" });
 	}, [t.data]);
-	let n = h(() => {
+	let n = useMemo(() => {
 		let e = [];
 		return t.data?.stdout && e.push(t.data.stdout), t.data?.stderr && e.push(t.data.stderr), e.join("\n").split("\n").filter((e) => e.length > 0);
 	}, [t.data]);
-	return /* @__PURE__ */ y("div", {
+	return /* @__PURE__ */ jsxs("div", {
 		className: "flex h-full flex-col",
-		children: [/* @__PURE__ */ y("div", {
+		children: [/* @__PURE__ */ jsxs("div", {
 			className: "flex h-9 shrink-0 items-center justify-between border-b bg-muted/30 px-3",
-			children: [/* @__PURE__ */ v("span", {
+			children: [/* @__PURE__ */ jsx("span", {
 				className: "text-xs font-medium text-muted-foreground",
 				children: "Application Logs"
-			}), /* @__PURE__ */ v("button", {
+			}), /* @__PURE__ */ jsx("button", {
 				onClick: () => void t.refetch(),
 				className: `text-muted-foreground hover:text-foreground rounded-md p-1 transition-colors hover:cursor-pointer ${t.isFetching ? "animate-spin" : ""}`,
-				children: /* @__PURE__ */ v(D, { className: "h-3 w-3" })
+				children: /* @__PURE__ */ jsx(RefreshCw, { className: "h-3 w-3" })
 			})]
-		}), /* @__PURE__ */ v("div", {
+		}), /* @__PURE__ */ jsx("div", {
 			className: "flex-1 overflow-auto bg-background",
-			children: t.isLoading && !t.data ? /* @__PURE__ */ v("div", {
+			children: t.isLoading && !t.data ? /* @__PURE__ */ jsx("div", {
 				className: "flex justify-center py-8",
-				children: /* @__PURE__ */ v(T, { className: "text-muted-foreground h-4 w-4 animate-spin" })
-			}) : t.error ? /* @__PURE__ */ v("div", {
+				children: /* @__PURE__ */ jsx(Loader2, { className: "text-muted-foreground h-4 w-4 animate-spin" })
+			}) : t.error ? /* @__PURE__ */ jsx("div", {
 				className: "px-4 py-3",
-				children: /* @__PURE__ */ y("p", {
+				children: /* @__PURE__ */ jsxs("p", {
 					className: "text-sm text-destructive",
 					children: ["Error: ", t.error.message]
 				})
-			}) : n.length > 0 ? /* @__PURE__ */ y("div", {
+			}) : n.length > 0 ? /* @__PURE__ */ jsxs("div", {
 				className: "font-mono",
-				children: [n.map((e, t) => /* @__PURE__ */ v(V, {
+				children: [n.map((e, t) => /* @__PURE__ */ jsx(LogLine, {
 					line: e,
 					index: t
-				}, t)), /* @__PURE__ */ v("div", { ref: e })]
-			}) : /* @__PURE__ */ y("div", {
+				}, t)), /* @__PURE__ */ jsx("div", { ref: e })]
+			}) : /* @__PURE__ */ jsxs("div", {
 				className: "flex flex-col items-center justify-center gap-2 py-8 text-muted-foreground",
-				children: [/* @__PURE__ */ v(O, { className: "h-5 w-5" }), /* @__PURE__ */ v("span", {
+				children: [/* @__PURE__ */ jsx(ScrollText, { className: "h-5 w-5" }), /* @__PURE__ */ jsx("span", {
 					className: "text-xs",
 					children: "No logs available"
 				})]
@@ -306,5 +388,4 @@ function H() {
 		})]
 	});
 }
-//#endregion
-export { F as default };
+export { PreviewWorkbenchPage as default };