@burdenoff/microfe-bigconsole 2026.624.2 → 2026.625.1

package/dist/bigconsole/pages/PipelineViewPage.js

@@ -7,91 +7,92 @@ import a from "../components/pipeline/PipelineStatusBadge.js";
 import o from "../components/pipeline/PipelineDeleteDialog.js";
 import { memo as s, useCallback as c, useEffect as l, useState as u } from "react";
 import { useParams as d, useSearchParams as f } from "react-router-dom";
-import { Fragment as p, jsx as m, jsxs as h } from "react/jsx-runtime";
+import { GlassCard as p, IllustratedEmptyState as m, NextSteps as h, PagePurpose as g } from "@burdenoff/fe-libs/ui";
+import { Fragment as _, jsx as v, jsxs as y } from "react/jsx-runtime";
 //#region src/bigconsole/pages/PipelineViewPage.tsx
-var g = ({ className: e }) => /* @__PURE__ */ m("svg", {
+var b = ({ className: e }) => /* @__PURE__ */ v("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ m("path", {
+	children: /* @__PURE__ */ v("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 2,
 		d: "M10 19l-7-7m0 0l7-7m-7 7h18"
 	})
-}), _ = ({ className: e }) => /* @__PURE__ */ m("svg", {
+}), x = ({ className: e }) => /* @__PURE__ */ v("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ m("path", {
+	children: /* @__PURE__ */ v("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"
 	})
-}), v = ({ className: e }) => /* @__PURE__ */ m("svg", {
+}), S = ({ className: e }) => /* @__PURE__ */ v("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ m("path", {
+	children: /* @__PURE__ */ v("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"
 	})
-}), y = ({ className: e }) => /* @__PURE__ */ h("svg", {
+}), C = ({ className: e }) => /* @__PURE__ */ y("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: [/* @__PURE__ */ m("path", {
+	children: [/* @__PURE__ */ v("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__ */ m("path", {
+	}), /* @__PURE__ */ v("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 2,
 		d: "M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
 	})]
-}), b = ({ className: e }) => /* @__PURE__ */ m("svg", {
+}), w = ({ className: e }) => /* @__PURE__ */ v("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ m("path", {
+	children: /* @__PURE__ */ v("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 2,
 		d: "M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
 	})
-}), x = ({ className: e }) => /* @__PURE__ */ m("svg", {
+}), T = ({ className: e }) => /* @__PURE__ */ v("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ m("path", {
+	children: /* @__PURE__ */ v("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 2,
 		d: "M5 13l4 4L19 7"
 	})
-}), S = ({ className: e }) => /* @__PURE__ */ m("svg", {
+}), E = ({ className: e }) => /* @__PURE__ */ v("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ m("path", {
+	children: /* @__PURE__ */ v("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 2,
 		d: "M14 5l7 7m0 0l-7 7m7-7H3"
 	})
-}), C = ({ handling: e }) => {
+}), D = ({ handling: e }) => {
 	let t = {
 		fail: {
 			label: "Fail",
@@ -106,283 +107,313 @@ var g = ({ className: e }) => /* @__PURE__ */ m("svg", {
 			className: "bg-action-primary-bg/10 text-action-primary-bg"
 		}
 	}, n = t[e] || t.fail;
-	return /* @__PURE__ */ m("span", {
+	return /* @__PURE__ */ v("span", {
 		className: `px-1.5 py-0.5 text-xs font-medium rounded ${n.className}`,
 		children: n.label
 	});
-}, w = s(function() {
-	let { pipelineId: s } = d(), w = t(), T = "default", [E] = f(), [D, O] = u(null), [k, A] = u("{\n  \"data\": \"sample\"\n}"), [j, M] = u(null), [N, P] = u(E.get("test") === "true"), F = e((e) => e.deleteDialogOpen), I = e((e) => e.openDeleteDialog), L = e((e) => e.closeDeleteDialog), { loading: R, error: z, fetchPipeline: B, deletePipeline: V, testPipeline: H } = n({
-		consoleId: T,
+}, O = s(function() {
+	let { pipelineId: s } = d(), O = t(), k = "default", [A] = f(), [j, M] = u(null), [N, P] = u("{\n  \"data\": \"sample\"\n}"), [F, I] = u(null), [L, R] = u(A.get("test") === "true"), z = e((e) => e.deleteDialogOpen), B = e((e) => e.openDeleteDialog), V = e((e) => e.closeDeleteDialog), { loading: H, error: U, fetchPipeline: W, deletePipeline: G, testPipeline: K } = n({
+		consoleId: k,
 		skipFetch: !0
 	});
 	l(() => {
-		s && B(s).then((e) => {
-			e && O(e);
+		s && W(s).then((e) => {
+			e && M(e);
 		});
-	}, [s, B]);
-	let U = c(() => {
-		w("/pipelines");
-	}, [w]), W = c(() => {
-		w(`/pipelines/${s}/edit`);
-	}, [w, s]), G = c(() => {
-		D && I(D);
-	}, [D, I]), K = c(async () => {
-		D && (await V(D.id) ? (r() && i("success"), L(), w("/pipelines")) : r() && i("error"));
+	}, [s, W]);
+	let q = c(() => {
+		O("/pipelines");
+	}, [O]), J = c(() => {
+		O(`/pipelines/${s}/edit`);
+	}, [O, s]), Y = c(() => {
+		j && B(j);
+	}, [j, B]), X = c(async () => {
+		j && (await G(j.id) ? (r() && i("success"), V(), O("/pipelines")) : r() && i("error"));
 	}, [
-		D,
+		j,
+		G,
 		V,
-		L,
-		w
-	]), q = c((e) => {
-		w(`/dashboards/${T}/parsers/${e}`);
-	}, [w, T]), J = c(async () => {
-		if (D) try {
-			let e = await H({
-				pipelineId: D.id,
-				inputData: k
+		O
+	]), Z = c((e) => {
+		O(`/dashboards/${k}/parsers/${e}`);
+	}, [O, k]), Q = c(async () => {
+		if (j) try {
+			let e = await K({
+				pipelineId: j.id,
+				inputData: N
 			});
-			e && M(e);
+			e && I(e);
 		} catch {}
 	}, [
-		D,
-		H,
-		k
+		j,
+		K,
+		N
 	]);
-	return R && !D ? /* @__PURE__ */ m("div", {
+	return H && !j ? /* @__PURE__ */ v("div", {
 		className: "p-6",
-		children: /* @__PURE__ */ h("div", {
+		children: /* @__PURE__ */ y("div", {
 			className: "flex flex-col items-center justify-center py-16",
-			children: [/* @__PURE__ */ h("svg", {
+			children: [/* @__PURE__ */ y("svg", {
 				className: "w-8 h-8 text-action-primary-bg animate-spin mb-4",
 				fill: "none",
 				viewBox: "0 0 24 24",
-				children: [/* @__PURE__ */ m("circle", {
+				children: [/* @__PURE__ */ v("circle", {
 					className: "opacity-25",
 					cx: "12",
 					cy: "12",
 					r: "10",
 					stroke: "currentColor",
 					strokeWidth: "4"
-				}), /* @__PURE__ */ m("path", {
+				}), /* @__PURE__ */ v("path", {
 					className: "opacity-75",
 					fill: "currentColor",
 					d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
 				})]
-			}), /* @__PURE__ */ m("p", {
+			}), /* @__PURE__ */ v("p", {
 				className: "text-sm text-text-secondary",
 				children: "Loading Pipeline..."
 			})]
 		})
-	}) : z ? /* @__PURE__ */ m("div", {
+	}) : U ? /* @__PURE__ */ v("div", {
 		className: "p-6",
-		children: /* @__PURE__ */ h("div", {
+		children: /* @__PURE__ */ y("div", {
 			className: "flex flex-col items-center justify-center py-16 text-center",
 			children: [
-				/* @__PURE__ */ m("div", {
+				/* @__PURE__ */ v("div", {
 					className: "p-3 rounded-full bg-state-error/10 mb-4",
-					children: /* @__PURE__ */ m(b, { className: "w-8 h-8 text-state-error" })
+					children: /* @__PURE__ */ v(w, { className: "w-8 h-8 text-state-error" })
 				}),
-				/* @__PURE__ */ m("h3", {
+				/* @__PURE__ */ v("h3", {
 					className: "text-lg font-medium text-text-primary mb-2",
 					children: "Failed to load Pipeline"
 				}),
-				/* @__PURE__ */ m("p", {
+				/* @__PURE__ */ v("p", {
 					className: "text-sm text-text-secondary mb-4",
-					children: z.message
+					children: U.message
 				}),
-				/* @__PURE__ */ m("button", {
+				/* @__PURE__ */ v("button", {
 					type: "button",
-					onClick: U,
+					onClick: q,
 					className: "px-4 py-2 text-sm font-medium text-action-primary-fg bg-action-primary-bg hover:bg-action-primary-bgHover rounded-md transition-colors",
 					children: "Back to Pipelines"
 				})
 			]
 		})
-	}) : D ? /* @__PURE__ */ h("div", {
+	}) : j ? /* @__PURE__ */ y("div", {
 		className: "p-6",
 		children: [
-			/* @__PURE__ */ h("div", {
+			/* @__PURE__ */ y("div", {
 				className: "flex items-center justify-between mb-6",
-				children: [/* @__PURE__ */ h("div", {
+				children: [/* @__PURE__ */ y("div", {
 					className: "flex items-center gap-4",
-					children: [/* @__PURE__ */ m("button", {
+					children: [/* @__PURE__ */ v("button", {
 						type: "button",
-						onClick: U,
+						onClick: q,
 						className: "p-2 text-text-secondary hover:text-text-primary hover:bg-bg-sunken rounded-md transition-colors",
-						children: /* @__PURE__ */ m(g, { className: "w-5 h-5" })
-					}), /* @__PURE__ */ h("div", { children: [/* @__PURE__ */ h("div", {
+						children: /* @__PURE__ */ v(b, { className: "w-5 h-5" })
+					}), /* @__PURE__ */ y("div", { children: [/* @__PURE__ */ y("div", {
 						className: "flex items-center gap-3",
-						children: [/* @__PURE__ */ m("h1", {
+						children: [/* @__PURE__ */ v("h1", {
 							className: "text-2xl font-bold text-text-primary",
-							children: D.name
-						}), /* @__PURE__ */ m(a, { status: D.status })]
-					}), D.description && /* @__PURE__ */ m("p", {
+							children: j.name
+						}), /* @__PURE__ */ v(a, { status: j.status })]
+					}), j.description && /* @__PURE__ */ v("p", {
 						className: "text-sm text-text-secondary mt-1",
-						children: D.description
+						children: j.description
 					})] })]
-				}), /* @__PURE__ */ h("div", {
+				}), /* @__PURE__ */ y("div", {
 					className: "flex items-center gap-2",
 					children: [
-						/* @__PURE__ */ h("button", {
+						/* @__PURE__ */ y("button", {
 							type: "button",
-							onClick: () => P(!N),
+							onClick: () => R(!L),
 							className: "inline-flex items-center gap-2 px-3 py-2 text-sm font-medium text-state-success bg-state-success/10 hover:bg-state-success/20 rounded-md transition-colors",
-							children: [/* @__PURE__ */ m(y, { className: "w-4 h-4" }), "Test"]
+							children: [/* @__PURE__ */ v(C, { className: "w-4 h-4" }), "Test"]
 						}),
-						/* @__PURE__ */ h("button", {
+						/* @__PURE__ */ y("button", {
 							type: "button",
-							onClick: W,
+							onClick: J,
 							className: "inline-flex items-center gap-2 px-3 py-2 text-sm font-medium text-text-primary bg-bg-sunken hover:bg-border-default rounded-md transition-colors",
-							children: [/* @__PURE__ */ m(_, { className: "w-4 h-4" }), "Edit"]
+							children: [/* @__PURE__ */ v(x, { className: "w-4 h-4" }), "Edit"]
 						}),
-						/* @__PURE__ */ h("button", {
+						/* @__PURE__ */ y("button", {
 							type: "button",
-							onClick: G,
+							onClick: Y,
 							className: "inline-flex items-center gap-2 px-3 py-2 text-sm font-medium text-state-error bg-state-error/10 hover:bg-state-error/20 rounded-md transition-colors",
-							children: [/* @__PURE__ */ m(v, { className: "w-4 h-4" }), "Delete"]
+							children: [/* @__PURE__ */ v(S, { className: "w-4 h-4" }), "Delete"]
 						})
 					]
 				})]
 			}),
-			/* @__PURE__ */ h("div", {
+			/* @__PURE__ */ v(g, {
+				className: "mb-6",
+				children: "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__ */ v(h, {
+				storageKey: "bigconsole-pipeline-view",
+				steps: [
+					{
+						id: "test",
+						label: "Test with sample input",
+						description: "Run the pipeline against a sample to verify each stage.",
+						onClick: () => R(!0)
+					},
+					{
+						id: "edit",
+						label: "Edit the stages",
+						description: "Add, reorder, or configure the parsers in this pipeline.",
+						onClick: J
+					},
+					{
+						id: "sinks",
+						label: "Review the target data sink",
+						description: "See where the processed data lands.",
+						onClick: () => O("/datasinks")
+					}
+				]
+			}),
+			/* @__PURE__ */ y("div", {
 				className: "grid grid-cols-1 lg:grid-cols-3 gap-6",
-				children: [/* @__PURE__ */ h("div", {
+				children: [/* @__PURE__ */ y("div", {
 					className: "lg:col-span-2 space-y-6",
-					children: [/* @__PURE__ */ h("div", {
-						className: "bg-bg-surface border border-border-default rounded-lg p-6",
-						children: [/* @__PURE__ */ h("h2", {
+					children: [/* @__PURE__ */ y(p, {
+						treatment: "glass",
+						glow: !0,
+						className: "p-6",
+						children: [/* @__PURE__ */ y("h2", {
 							className: "text-lg font-semibold text-text-primary mb-4",
 							children: [
 								"Pipeline Stages (",
-								D.stages?.length || 0,
+								j.stages?.length || 0,
 								")"
 							]
-						}), !D.stages || D.stages.length === 0 ? /* @__PURE__ */ m("p", {
-							className: "text-sm text-text-secondary py-8 text-center",
-							children: "No stages defined. Edit the pipeline to add stages."
-						}) : /* @__PURE__ */ m("div", {
+						}), !j.stages || j.stages.length === 0 ? /* @__PURE__ */ v(m, {
+							illustration: "empty-generic",
+							title: "No stages defined",
+							description: "Edit the pipeline to add parser stages."
+						}) : /* @__PURE__ */ v("div", {
 							className: "space-y-3",
-							children: D.stages.map((e, t) => /* @__PURE__ */ h("div", {
+							children: j.stages.map((e, t) => /* @__PURE__ */ y("div", {
 								className: "flex items-center gap-3",
-								children: [/* @__PURE__ */ h("div", {
+								children: [/* @__PURE__ */ y("div", {
 									className: `
                         flex-1 p-4 rounded-lg border
                         ${e.enabled ? "bg-bg-surface border-border-default" : "bg-bg-sunken border-border-default opacity-60"}
                       `,
 									children: [
-										/* @__PURE__ */ h("div", {
+										/* @__PURE__ */ y("div", {
 											className: "flex items-center justify-between mb-2",
-											children: [/* @__PURE__ */ h("div", {
+											children: [/* @__PURE__ */ y("div", {
 												className: "flex items-center gap-2",
 												children: [
-													/* @__PURE__ */ m("span", {
+													/* @__PURE__ */ v("span", {
 														className: "w-6 h-6 flex items-center justify-center text-xs font-medium bg-action-primary-bg/10 text-action-primary-bg rounded-full",
 														children: t + 1
 													}),
-													/* @__PURE__ */ m("span", {
+													/* @__PURE__ */ v("span", {
 														className: "font-medium text-text-primary",
 														children: e.parserName || `Stage ${t + 1}`
 													}),
-													e.parserType && /* @__PURE__ */ m("span", {
+													e.parserType && /* @__PURE__ */ v("span", {
 														className: "px-1.5 py-0.5 text-xs font-medium bg-bg-sunken text-text-secondary rounded",
 														children: e.parserType.toUpperCase()
 													})
 												]
-											}), /* @__PURE__ */ h("div", {
+											}), /* @__PURE__ */ y("div", {
 												className: "flex items-center gap-2",
-												children: [/* @__PURE__ */ m(C, { handling: e.onError }), !e.enabled && /* @__PURE__ */ m("span", {
+												children: [/* @__PURE__ */ v(D, { handling: e.onError }), !e.enabled && /* @__PURE__ */ v("span", {
 													className: "px-1.5 py-0.5 text-xs font-medium bg-bg-sunken text-text-secondary rounded",
 													children: "Disabled"
 												})]
 											})]
 										}),
-										/* @__PURE__ */ h("div", {
+										/* @__PURE__ */ y("div", {
 											className: "flex items-center gap-2 text-xs text-text-secondary",
 											children: [
-												/* @__PURE__ */ m("span", {
+												/* @__PURE__ */ v("span", {
 													className: "font-mono bg-bg-sunken px-1.5 py-0.5 rounded",
 													children: e.inputKey
 												}),
-												/* @__PURE__ */ m(S, { className: "w-3 h-3" }),
-												/* @__PURE__ */ m("span", {
+												/* @__PURE__ */ v(E, { className: "w-3 h-3" }),
+												/* @__PURE__ */ v("span", {
 													className: "font-mono bg-bg-sunken px-1.5 py-0.5 rounded",
 													children: e.outputKey
 												})
 											]
 										}),
-										e.description && /* @__PURE__ */ m("p", {
+										e.description && /* @__PURE__ */ v("p", {
 											className: "text-xs text-text-secondary mt-2",
 											children: e.description
 										}),
-										e.parserId && /* @__PURE__ */ m("button", {
+										e.parserId && /* @__PURE__ */ v("button", {
 											type: "button",
-											onClick: () => q(e.parserId),
+											onClick: () => Z(e.parserId),
 											className: "mt-2 text-xs text-action-primary-bg hover:underline",
 											children: "View Parser"
 										})
 									]
-								}), t < (D.stages?.length || 0) - 1 && /* @__PURE__ */ m(S, { className: "w-5 h-5 text-text-secondary flex-shrink-0 hidden md:block" })]
+								}), t < (j.stages?.length || 0) - 1 && /* @__PURE__ */ v(E, { className: "w-5 h-5 text-text-secondary flex-shrink-0 hidden md:block" })]
 							}, e.id))
 						})]
-					}), N && /* @__PURE__ */ h("div", {
+					}), L && /* @__PURE__ */ y("div", {
 						className: "bg-bg-surface border border-border-default rounded-lg p-6",
-						children: [/* @__PURE__ */ m("h2", {
+						children: [/* @__PURE__ */ v("h2", {
 							className: "text-lg font-semibold text-text-primary mb-4",
 							children: "Test Pipeline"
-						}), /* @__PURE__ */ h("div", {
+						}), /* @__PURE__ */ y("div", {
 							className: "space-y-4",
 							children: [
-								/* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("label", {
+								/* @__PURE__ */ y("div", { children: [/* @__PURE__ */ v("label", {
 									className: "block text-sm font-medium text-text-primary mb-2",
 									children: "Input JSON"
-								}), /* @__PURE__ */ m("textarea", {
-									value: k,
-									onChange: (e) => A(e.target.value),
+								}), /* @__PURE__ */ v("textarea", {
+									value: N,
+									onChange: (e) => P(e.target.value),
 									className: "w-full h-32 px-3 py-2 text-sm font-mono text-text-primary bg-bg-sunken border border-border-default rounded-md focus:outline-none focus:ring-2 focus:ring-action-primary-bg resize-none",
 									placeholder: "{\"key\": \"value\"}"
 								})] }),
-								/* @__PURE__ */ h("button", {
+								/* @__PURE__ */ y("button", {
 									type: "button",
-									onClick: J,
-									disabled: R,
+									onClick: Q,
+									disabled: H,
 									className: "inline-flex items-center gap-2 px-4 py-2 text-sm font-medium text-action-primary-fg bg-action-primary-bg hover:bg-action-primary-bgHover rounded-md transition-colors disabled:opacity-50",
-									children: [/* @__PURE__ */ m(y, { className: "w-4 h-4" }), R ? "Running..." : "Run Test"]
+									children: [/* @__PURE__ */ v(C, { className: "w-4 h-4" }), H ? "Running..." : "Run Test"]
 								}),
-								j && /* @__PURE__ */ h("div", {
+								F && /* @__PURE__ */ y("div", {
 									className: "mt-4",
 									children: [
-										/* @__PURE__ */ h("div", {
+										/* @__PURE__ */ y("div", {
 											className: "flex items-center gap-2 mb-2",
-											children: [j.status === "completed" ? /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m(x, { className: "w-4 h-4 text-state-success" }), /* @__PURE__ */ m("span", {
+											children: [F.status === "completed" ? /* @__PURE__ */ y(_, { children: [/* @__PURE__ */ v(T, { className: "w-4 h-4 text-state-success" }), /* @__PURE__ */ v("span", {
 												className: "text-sm font-medium text-state-success",
 												children: "Test Passed"
-											})] }) : /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m(b, { className: "w-4 h-4 text-state-error" }), /* @__PURE__ */ m("span", {
+											})] }) : /* @__PURE__ */ y(_, { children: [/* @__PURE__ */ v(w, { className: "w-4 h-4 text-state-error" }), /* @__PURE__ */ v("span", {
 												className: "text-sm font-medium text-state-error",
 												children: "Test Failed"
-											})] }), j.totalExecutionTimeMs && /* @__PURE__ */ h("span", {
+											})] }), F.totalExecutionTimeMs && /* @__PURE__ */ y("span", {
 												className: "text-xs text-text-secondary",
 												children: [
 													"(",
-													j.totalExecutionTimeMs,
+													F.totalExecutionTimeMs,
 													"ms)"
 												]
 											})]
 										}),
-										/* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("label", {
+										/* @__PURE__ */ y("div", { children: [/* @__PURE__ */ v("label", {
 											className: "block text-sm font-medium text-text-primary mb-2",
 											children: "Output"
-										}), /* @__PURE__ */ m("pre", {
+										}), /* @__PURE__ */ v("pre", {
 											className: "w-full p-3 text-xs font-mono text-text-primary bg-bg-sunken border border-border-default rounded-md overflow-auto max-h-48",
-											children: JSON.stringify(j.outputData, null, 2) || "null"
+											children: JSON.stringify(F.outputData, null, 2) || "null"
 										})] }),
-										j.error && /* @__PURE__ */ h("div", {
+										F.error && /* @__PURE__ */ y("div", {
 											className: "mt-2",
-											children: [/* @__PURE__ */ m("label", {
+											children: [/* @__PURE__ */ v("label", {
 												className: "block text-sm font-medium text-state-error mb-2",
 												children: "Error"
-											}), /* @__PURE__ */ m("pre", {
+											}), /* @__PURE__ */ v("pre", {
 												className: "w-full p-3 text-xs font-mono text-state-error bg-state-error/10 border border-state-error/20 rounded-md overflow-auto",
-												children: j.error
+												children: F.error
 											})]
 										})
 									]
@@ -390,94 +421,86 @@ var g = ({ className: e }) => /* @__PURE__ */ m("svg", {
 							]
 						})]
 					})]
-				}), /* @__PURE__ */ m("div", {
+				}), /* @__PURE__ */ v("div", {
 					className: "space-y-6",
-					children: /* @__PURE__ */ h("div", {
+					children: /* @__PURE__ */ y("div", {
 						className: "bg-bg-surface border border-border-default rounded-lg p-6",
-						children: [/* @__PURE__ */ m("h2", {
+						children: [/* @__PURE__ */ v("h2", {
 							className: "text-lg font-semibold text-text-primary mb-4",
 							children: "Details"
-						}), /* @__PURE__ */ h("dl", {
+						}), /* @__PURE__ */ y("dl", {
 							className: "space-y-3",
 							children: [
-								/* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("dt", {
+								/* @__PURE__ */ y("div", { children: [/* @__PURE__ */ v("dt", {
 									className: "text-xs text-text-secondary",
 									children: "Status"
-								}), /* @__PURE__ */ m("dd", {
+								}), /* @__PURE__ */ v("dd", {
 									className: "mt-1",
-									children: /* @__PURE__ */ m(a, { status: D.status })
+									children: /* @__PURE__ */ v(a, { status: j.status })
 								})] }),
-								/* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("dt", {
+								/* @__PURE__ */ y("div", { children: [/* @__PURE__ */ v("dt", {
 									className: "text-xs text-text-secondary",
 									children: "Stages"
-								}), /* @__PURE__ */ m("dd", {
+								}), /* @__PURE__ */ v("dd", {
 									className: "text-sm text-text-primary",
-									children: D.stages?.length || 0
+									children: j.stages?.length || 0
 								})] }),
-								/* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("dt", {
+								/* @__PURE__ */ y("div", { children: [/* @__PURE__ */ v("dt", {
 									className: "text-xs text-text-secondary",
 									children: "Last Executed"
-								}), /* @__PURE__ */ m("dd", {
+								}), /* @__PURE__ */ v("dd", {
 									className: "text-sm text-text-primary",
-									children: D.lastExecutedAt ? new Date(D.lastExecutedAt).toLocaleString() : "Never"
+									children: j.lastExecutedAt ? new Date(j.lastExecutedAt).toLocaleString() : "Never"
 								})] }),
-								/* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("dt", {
+								/* @__PURE__ */ y("div", { children: [/* @__PURE__ */ v("dt", {
 									className: "text-xs text-text-secondary",
 									children: "Version"
-								}), /* @__PURE__ */ m("dd", {
+								}), /* @__PURE__ */ v("dd", {
 									className: "text-sm text-text-primary",
-									children: D.version
+									children: j.version
 								})] }),
-								/* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("dt", {
+								/* @__PURE__ */ y("div", { children: [/* @__PURE__ */ v("dt", {
 									className: "text-xs text-text-secondary",
 									children: "Created"
-								}), /* @__PURE__ */ m("dd", {
+								}), /* @__PURE__ */ v("dd", {
 									className: "text-sm text-text-primary",
-									children: new Date(D.createdAt).toLocaleString()
+									children: new Date(j.createdAt).toLocaleString()
 								})] }),
-								/* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("dt", {
+								/* @__PURE__ */ y("div", { children: [/* @__PURE__ */ v("dt", {
 									className: "text-xs text-text-secondary",
 									children: "Updated"
-								}), /* @__PURE__ */ m("dd", {
+								}), /* @__PURE__ */ v("dd", {
 									className: "text-sm text-text-primary",
-									children: new Date(D.updatedAt).toLocaleString()
+									children: new Date(j.updatedAt).toLocaleString()
 								})] })
 							]
 						})]
 					})
 				})]
 			}),
-			D && /* @__PURE__ */ m(o, {
-				pipeline: D,
-				isOpen: F,
-				onClose: L,
-				onConfirm: K
+			j && /* @__PURE__ */ v(o, {
+				pipeline: j,
+				isOpen: z,
+				onClose: V,
+				onConfirm: X
 			})
 		]
-	}) : /* @__PURE__ */ m("div", {
+	}) : /* @__PURE__ */ v("div", {
 		className: "p-6",
-		children: /* @__PURE__ */ h("div", {
-			className: "flex flex-col items-center justify-center py-16 text-center",
-			children: [
-				/* @__PURE__ */ m("h3", {
-					className: "text-lg font-medium text-text-primary mb-2",
-					children: "Pipeline not found"
-				}),
-				/* @__PURE__ */ m("p", {
-					className: "text-sm text-text-secondary mb-4",
-					children: "The pipeline you're looking for doesn't exist or has been deleted."
-				}),
-				/* @__PURE__ */ m("button", {
-					type: "button",
-					onClick: U,
-					className: "px-4 py-2 text-sm font-medium text-action-primary-fg bg-action-primary-bg hover:bg-action-primary-bgHover rounded-md transition-colors",
-					children: "Back to Pipelines"
-				})
-			]
+		children: /* @__PURE__ */ v(m, {
+			illustration: "empty-data",
+			title: "Pipeline not found",
+			description: "The pipeline you're looking for doesn't exist or has been deleted.",
+			action: /* @__PURE__ */ v("button", {
+				type: "button",
+				onClick: q,
+				className: "px-4 py-2 text-sm font-medium text-action-primary-fg bg-action-primary-bg hover:bg-action-primary-bgHover rounded-md transition-colors",
+				children: "Back to Pipelines"
+			})
 		})
 	});
 });
 //#endregion
-export { w as PipelineViewPage, w as default };
+export { O as PipelineViewPage, O as default };
 
 //# sourceMappingURL=PipelineViewPage.js.map