@burdenoff/microfe-bigconsole 2026.1004.2 → 2026.1004.4

package/dist/bigconsole/pages/PipelineViewPage.js

@@ -9,98 +9,98 @@ import { BIGCONSOLE_PERMISSIONS as a } from "../../constants/permissions.js";
 import { isNative as o, nativeNotify as s } from "../../utils/nativeBridge.js";
 import c from "../components/pipeline/PipelineStatusBadge.js";
 import te from "../components/pipeline/PipelineDeleteDialog.js";
-import { memo as l, useCallback as u, useEffect as ne, useId as re, useState as d } from "react";
-import { useParams as ie, useSearchParams as ae } from "react-router";
-import { AccessDenied as f } from "@burdenoff/fe-libs/shared/components";
-import { usePermissions as p } from "@burdenoff/fe-libs/shared/providers/shell";
-import { Button as m, IllustratedEmptyState as h, NextSteps as oe, PagePurpose as se, Spinner as ce } from "@burdenoff/fe-libs/ui";
-import { jsx as g, jsxs as _ } from "react/jsx-runtime";
-import { useI18n as v } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { memo as l, useCallback as u, useEffect as d, useId as ne, useState as f } from "react";
+import { useParams as re, useSearchParams as ie } from "react-router";
+import { AccessDenied as ae } from "@burdenoff/fe-libs/shared/components";
+import { usePermissions as oe } from "@burdenoff/fe-libs/shared/providers/shell";
+import { Button as p, IllustratedEmptyState as se, NextSteps as ce, PagePurpose as m, Spinner as le } from "@burdenoff/fe-libs/ui";
+import { jsx as h, jsxs as g } from "react/jsx-runtime";
+import { useI18n as _ } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
 //#region src/bigconsole/pages/PipelineViewPage.tsx
-var y = "min-h-[var(--size-controlHeight-md)]", le = "rounded-pill bg-bg-sunken px-2 py-0.5 text-xs font-medium text-text-secondary", b = "rounded-button bg-bg-surface px-1.5 py-0.5 font-mono break-all text-text-primary", x = ({ className: e }) => /* @__PURE__ */ g("svg", {
+var v = "min-h-[var(--size-controlHeight-md)]", ue = "rounded-pill bg-bg-sunken px-2 py-0.5 text-xs font-medium text-text-secondary", y = "rounded-button bg-bg-surface px-1.5 py-0.5 font-mono break-all text-text-primary", de = ({ className: e }) => /* @__PURE__ */ h("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ g("path", {
+	children: /* @__PURE__ */ h("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 2,
 		d: "M10 19l-7-7m0 0l7-7m-7 7h18"
 	})
-}), S = ({ className: e }) => /* @__PURE__ */ g("svg", {
+}), b = ({ className: e }) => /* @__PURE__ */ h("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ g("path", {
+	children: /* @__PURE__ */ h("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 2,
 		d: "M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"
 	})
-}), C = ({ className: e }) => /* @__PURE__ */ g("svg", {
+}), fe = ({ className: e }) => /* @__PURE__ */ h("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ g("path", {
+	children: /* @__PURE__ */ h("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 2,
 		d: "M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"
 	})
-}), w = ({ className: e }) => /* @__PURE__ */ _("svg", {
+}), x = ({ className: e }) => /* @__PURE__ */ g("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: [/* @__PURE__ */ g("path", {
+	children: [/* @__PURE__ */ h("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 2,
 		d: "M14.752 11.168l-3.197-2.132A1 1 0 0010 9.87v4.263a1 1 0 001.555.832l3.197-2.132a1 1 0 000-1.664z"
-	}), /* @__PURE__ */ g("path", {
+	}), /* @__PURE__ */ h("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 2,
 		d: "M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
 	})]
-}), T = ({ className: e }) => /* @__PURE__ */ g("svg", {
+}), S = ({ className: e }) => /* @__PURE__ */ h("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ g("path", {
+	children: /* @__PURE__ */ h("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 2,
 		d: "M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
 	})
-}), ue = ({ className: e }) => /* @__PURE__ */ g("svg", {
+}), pe = ({ className: e }) => /* @__PURE__ */ h("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ g("path", {
+	children: /* @__PURE__ */ h("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 2,
 		d: "M5 13l4 4L19 7"
 	})
-}), E = ({ className: e }) => /* @__PURE__ */ g("svg", {
+}), C = ({ className: e }) => /* @__PURE__ */ h("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ g("path", {
+	children: /* @__PURE__ */ h("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 2,
 		d: "M14 5l7 7m0 0l-7 7m7-7H3"
 	})
-}), de = ({ handling: e }) => {
-	let { t } = v(), n = {
+}), me = ({ handling: e }) => {
+	let { t } = _(), n = {
 		fail: {
 			label: t("bigconsole.pipelines.view.errorHandlingFail", "Fail"),
 			className: "bg-[var(--color-status-error-bgSubtle)] text-status-error-text border-[var(--color-status-error-border)]"
@@ -114,414 +114,554 @@ var y = "min-h-[var(--size-controlHeight-md)]", le = "rounded-pill bg-bg-sunken
 			className: "bg-[var(--color-status-info-bgSubtle)] text-[var(--color-status-info-text)] border-[var(--color-status-info-border)]"
 		}
 	}, r = n[e] || n.fail;
-	return /* @__PURE__ */ _("span", {
+	return /* @__PURE__ */ g("span", {
 		className: `inline-flex items-center gap-1 whitespace-nowrap rounded-pill border px-2 py-0.5 text-xs font-medium ${r.className}`,
-		children: [/* @__PURE__ */ g("span", {
+		children: [/* @__PURE__ */ h("span", {
 			className: "font-normal opacity-80",
 			children: "On error"
 		}), r.label]
 	});
-}, D = l(function() {
-	let { pipelineId: l } = ie(), D = t(), { t: O } = v(), k = "default", [fe] = ae(), A = re(), { hasPermission: j, isLoading: pe } = p(), M = j(a.PIPELINE_READ), N = j(a.PIPELINE_UPDATE), P = j(a.PIPELINE_DELETE), F = j(a.PIPELINE_TEST), [I, L] = d(null), [R, z] = d("{\n  \"data\": \"sample\"\n}"), [B, me] = d(null), [V, H] = d(fe.get("test") === "true"), he = e((e) => e.deleteDialogOpen), U = e((e) => e.openDeleteDialog), W = e((e) => e.closeDeleteDialog), { loading: G, error: K, fetchPipeline: q, deletePipeline: J, testPipeline: Y } = ee({
-		consoleId: k,
+}, w = l(function() {
+	let { pipelineId: l } = re(), w = t(), { t: T } = _(), [he] = ie(), E = ne(), { hasPermission: D, isLoading: O } = oe(), k = D(a.PIPELINE_READ), A = D(a.PIPELINE_UPDATE), ge = D(a.PIPELINE_DELETE), j = D(a.PIPELINE_TEST), [M, N] = f(null), [P, _e] = f("{\n  \"data\": \"sample\"\n}"), [F, ve] = f(null), [I, L] = f([]), [R, z] = f(null), [B, V] = f(he.get("test") === "true"), ye = e((e) => e.deleteDialogOpen), H = e((e) => e.openDeleteDialog), U = e((e) => e.closeDeleteDialog), { loading: W, error: G, fetchPipeline: K, deletePipeline: q, testPipeline: J, listExecutions: Y } = ee({
+		consoleId: "default",
 		skipFetch: !0
 	});
-	ne(() => {
-		l && q(l).then((e) => {
-			e && L(e);
+	d(() => {
+		l && K(l).then((e) => {
+			e && N(e);
 		});
-	}, [l, q]);
+	}, [l, K]), d(() => {
+		let e = !0;
+		if (!(!l || O || !k)) return Y(l).then((t) => {
+			if (!e) return;
+			let n = [...t].sort((e, t) => new Date(t.startedAt).getTime() - new Date(e.startedAt).getTime());
+			L(n), z(n[0] ?? null);
+		}), () => {
+			e = !1;
+		};
+	}, [
+		l,
+		O,
+		k,
+		Y
+	]);
 	let X = u(() => {
-		D("/pipelines");
-	}, [D]), Z = u(() => {
-		D(`/pipelines/${l}/edit`);
-	}, [D, l]), ge = u(() => {
-		I && U(I);
-	}, [I, U]), _e = u(async () => {
-		I && (await J(I.id) ? (o() && s("success"), W(), D("/pipelines")) : o() && s("error"));
+		w(`/pipelines?consoleId=${encodeURIComponent(M?.consoleId ?? "default")}`);
+	}, [w, M?.consoleId]), Z = u(() => {
+		w(`/pipelines/${l}/edit`);
+	}, [w, l]), be = u(() => {
+		M && H(M);
+	}, [M, H]), xe = u(async () => {
+		M && (await q(M.id) ? (o() && s("success"), U(), w(`/pipelines?consoleId=${encodeURIComponent(M?.consoleId ?? "default")}`)) : o() && s("error"));
 	}, [
-		I,
-		J,
-		W,
-		D
-	]), ve = u((e) => {
-		D(`/dashboards/${k}/parsers/${e}`);
-	}, [D, k]), ye = u(async () => {
-		if (I) try {
-			let e = await Y({
-				pipelineId: I.id,
-				inputData: R
+		M,
+		q,
+		U,
+		w
+	]), Se = u((e) => {
+		w(`/parsers/${e}`);
+	}, [w]), Ce = u(async () => {
+		if (M) try {
+			let e = await J({
+				pipelineId: M.id,
+				inputData: P
 			});
-			e && me(e);
+			e && (ve(e), z(e), L(await Y(M.id)));
 		} catch {}
 	}, [
-		I,
-		Y,
-		R
+		M,
+		J,
+		P,
+		Y
 	]);
-	if (G && !I) return /* @__PURE__ */ g("div", {
+	if (W && !M) return /* @__PURE__ */ h("div", {
 		className: "p-card-padding",
-		children: /* @__PURE__ */ _("div", {
+		children: /* @__PURE__ */ g("div", {
 			className: "flex flex-col items-center justify-center py-16",
 			role: "status",
-			children: [/* @__PURE__ */ g(ce, { style: {
+			children: [/* @__PURE__ */ h(le, { style: {
 				height: "var(--size-icon-xl)",
 				width: "var(--size-icon-xl)"
-			} }), /* @__PURE__ */ g("p", {
+			} }), /* @__PURE__ */ h("p", {
 				className: "mt-form-gap text-sm text-text-secondary",
-				children: O("bigconsole.pipelines.view.loading", "Loading Pipeline...")
+				children: T("bigconsole.pipelines.view.loading", "Loading Pipeline...")
 			})]
 		})
 	});
-	if (!pe && !M) return /* @__PURE__ */ g(f, {
-		title: O("bigconsole.pipelines.errors.accessDeniedTitle", "Access Denied"),
-		description: O("bigconsole.pipelines.errors.accessDeniedViewDescription", "You don't have permission to view this pipeline.")
+	if (!O && !k) return /* @__PURE__ */ h(ae, {
+		title: T("bigconsole.pipelines.errors.accessDeniedTitle", "Access Denied"),
+		description: T("bigconsole.pipelines.errors.accessDeniedViewDescription", "You don't have permission to view this pipeline.")
 	});
-	if (K) return /* @__PURE__ */ g("div", {
+	if (G) return /* @__PURE__ */ h("div", {
 		className: "p-card-padding",
-		children: /* @__PURE__ */ g(r, {
+		children: /* @__PURE__ */ h(r, {
 			tone: "danger",
 			headingLevel: 2,
-			title: O("bigconsole.pipelines.view.loadError", "Failed to load Pipeline"),
-			description: K.message,
-			icon: /* @__PURE__ */ g(T, { className: "h-icon-sm w-icon-sm" }),
-			actions: /* @__PURE__ */ g(m, {
+			title: T("bigconsole.pipelines.view.loadError", "Failed to load Pipeline"),
+			description: G.message,
+			icon: /* @__PURE__ */ h(S, { className: "h-icon-sm w-icon-sm" }),
+			actions: /* @__PURE__ */ h(p, {
 				onClick: X,
-				className: y,
-				children: O("bigconsole.pipelines.actions.backToPipelines", "Back to Pipelines")
+				className: v,
+				children: T("bigconsole.pipelines.actions.backToPipelines", "Back to Pipelines")
 			}),
 			"data-testid": "pipeline-view-error",
-			children: /* @__PURE__ */ g("p", {
+			children: /* @__PURE__ */ h("p", {
 				className: "text-sm text-text-secondary",
 				children: "The pipeline could not be read from the console service. Nothing was changed."
 			})
 		})
 	});
-	if (!I) return /* @__PURE__ */ g("div", {
+	if (!M) return /* @__PURE__ */ h("div", {
 		className: "p-card-padding",
-		children: /* @__PURE__ */ g(r, {
+		children: /* @__PURE__ */ h(r, {
 			tone: "warning",
 			headingLevel: 2,
-			title: O("bigconsole.pipelines.view.notFoundTitle", "Pipeline not found"),
-			description: O("bigconsole.pipelines.view.notFoundDescription", "The pipeline you're looking for doesn't exist or has been deleted."),
-			icon: /* @__PURE__ */ g(T, { className: "h-icon-sm w-icon-sm" }),
-			actions: /* @__PURE__ */ g(m, {
+			title: T("bigconsole.pipelines.view.notFoundTitle", "Pipeline not found"),
+			description: T("bigconsole.pipelines.view.notFoundDescription", "The pipeline you're looking for doesn't exist or has been deleted."),
+			icon: /* @__PURE__ */ h(S, { className: "h-icon-sm w-icon-sm" }),
+			actions: /* @__PURE__ */ h(p, {
 				onClick: X,
-				className: y,
-				children: O("bigconsole.pipelines.actions.backToPipelines", "Back to Pipelines")
+				className: v,
+				children: T("bigconsole.pipelines.actions.backToPipelines", "Back to Pipelines")
 			}),
 			"data-testid": "pipeline-not-found"
 		})
 	});
-	let Q = I.stages?.length ?? 0, $ = B?.status === "completed", be = /* @__PURE__ */ g(r, {
-		emphasis: V ? "standard" : "primary",
+	let Q = M.stages?.length ?? 0, $ = F?.status === "completed", we = /* @__PURE__ */ h(r, {
+		emphasis: B ? "standard" : "primary",
 		headingLevel: 2,
-		title: O("bigconsole.pipelines.view.stagesHeading", "Pipeline Stages ({{count}})", { count: Q }),
+		title: T("bigconsole.pipelines.view.stagesHeading", "Pipeline Stages ({{count}})", { count: Q }),
 		description: "Data flows top to bottom — each stage reads its input key and writes an output key for the next one.",
 		"data-testid": "pipeline-stages",
-		children: Q === 0 ? /* @__PURE__ */ g(h, {
+		children: Q === 0 ? /* @__PURE__ */ h(se, {
 			illustration: "empty-generic",
-			title: O("bigconsole.pipelines.view.noStagesTitle", "No stages defined"),
-			description: O("bigconsole.pipelines.view.noStagesDescription", "Edit the pipeline to add parser stages."),
-			action: /* @__PURE__ */ _(m, {
+			title: T("bigconsole.pipelines.view.noStagesTitle", "No stages defined"),
+			description: T("bigconsole.pipelines.view.noStagesDescription", "Edit the pipeline to add parser stages."),
+			action: /* @__PURE__ */ g(p, {
 				variant: "secondary",
 				onClick: Z,
-				disabled: !N,
-				className: y,
-				children: [/* @__PURE__ */ g(S, { className: "h-icon-sm w-icon-sm" }), O("bigconsole.pipelines.actions.edit", "Edit")]
+				disabled: !A,
+				className: v,
+				children: [/* @__PURE__ */ h(b, { className: "h-icon-sm w-icon-sm" }), T("bigconsole.pipelines.actions.edit", "Edit")]
 			})
-		}) : /* @__PURE__ */ g("ol", {
+		}) : /* @__PURE__ */ h("ol", {
 			className: "flex flex-col",
-			children: (I.stages ?? []).map((e, t) => /* @__PURE__ */ _("li", {
+			children: (M.stages ?? []).map((e, t) => /* @__PURE__ */ g("li", {
 				className: "flex min-w-0 flex-col",
-				children: [/* @__PURE__ */ _("div", {
+				children: [/* @__PURE__ */ g("div", {
 					"data-testid": "pipeline-stage",
 					"data-enabled": e.enabled,
 					className: `min-w-0 rounded-card border bg-bg-sunken p-4 ${e.enabled ? "border-[var(--color-border-subtle)]" : "border-dashed border-[var(--color-border-strong)]"}`,
 					children: [
-						/* @__PURE__ */ _("div", {
+						/* @__PURE__ */ g("div", {
 							className: "flex flex-wrap items-center justify-between gap-control-gap",
-							children: [/* @__PURE__ */ _("div", {
+							children: [/* @__PURE__ */ g("div", {
 								className: "flex min-w-0 flex-wrap items-center gap-icon-gap",
 								children: [
-									/* @__PURE__ */ g("span", {
+									/* @__PURE__ */ h("span", {
 										"aria-hidden": "true",
 										className: "flex h-6 w-6 shrink-0 items-center justify-center rounded-pill bg-bg-surface text-xs font-semibold text-text-secondary",
 										children: t + 1
 									}),
-									/* @__PURE__ */ g("h3", {
+									/* @__PURE__ */ h("h3", {
 										className: "min-w-0 truncate text-sm font-semibold text-text-primary",
-										children: e.parserName || O("bigconsole.pipelines.view.stageFallbackName", "Stage {{number}}", { number: t + 1 })
+										children: e.parserName || T("bigconsole.pipelines.view.stageFallbackName", "Stage {{number}}", { number: t + 1 })
 									}),
-									e.parserType && /* @__PURE__ */ g("span", {
+									e.parserType && /* @__PURE__ */ h("span", {
 										className: "rounded-pill bg-bg-surface px-2 py-0.5 text-xs font-medium text-text-secondary",
 										children: e.parserType.toUpperCase()
 									})
 								]
-							}), /* @__PURE__ */ _("div", {
+							}), /* @__PURE__ */ g("div", {
 								className: "flex flex-wrap items-center gap-icon-gap",
-								children: [/* @__PURE__ */ g(de, { handling: e.onError }), !e.enabled && /* @__PURE__ */ g("span", {
+								children: [/* @__PURE__ */ h(me, { handling: e.onError }), !e.enabled && /* @__PURE__ */ h("span", {
 									className: "rounded-pill border border-[var(--color-border-strong)] px-2 py-0.5 text-xs font-medium text-text-secondary",
-									children: O("bigconsole.pipelines.view.stageDisabled", "Disabled")
+									children: T("bigconsole.pipelines.view.stageDisabled", "Disabled")
 								})]
 							})]
 						}),
-						/* @__PURE__ */ _("div", {
+						/* @__PURE__ */ g("div", {
 							className: "mt-2 flex flex-wrap items-center gap-x-2 gap-y-1 text-xs text-text-secondary",
 							children: [
-								/* @__PURE__ */ g("span", {
+								/* @__PURE__ */ h("span", {
 									className: "text-text-muted",
 									children: "Reads"
 								}),
-								/* @__PURE__ */ g("code", {
-									className: b,
+								/* @__PURE__ */ h("code", {
+									className: y,
 									children: e.inputKey
 								}),
-								/* @__PURE__ */ g(E, { className: "h-3 w-3 shrink-0" }),
-								/* @__PURE__ */ g("span", {
+								/* @__PURE__ */ h(C, { className: "h-3 w-3 shrink-0" }),
+								/* @__PURE__ */ h("span", {
 									className: "text-text-muted",
 									children: "writes"
 								}),
-								/* @__PURE__ */ g("code", {
-									className: b,
+								/* @__PURE__ */ h("code", {
+									className: y,
 									children: e.outputKey
 								})
 							]
 						}),
-						e.description && /* @__PURE__ */ g("p", {
+						e.description && /* @__PURE__ */ h("p", {
 							className: "mt-2 text-xs text-text-secondary",
 							children: e.description
 						}),
-						e.parserId && /* @__PURE__ */ g("button", {
+						e.parserId && /* @__PURE__ */ h("button", {
 							type: "button",
-							onClick: () => ve(e.parserId),
+							onClick: () => Se(e.parserId),
 							className: "mt-2 rounded-button text-xs text-text-link hover:underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface",
-							children: O("bigconsole.pipelines.view.viewParser", "View Parser")
+							children: T("bigconsole.pipelines.view.viewParser", "View Parser")
 						})
 					]
-				}), t < Q - 1 && /* @__PURE__ */ g("span", {
+				}), t < Q - 1 && /* @__PURE__ */ h("span", {
 					"aria-hidden": "true",
 					className: "flex justify-center py-1",
-					children: /* @__PURE__ */ g(E, { className: "h-icon-sm w-icon-sm rotate-90 text-text-muted" })
+					children: /* @__PURE__ */ h(C, { className: "h-icon-sm w-icon-sm rotate-90 text-text-muted" })
 				})]
 			}, e.id))
 		})
-	}), xe = V ? /* @__PURE__ */ g(r, {
+	}), Te = B ? /* @__PURE__ */ h(r, {
 		id: "pipeline-test-panel",
 		emphasis: "primary",
 		headingLevel: 2,
-		title: O("bigconsole.pipelines.view.testPanelHeading", "Test Pipeline"),
+		title: T("bigconsole.pipelines.view.testPanelHeading", "Test Pipeline"),
 		description: "Run sample input through every enabled stage. Nothing is written to the connected sink.",
-		actions: /* @__PURE__ */ _(m, {
-			onClick: ye,
-			disabled: G || !F,
-			className: y,
-			children: [/* @__PURE__ */ g(w, { className: "h-icon-sm w-icon-sm" }), G ? O("bigconsole.pipelines.view.testRunning", "Running...") : O("bigconsole.pipelines.view.runTest", "Run Test")]
+		actions: /* @__PURE__ */ g(p, {
+			onClick: Ce,
+			disabled: W || !j,
+			className: v,
+			children: [/* @__PURE__ */ h(x, { className: "h-icon-sm w-icon-sm" }), W ? T("bigconsole.pipelines.view.testRunning", "Running...") : T("bigconsole.pipelines.view.runTest", "Run Test")]
 		}),
 		"data-testid": "pipeline-test-panel",
-		children: /* @__PURE__ */ _("div", {
+		children: /* @__PURE__ */ g("div", {
 			className: "flex flex-col gap-form-gap",
-			children: [/* @__PURE__ */ _("div", {
+			children: [/* @__PURE__ */ g("div", {
 				className: "min-w-0",
-				children: [/* @__PURE__ */ g("label", {
-					htmlFor: A,
+				children: [/* @__PURE__ */ h("label", {
+					htmlFor: E,
 					className: "mb-1 block text-sm font-medium text-text-primary",
-					children: O("bigconsole.pipelines.view.inputJsonLabel", "Input JSON")
-				}), /* @__PURE__ */ g("textarea", {
-					id: A,
-					value: R,
-					onChange: (e) => z(e.target.value),
+					children: T("bigconsole.pipelines.view.inputJsonLabel", "Input JSON")
+				}), /* @__PURE__ */ h("textarea", {
+					id: E,
+					value: P,
+					onChange: (e) => _e(e.target.value),
 					spellCheck: !1,
 					className: `min-h-32 w-full resize-y rounded-input border border-[var(--color-border-subtle)] bg-bg-canvas px-3 py-2 font-mono text-sm text-text-primary ${n}`,
 					placeholder: "{\"key\": \"value\"}"
 				})]
-			}), B && /* @__PURE__ */ g(r, {
+			}), F && /* @__PURE__ */ h(r, {
 				tone: $ ? "success" : "danger",
 				headingLevel: 3,
-				title: $ ? O("bigconsole.pipelines.view.testPassed", "Test Passed") : O("bigconsole.pipelines.view.testFailed", "Test Failed"),
-				icon: g($ ? ue : T, { className: "h-icon-sm w-icon-sm" }),
-				meta: B.totalExecutionTimeMs ? /* @__PURE__ */ _("span", {
-					className: le,
-					children: [B.totalExecutionTimeMs, "ms"]
+				title: $ ? T("bigconsole.pipelines.view.testPassed", "Test Passed") : T("bigconsole.pipelines.view.testFailed", "Test Failed"),
+				icon: h($ ? pe : S, { className: "h-icon-sm w-icon-sm" }),
+				meta: F.totalExecutionTimeMs ? /* @__PURE__ */ g("span", {
+					className: ue,
+					children: [F.totalExecutionTimeMs, "ms"]
 				}) : null,
 				"data-testid": "pipeline-test-result",
-				children: /* @__PURE__ */ _("div", {
+				children: /* @__PURE__ */ g("div", {
 					className: "flex flex-col gap-form-gap",
-					children: [/* @__PURE__ */ _("div", {
+					children: [/* @__PURE__ */ g("div", {
 						className: "min-w-0",
-						children: [/* @__PURE__ */ g("h4", {
+						children: [/* @__PURE__ */ h("h4", {
 							className: "mb-1 text-sm font-medium text-text-primary",
-							children: O("bigconsole.pipelines.view.outputLabel", "Output")
-						}), /* @__PURE__ */ g("pre", {
+							children: T("bigconsole.pipelines.view.outputLabel", "Output")
+						}), /* @__PURE__ */ h("pre", {
 							className: "max-h-64 w-full overflow-auto rounded-input border border-[var(--color-border-subtle)] bg-bg-canvas p-3 font-mono text-xs text-text-primary",
-							children: JSON.stringify(B.outputData, null, 2) || "null"
+							children: JSON.stringify(F.outputData, null, 2) || "null"
 						})]
-					}), B.error && /* @__PURE__ */ _("div", {
+					}), F.error && /* @__PURE__ */ g("div", {
 						className: "min-w-0",
-						children: [/* @__PURE__ */ g("h4", {
+						children: [/* @__PURE__ */ h("h4", {
 							className: "mb-1 text-sm font-medium text-status-error-text",
-							children: O("bigconsole.pipelines.view.errorLabel", "Error")
-						}), /* @__PURE__ */ g("pre", {
+							children: T("bigconsole.pipelines.view.errorLabel", "Error")
+						}), /* @__PURE__ */ h("pre", {
 							className: "max-h-64 w-full overflow-auto rounded-input border border-[var(--color-status-error-border)] bg-[var(--color-status-error-bgSubtle)] p-3 font-mono text-xs text-status-error-text",
-							children: B.error
+							children: F.error
 						})]
 					})]
 				})
 			})]
 		})
 	}) : null;
-	return /* @__PURE__ */ _("div", {
+	return /* @__PURE__ */ g("div", {
 		className: "p-card-padding",
-		children: [/* @__PURE__ */ _(i, { children: [
-			/* @__PURE__ */ _("header", {
+		children: [/* @__PURE__ */ g(i, { children: [
+			/* @__PURE__ */ g("header", {
 				className: "flex flex-col gap-form-gap sm:flex-row sm:items-start sm:justify-between",
-				children: [/* @__PURE__ */ _("div", {
+				children: [/* @__PURE__ */ g("div", {
 					className: "flex min-w-0 flex-col gap-control-gap",
 					children: [
-						/* @__PURE__ */ _(m, {
+						/* @__PURE__ */ g(p, {
 							variant: "ghost",
 							size: "sm",
 							onClick: X,
 							className: "w-fit",
-							children: [/* @__PURE__ */ g(x, { className: "h-icon-sm w-icon-sm" }), O("bigconsole.pipelines.actions.backToPipelines", "Back to Pipelines")]
+							children: [/* @__PURE__ */ h(de, { className: "h-icon-sm w-icon-sm" }), T("bigconsole.pipelines.actions.backToPipelines", "Back to Pipelines")]
 						}),
-						/* @__PURE__ */ _("div", {
+						/* @__PURE__ */ g("div", {
 							className: "flex flex-wrap items-center gap-icon-gap",
-							children: [/* @__PURE__ */ g("h1", {
+							children: [/* @__PURE__ */ h("h1", {
 								className: "min-w-0 break-words text-2xl font-bold leading-tight text-text-primary",
-								children: I.name
-							}), /* @__PURE__ */ g(c, { status: I.status })]
+								children: M.name
+							}), /* @__PURE__ */ h(c, { status: M.status })]
 						}),
-						I.description && /* @__PURE__ */ g("p", {
+						M.description && /* @__PURE__ */ h("p", {
 							className: "text-sm text-text-secondary",
-							children: I.description
+							children: M.description
 						})
 					]
-				}), /* @__PURE__ */ _("div", {
+				}), /* @__PURE__ */ g("div", {
 					className: "flex flex-wrap items-center gap-control-gap",
 					children: [
-						/* @__PURE__ */ _(m, {
-							onClick: () => H(!V),
-							disabled: !F,
-							"aria-expanded": V,
+						/* @__PURE__ */ g(p, {
+							onClick: () => V(!B),
+							disabled: !j,
+							"aria-expanded": B,
 							"aria-controls": "pipeline-test-panel",
-							className: y,
-							children: [/* @__PURE__ */ g(w, { className: "h-icon-sm w-icon-sm" }), O("bigconsole.pipelines.actions.test", "Test")]
+							className: v,
+							children: [/* @__PURE__ */ h(x, { className: "h-icon-sm w-icon-sm" }), T("bigconsole.pipelines.actions.test", "Test")]
 						}),
-						/* @__PURE__ */ _(m, {
+						/* @__PURE__ */ g(p, {
 							variant: "secondary",
 							onClick: Z,
-							disabled: !N,
-							className: y,
-							children: [/* @__PURE__ */ g(S, { className: "h-icon-sm w-icon-sm" }), O("bigconsole.pipelines.actions.edit", "Edit")]
+							disabled: !A,
+							className: v,
+							children: [/* @__PURE__ */ h(b, { className: "h-icon-sm w-icon-sm" }), T("bigconsole.pipelines.actions.edit", "Edit")]
 						}),
-						P && /* @__PURE__ */ _(m, {
+						ge && /* @__PURE__ */ g(p, {
 							variant: "destructive",
-							onClick: ge,
-							className: y,
-							children: [/* @__PURE__ */ g(C, { className: "h-icon-sm w-icon-sm" }), O("bigconsole.pipelines.actions.delete", "Delete")]
+							onClick: be,
+							className: v,
+							children: [/* @__PURE__ */ h(fe, { className: "h-icon-sm w-icon-sm" }), T("bigconsole.pipelines.actions.delete", "Delete")]
 						})
 					]
 				})]
 			}),
-			/* @__PURE__ */ g(se, {
+			/* @__PURE__ */ h(m, {
 				className: "max-w-[75ch]",
-				children: O("bigconsole.pipelines.view.purpose", "A pipeline chains parsers and a data sink into a repeatable flow. Review its stages here, test it with sample input to confirm the output, then edit the stages or run it to process real data into the connected sink.")
+				children: T("bigconsole.pipelines.view.purpose", "A pipeline chains parsers and a data sink into a repeatable flow. Review its stages here, test it with sample input to confirm the output, then edit the stages or run it to process real data into the connected sink.")
 			}),
-			/* @__PURE__ */ g(oe, {
+			/* @__PURE__ */ h(ce, {
 				storageKey: "bigconsole-pipeline-view",
 				steps: [
-					...F ? [{
+					...j ? [{
 						id: "test",
-						label: O("bigconsole.pipelines.view.nextStepTestLabel", "Test with sample input"),
-						description: O("bigconsole.pipelines.view.nextStepTestDescription", "Run the pipeline against a sample to verify each stage."),
-						onClick: () => H(!0)
+						label: T("bigconsole.pipelines.view.nextStepTestLabel", "Test with sample input"),
+						description: T("bigconsole.pipelines.view.nextStepTestDescription", "Run the pipeline against a sample to verify each stage."),
+						onClick: () => V(!0)
 					}] : [],
-					...N ? [{
+					...A ? [{
 						id: "edit",
-						label: O("bigconsole.pipelines.view.nextStepEditLabel", "Edit the stages"),
-						description: O("bigconsole.pipelines.view.nextStepEditDescription", "Add, reorder, or configure the parsers in this pipeline."),
+						label: T("bigconsole.pipelines.view.nextStepEditLabel", "Edit the stages"),
+						description: T("bigconsole.pipelines.view.nextStepEditDescription", "Add, reorder, or configure the parsers in this pipeline."),
 						onClick: Z
 					}] : [],
 					{
 						id: "sinks",
-						label: O("bigconsole.pipelines.view.nextStepSinksLabel", "Review the target data sink"),
-						description: O("bigconsole.pipelines.view.nextStepSinksDescription", "See where the processed data lands."),
-						onClick: () => D("/datasinks")
+						label: T("bigconsole.pipelines.view.nextStepSinksLabel", "Review the target data sink"),
+						description: T("bigconsole.pipelines.view.nextStepSinksDescription", "See where the processed data lands."),
+						onClick: () => w("/datasinks")
 					}
 				]
 			}),
-			/* @__PURE__ */ _("div", {
+			/* @__PURE__ */ g("div", {
 				className: "grid grid-cols-1 gap-section-gap lg:grid-cols-3",
-				children: [/* @__PURE__ */ g("div", {
+				children: [/* @__PURE__ */ h("div", {
 					className: "min-w-0 lg:col-span-2",
-					children: /* @__PURE__ */ _(i, { children: [xe, be] })
-				}), /* @__PURE__ */ g("div", {
+					children: /* @__PURE__ */ g(i, { children: [
+						Te,
+						R && R.pipelineId === l && /* @__PURE__ */ h(r, {
+							emphasis: "primary",
+							headingLevel: 2,
+							title: T("bigconsole.pipelines.execution.timelineHeading", "Stage timeline"),
+							"data-testid": "pipeline-stage-timeline",
+							children: /* @__PURE__ */ g("div", {
+								className: "flex flex-col gap-form-gap",
+								children: [
+									/* @__PURE__ */ g("dl", {
+										className: "grid grid-cols-1 gap-form-gap sm:grid-cols-2",
+										children: [
+											/* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("dt", {
+												className: "text-xs text-text-muted",
+												children: T("bigconsole.pipelines.execution.runStatus", "Run status")
+											}), /* @__PURE__ */ h("dd", {
+												className: "font-medium text-text-primary",
+												children: R.status
+											})] }),
+											/* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("dt", {
+												className: "text-xs text-text-muted",
+												children: T("bigconsole.pipelines.execution.totalDuration", "Total duration")
+											}), /* @__PURE__ */ h("dd", {
+												className: "text-text-primary",
+												children: R.totalExecutionTimeMs == null ? "—" : `${R.totalExecutionTimeMs} ms`
+											})] }),
+											/* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("dt", {
+												className: "text-xs text-text-muted",
+												children: T("bigconsole.pipelines.execution.started", "Started")
+											}), /* @__PURE__ */ h("dd", {
+												className: "break-words text-text-primary",
+												children: new Date(R.startedAt).toLocaleString()
+											})] }),
+											/* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("dt", {
+												className: "text-xs text-text-muted",
+												children: T("bigconsole.pipelines.execution.finished", "Finished")
+											}), /* @__PURE__ */ h("dd", {
+												className: "break-words text-text-primary",
+												children: R.completedAt ? new Date(R.completedAt).toLocaleString() : "—"
+											})] })
+										]
+									}),
+									/* @__PURE__ */ h("ol", {
+										className: "flex flex-col gap-control-gap",
+										children: R.stageResults.map((e, t) => /* @__PURE__ */ g("li", {
+											className: "min-w-0 rounded-card border border-[var(--color-border-subtle)] bg-bg-sunken p-3",
+											children: [
+												/* @__PURE__ */ g("div", {
+													className: "flex flex-wrap items-center justify-between gap-control-gap",
+													children: [/* @__PURE__ */ g("h3", {
+														className: "min-w-0 break-words font-medium text-text-primary",
+														children: [
+															t + 1,
+															".",
+															" ",
+															e.stageName ?? M.stages.find((t) => t.id === e.stageId)?.parserName ?? e.stageId
+														]
+													}), /* @__PURE__ */ g("span", {
+														className: "text-sm text-text-secondary",
+														children: [
+															e.status,
+															" · ",
+															e.executionTimeMs,
+															" ms"
+														]
+													})]
+												}),
+												e.error && /* @__PURE__ */ h("p", {
+													className: "mt-2 break-words text-sm text-status-error-text",
+													children: e.error
+												}),
+												e.output != null && /* @__PURE__ */ g("details", {
+													className: "mt-2",
+													children: [/* @__PURE__ */ h("summary", {
+														className: "cursor-pointer text-sm text-text-secondary",
+														children: T("bigconsole.pipelines.execution.stageOutput", "Stage output")
+													}), /* @__PURE__ */ h("pre", {
+														className: "mt-2 max-h-48 overflow-auto rounded-input bg-bg-canvas p-3 text-xs",
+														children: JSON.stringify(e.output, null, 2)
+													})]
+												})
+											]
+										}, e.id))
+									}),
+									R.error && /* @__PURE__ */ h("p", {
+										role: "alert",
+										className: "break-words text-sm text-status-error-text",
+										children: R.error
+									})
+								]
+							})
+						}),
+						we
+					] })
+				}), /* @__PURE__ */ h("div", {
 					className: "min-w-0",
-					children: /* @__PURE__ */ g(i, { children: /* @__PURE__ */ g(r, {
+					children: /* @__PURE__ */ g(i, { children: [/* @__PURE__ */ h(r, {
+						headingLevel: 2,
+						title: T("bigconsole.pipelines.execution.historyHeading", "Previous runs"),
+						"data-testid": "pipeline-execution-history",
+						children: I.filter((e) => e.pipelineId === l).length === 0 ? /* @__PURE__ */ h("p", {
+							className: "text-sm text-text-secondary",
+							children: T("bigconsole.pipelines.execution.noHistory", "No execution history yet. Test this pipeline with sample input to inspect its stages.")
+						}) : /* @__PURE__ */ h("ol", {
+							className: "flex flex-col gap-control-gap",
+							children: I.filter((e) => e.pipelineId === l).map((e) => /* @__PURE__ */ h("li", { children: /* @__PURE__ */ g("button", {
+								type: "button",
+								"aria-pressed": R?.id === e.id,
+								onClick: () => z(e),
+								className: `flex w-full min-w-0 flex-col gap-1 rounded-button border border-[var(--color-border-subtle)] p-3 text-left ${n} ${R?.id === e.id ? "bg-bg-sunken" : "bg-bg-surface"}`,
+								children: [
+									/* @__PURE__ */ g("span", {
+										className: "flex flex-wrap justify-between gap-2 text-sm font-medium text-text-primary",
+										children: [/* @__PURE__ */ h("span", { children: e.status }), /* @__PURE__ */ h("span", { children: e.totalExecutionTimeMs == null ? "—" : `${e.totalExecutionTimeMs} ms` })]
+									}),
+									/* @__PURE__ */ h("span", {
+										className: "break-words text-xs text-text-secondary",
+										children: new Date(e.startedAt).toLocaleString()
+									}),
+									/* @__PURE__ */ h("span", {
+										className: "truncate font-mono text-xs text-text-muted",
+										title: e.id,
+										children: e.id
+									})
+								]
+							}) }, e.id))
+						})
+					}), /* @__PURE__ */ h(r, {
 						emphasis: "muted",
 						headingLevel: 2,
-						title: O("bigconsole.pipelines.view.detailsHeading", "Details"),
+						title: T("bigconsole.pipelines.view.detailsHeading", "Details"),
 						"data-testid": "pipeline-details",
-						children: /* @__PURE__ */ _("dl", {
+						children: /* @__PURE__ */ g("dl", {
 							className: "flex flex-col gap-form-gap text-sm",
-							children: [/* @__PURE__ */ _("div", {
+							children: [/* @__PURE__ */ g("div", {
 								className: "flex flex-col gap-3",
 								children: [
-									/* @__PURE__ */ _("div", { children: [/* @__PURE__ */ g("dt", {
+									/* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("dt", {
 										className: "text-xs text-text-muted",
-										children: O("bigconsole.pipelines.view.detailStatus", "Status")
-									}), /* @__PURE__ */ g("dd", {
+										children: T("bigconsole.pipelines.view.detailStatus", "Status")
+									}), /* @__PURE__ */ h("dd", {
 										className: "mt-1",
-										children: /* @__PURE__ */ g(c, {
-											status: I.status,
+										children: /* @__PURE__ */ h(c, {
+											status: M.status,
 											size: "sm"
 										})
 									})] }),
-									/* @__PURE__ */ _("div", { children: [/* @__PURE__ */ g("dt", {
+									/* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("dt", {
 										className: "text-xs text-text-muted",
-										children: O("bigconsole.pipelines.view.detailStages", "Stages")
-									}), /* @__PURE__ */ g("dd", {
+										children: T("bigconsole.pipelines.view.detailStages", "Stages")
+									}), /* @__PURE__ */ h("dd", {
 										className: "text-text-primary",
 										children: Q
 									})] }),
-									/* @__PURE__ */ _("div", { children: [/* @__PURE__ */ g("dt", {
+									/* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("dt", {
 										className: "text-xs text-text-muted",
-										children: O("bigconsole.pipelines.view.detailLastExecuted", "Last Executed")
-									}), /* @__PURE__ */ g("dd", {
+										children: T("bigconsole.pipelines.view.detailLastExecuted", "Last Executed")
+									}), /* @__PURE__ */ h("dd", {
 										className: "break-words text-text-primary",
-										children: I.lastExecutedAt ? new Date(I.lastExecutedAt).toLocaleString(void 0, {
+										children: M.lastExecutedAt ? new Date(M.lastExecutedAt).toLocaleString(void 0, {
 											dateStyle: "medium",
 											timeStyle: "short"
-										}) : O("bigconsole.pipelines.view.detailNever", "Never")
+										}) : T("bigconsole.pipelines.view.detailNever", "Never")
 									})] })
 								]
-							}), /* @__PURE__ */ _("div", {
+							}), /* @__PURE__ */ g("div", {
 								className: "flex flex-col gap-3 border-t border-[var(--color-border-subtle)] pt-form-gap",
 								children: [
-									/* @__PURE__ */ _("div", { children: [/* @__PURE__ */ g("dt", {
+									/* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("dt", {
 										className: "text-xs text-text-muted",
-										children: O("bigconsole.pipelines.view.detailVersion", "Version")
-									}), /* @__PURE__ */ g("dd", {
+										children: T("bigconsole.pipelines.view.detailVersion", "Version")
+									}), /* @__PURE__ */ h("dd", {
 										className: "text-text-primary",
-										children: I.version
+										children: M.version
 									})] }),
-									/* @__PURE__ */ _("div", { children: [/* @__PURE__ */ g("dt", {
+									/* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("dt", {
 										className: "text-xs text-text-muted",
-										children: O("bigconsole.pipelines.view.detailCreated", "Created")
-									}), /* @__PURE__ */ g("dd", {
+										children: T("bigconsole.pipelines.view.detailCreated", "Created")
+									}), /* @__PURE__ */ h("dd", {
 										className: "break-words text-text-primary",
-										children: new Date(I.createdAt).toLocaleString(void 0, {
+										children: new Date(M.createdAt).toLocaleString(void 0, {
 											dateStyle: "medium",
 											timeStyle: "short"
 										})
 									})] }),
-									/* @__PURE__ */ _("div", { children: [/* @__PURE__ */ g("dt", {
+									/* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("dt", {
 										className: "text-xs text-text-muted",
-										children: O("bigconsole.pipelines.view.detailUpdated", "Updated")
-									}), /* @__PURE__ */ g("dd", {
+										children: T("bigconsole.pipelines.view.detailUpdated", "Updated")
+									}), /* @__PURE__ */ h("dd", {
 										className: "break-words text-text-primary",
-										children: new Date(I.updatedAt).toLocaleString(void 0, {
+										children: new Date(M.updatedAt).toLocaleString(void 0, {
 											dateStyle: "medium",
 											timeStyle: "short"
 										})
@@ -529,18 +669,18 @@ var y = "min-h-[var(--size-controlHeight-md)]", le = "rounded-pill bg-bg-sunken
 								]
 							})]
 						})
-					}) })
+					})] })
 				})]
 			})
-		] }), I && /* @__PURE__ */ g(te, {
-			pipeline: I,
-			isOpen: he,
-			onClose: W,
-			onConfirm: _e
+		] }), M && /* @__PURE__ */ h(te, {
+			pipeline: M,
+			isOpen: ye,
+			onClose: U,
+			onConfirm: xe
 		})]
 	});
 });
 //#endregion
-export { D as PipelineViewPage, D as default };
+export { w as PipelineViewPage, w as default };
 
 //# sourceMappingURL=PipelineViewPage.js.map