@burdenoff/microfe-bigconsole 2026.624.2 → 2026.625.1

package/dist/bigconsole/pages/WorkflowViewPage.js

@@ -4,169 +4,159 @@ import t from "../hooks/useWorkflowOperations.js";
 import { BOOTSTRAP_RETRY_DELAY_MS as n } from "../constants.js";
 import { useBigConsole as r } from "../context/BigConsoleContext.js";
 import "../context/index.js";
-import { isNative as i, nativeCopyText as a, nativeNotify as o, nativeToast as s } from "../../utils/nativeBridge.js";
-import ee from "../components/workflow/WorkflowStatusBadge.js";
-import c from "../components/workflow/WorkflowDeleteDialog.js";
-import { memo as l, useCallback as u, useEffect as d, useState as f } from "react";
-import { useParams as te } from "react-router-dom";
-import { Fragment as p, jsx as m, jsxs as h } from "react/jsx-runtime";
-import { WorkflowBuilder as g } from "@burdenoff/fluidgrids-fe-sdk";
-import { formatDistanceToNow as _ } from "date-fns";
+import { isNative as i, nativeCopyText as a, nativeNotify as o, nativeToast as ee } from "../../utils/nativeBridge.js";
+import te from "../components/workflow/WorkflowStatusBadge.js";
+import s from "../components/workflow/WorkflowDeleteDialog.js";
+import { memo as c, useCallback as l, useEffect as u, useState as d } from "react";
+import { useParams as f } from "react-router-dom";
+import { GlassCard as ne, IllustratedEmptyState as p, NextSteps as m, PagePurpose as h } from "@burdenoff/fe-libs/ui";
+import { Fragment as g, jsx as _, jsxs as v } from "react/jsx-runtime";
+import { WorkflowBuilder as y } from "@burdenoff/fluidgrids-fe-sdk";
+import { formatDistanceToNow as b } from "date-fns";
 //#region src/bigconsole/pages/WorkflowViewPage.tsx
-var v = ({ className: e }) => /* @__PURE__ */ m("svg", {
+var x = ({ className: e }) => /* @__PURE__ */ _("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ m("path", {
+	children: /* @__PURE__ */ _("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 2,
 		d: "M15 19l-7-7 7-7"
 	})
-}), ne = ({ className: e }) => /* @__PURE__ */ m("svg", {
+}), S = ({ className: e }) => /* @__PURE__ */ _("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ m("path", {
+	children: /* @__PURE__ */ _("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"
 	})
-}), y = ({ className: e }) => /* @__PURE__ */ m("svg", {
+}), C = ({ className: e }) => /* @__PURE__ */ _("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ m("path", {
+	children: /* @__PURE__ */ _("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"
 	})
-}), b = ({ className: e }) => /* @__PURE__ */ h("svg", {
+}), w = ({ className: e }) => /* @__PURE__ */ v("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: [/* @__PURE__ */ m("path", {
+	children: [/* @__PURE__ */ _("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__ */ _("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 2,
 		d: "M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
 	})]
-}), x = ({ className: e }) => /* @__PURE__ */ m("svg", {
+}), T = ({ className: e }) => /* @__PURE__ */ _("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ m("path", {
+	children: /* @__PURE__ */ _("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 2,
 		d: "M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"
 	})
-}), S = ({ className: e }) => /* @__PURE__ */ m("svg", {
+}), E = ({ className: e }) => /* @__PURE__ */ _("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ m("path", {
+	children: /* @__PURE__ */ _("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 2,
 		d: "M5 13l4 4L19 7"
 	})
-}), C = ({ className: e }) => /* @__PURE__ */ m("svg", {
+}), D = ({ className: e }) => /* @__PURE__ */ _("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ m("path", {
+	children: /* @__PURE__ */ _("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 2,
 		d: "M4 7v10c0 2.21 3.582 4 8 4s8-1.79 8-4V7M4 7c0 2.21 3.582 4 8 4s8-1.79 8-4M4 7c0-2.21 3.582-4 8-4s8 1.79 8 4"
 	})
-}), w = ({ className: e }) => /* @__PURE__ */ m("svg", {
+}), re = ({ className: e }) => /* @__PURE__ */ _("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ m("path", {
-		strokeLinecap: "round",
-		strokeLinejoin: "round",
-		strokeWidth: 2,
-		d: "M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
-	})
-}), T = ({ className: e }) => /* @__PURE__ */ m("svg", {
-	className: e,
-	fill: "none",
-	stroke: "currentColor",
-	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ m("path", {
+	children: /* @__PURE__ */ _("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 2,
 		d: "M19 9l-7 7-7-7"
 	})
-}), E = l(function() {
-	let l = e(), { workflowId: E } = te(), { apiGatewayUrl: D, authToken: O, workspaceId: k } = r(), [A, j] = f(null), [M, N] = f(!1), [, P] = f(!1), [F, I] = f(!1), [L, R] = f(!1), [z, B] = f(!1), [V, H] = f(!1), [U, W] = f(null), { loading: G, error: K, fetchWorkflow: q, deleteWorkflow: J, executeWorkflow: Y, pollWorkflowExecution: X } = t({ skipFetch: !0 });
-	d(() => {
-		if (!E) {
-			H(!0);
+}), O = c(function() {
+	let c = e(), { workflowId: O } = f(), { apiGatewayUrl: ie, authToken: ae, workspaceId: oe } = r(), [k, A] = d(null), [j, M] = d(!1), [, N] = d(!1), [P, F] = d(!1), [I, L] = d(!1), [R, z] = d(!1), [B, V] = d(!1), [H, U] = d(null), { loading: W, error: G, fetchWorkflow: K, deleteWorkflow: q, executeWorkflow: J, pollWorkflowExecution: Y } = t({ skipFetch: !0 });
+	u(() => {
+		if (!O) {
+			V(!0);
 			return;
 		}
 		let e = !1, t = async (r) => {
 			try {
-				let i = await q(E);
+				let i = await K(O);
 				if (e) return;
-				i ? (j(i), H(!0)) : r === 0 ? setTimeout(() => {
+				i ? (A(i), V(!0)) : r === 0 ? setTimeout(() => {
 					e || t(1);
-				}, n) : H(!0);
+				}, n) : V(!0);
 			} catch {
-				e || H(!0);
+				e || V(!0);
 			}
 		};
 		return t(0), () => {
 			e = !0;
 		};
-	}, [E, q]);
-	let Z = u(() => {
-		l("/workflows");
-	}, [l]), re = u(() => {
-		l(`/workflows/${E}/edit`);
-	}, [l, E]), Q = u(async () => {
-		if (E) {
-			P(!0);
+	}, [O, K]);
+	let X = l(() => {
+		c("/workflows");
+	}, [c]), Z = l(() => {
+		c(`/workflows/${O}/edit`);
+	}, [c, O]), se = l(async () => {
+		if (O) {
+			N(!0);
 			try {
-				await J(E) ? (i() && o("success"), l("/workflows")) : i() && o("error");
+				await q(O) ? (i() && o("success"), c("/workflows")) : i() && o("error");
 			} catch {
 				i() && o("error");
 			} finally {
-				P(!1), N(!1);
+				N(!1), M(!1);
 			}
 		}
 	}, [
-		E,
-		J,
-		l
-	]), ie = u(async () => {
-		if (!E) return;
-		I(!0), W(null);
+		O,
+		q,
+		c
+	]), Q = l(async () => {
+		if (!O) return;
+		F(!0), U(null);
 		let e = Date.now();
 		try {
-			let t = await Y(E);
+			let t = await J(O);
 			if (t) {
 				let n = Date.now() - e;
-				t.externalWorkflowId ? (W({
+				t.externalWorkflowId ? (U({
 					success: !0,
 					output: {
 						externalWorkflowId: t.externalWorkflowId,
@@ -175,14 +165,14 @@ var v = ({ className: e }) => /* @__PURE__ */ m("svg", {
 					},
 					error: null,
 					executionTimeMs: n
-				}), X(E, {
+				}), Y(O, {
 					intervalMs: 3e3,
 					timeoutMs: 12e4,
 					onProgress: (e) => {
-						j(e);
+						A(e);
 					}
 				}).then((t) => {
-					t && (j(t), W((n) => n && {
+					t && (A(t), U((n) => n && {
 						...n,
 						output: {
 							...n.output || {},
@@ -192,7 +182,7 @@ var v = ({ className: e }) => /* @__PURE__ */ m("svg", {
 						},
 						executionTimeMs: Date.now() - e
 					}));
-				})) : W({
+				})) : U({
 					success: !0,
 					output: {
 						executionCount: t.executionCount,
@@ -202,278 +192,302 @@ var v = ({ className: e }) => /* @__PURE__ */ m("svg", {
 					error: null,
 					executionTimeMs: n
 				});
-				let r = await q(E);
-				r && j(r);
+				let r = await K(O);
+				r && A(r);
 			}
 		} catch (t) {
-			W({
+			U({
 				success: !1,
 				output: null,
 				error: t instanceof Error ? t.message : "Execution failed",
 				executionTimeMs: Date.now() - e
 			});
 		} finally {
-			I(!1);
+			F(!1);
 		}
 	}, [
-		E,
-		Y,
-		q,
-		X
-	]), ae = u(async () => {
-		if (A?.webhookUrl) try {
-			await a(A.webhookUrl), R(!0), i() && s("Webhook copied"), setTimeout(() => R(!1), 2e3);
+		O,
+		J,
+		K,
+		Y
+	]), ce = l(async () => {
+		if (k?.webhookUrl) try {
+			await a(k.webhookUrl), L(!0), i() && ee("Webhook copied"), setTimeout(() => L(!1), 2e3);
 		} catch {}
-	}, [A?.webhookUrl]), oe = u((e) => {
-		l(`/datasinks/${e}`);
-	}, [l]);
-	if (!V || G && !A) return /* @__PURE__ */ m("div", {
+	}, [k?.webhookUrl]), le = l((e) => {
+		c(`/datasinks/${e}`);
+	}, [c]);
+	if (!B || W && !k) return /* @__PURE__ */ _("div", {
 		className: "p-6 flex items-center justify-center min-h-[400px]",
-		children: /* @__PURE__ */ h("svg", {
+		children: /* @__PURE__ */ v("svg", {
 			className: "w-8 h-8 text-action-primary-bg animate-spin",
 			fill: "none",
 			viewBox: "0 0 24 24",
-			children: [/* @__PURE__ */ m("circle", {
+			children: [/* @__PURE__ */ _("circle", {
 				className: "opacity-25",
 				cx: "12",
 				cy: "12",
 				r: "10",
 				stroke: "currentColor",
 				strokeWidth: "4"
-			}), /* @__PURE__ */ m("path", {
+			}), /* @__PURE__ */ _("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"
 			})]
 		})
 	});
-	if (K || !A) return /* @__PURE__ */ h("div", {
+	if (G || !k) return /* @__PURE__ */ v("div", {
 		className: "p-6",
-		children: [/* @__PURE__ */ h("button", {
+		children: [/* @__PURE__ */ v("button", {
 			type: "button",
-			onClick: Z,
+			onClick: X,
 			className: "inline-flex items-center gap-1 text-sm text-text-secondary hover:text-text-primary mb-4",
-			children: [/* @__PURE__ */ m(v, { className: "w-4 h-4" }), "Back to Workflows"]
-		}), /* @__PURE__ */ h("div", {
-			className: "flex flex-col items-center justify-center py-16 text-center",
-			children: [
-				/* @__PURE__ */ m("div", {
-					className: "p-3 rounded-full bg-state-error/10 mb-4",
-					children: /* @__PURE__ */ m(w, { className: "w-8 h-8 text-state-error" })
-				}),
-				/* @__PURE__ */ m("h3", {
-					className: "text-lg font-medium text-text-primary mb-2",
-					children: "Workflow not found"
-				}),
-				/* @__PURE__ */ m("p", {
-					className: "text-sm text-text-secondary",
-					children: K?.message || "The workflow you are looking for does not exist."
-				})
-			]
+			children: [/* @__PURE__ */ _(x, { className: "w-4 h-4" }), "Back to Workflows"]
+		}), /* @__PURE__ */ _(p, {
+			illustration: "empty-data",
+			title: "Workflow not found",
+			description: G?.message || "The workflow you are looking for does not exist."
 		})]
 	});
-	let $ = A.dataSinkLinks?.length || 0;
-	return /* @__PURE__ */ h("div", {
+	let $ = k.dataSinkLinks?.length || 0;
+	return /* @__PURE__ */ v("div", {
 		className: "p-6 max-w-5xl mx-auto",
 		children: [
-			/* @__PURE__ */ h("div", {
+			/* @__PURE__ */ v("div", {
 				className: "mb-8",
-				children: [/* @__PURE__ */ h("button", {
+				children: [/* @__PURE__ */ v("button", {
 					type: "button",
-					onClick: Z,
+					onClick: X,
 					className: "inline-flex items-center gap-1 text-sm text-text-secondary hover:text-text-primary mb-4",
-					children: [/* @__PURE__ */ m(v, { className: "w-4 h-4" }), "Back to Workflows"]
-				}), /* @__PURE__ */ h("div", {
+					children: [/* @__PURE__ */ _(x, { className: "w-4 h-4" }), "Back to Workflows"]
+				}), /* @__PURE__ */ v("div", {
 					className: "flex items-start justify-between",
-					children: [/* @__PURE__ */ h("div", { children: [
-						/* @__PURE__ */ h("div", {
+					children: [/* @__PURE__ */ v("div", { children: [
+						/* @__PURE__ */ v("div", {
 							className: "flex items-center gap-3 mb-2",
-							children: [/* @__PURE__ */ m("h1", {
+							children: [/* @__PURE__ */ _("h1", {
 								className: "text-2xl font-bold text-text-primary",
-								children: A.name
-							}), /* @__PURE__ */ m(ee, { status: A.status })]
+								children: k.name
+							}), /* @__PURE__ */ _(te, { status: k.status })]
 						}),
-						/* @__PURE__ */ m("p", {
+						/* @__PURE__ */ _("p", {
 							className: "text-sm text-text-secondary font-mono",
-							children: A.key
+							children: k.key
 						}),
-						A.externalWorkflowId && /* @__PURE__ */ h("p", {
+						k.externalWorkflowId && /* @__PURE__ */ v("p", {
 							className: "text-xs text-text-tertiary mt-1",
-							children: ["FluidGrids ID: ", /* @__PURE__ */ m("span", {
+							children: ["FluidGrids ID: ", /* @__PURE__ */ _("span", {
 								className: "font-mono",
-								children: A.externalWorkflowId
+								children: k.externalWorkflowId
 							})]
 						})
-					] }), /* @__PURE__ */ h("div", {
+					] }), /* @__PURE__ */ v("div", {
 						className: "flex items-center gap-2",
 						children: [
-							/* @__PURE__ */ h("button", {
+							/* @__PURE__ */ v("button", {
 								type: "button",
-								onClick: ie,
-								disabled: F,
+								onClick: Q,
+								disabled: P,
 								className: "inline-flex items-center gap-2 px-4 py-2 text-sm font-medium text-white bg-state-success hover:bg-state-success/90 rounded-md transition-colors disabled:opacity-50",
-								children: [/* @__PURE__ */ m(b, { className: "w-4 h-4" }), F ? "Executing..." : "Execute"]
+								children: [/* @__PURE__ */ _(w, { className: "w-4 h-4" }), P ? "Executing..." : "Execute"]
 							}),
-							/* @__PURE__ */ h("button", {
+							/* @__PURE__ */ v("button", {
 								type: "button",
-								onClick: re,
+								onClick: Z,
 								className: "inline-flex items-center gap-2 px-4 py-2 text-sm font-medium text-text-primary bg-bg-sunken hover:bg-border-default rounded-md transition-colors",
-								children: [/* @__PURE__ */ m(ne, { className: "w-4 h-4" }), "Edit"]
+								children: [/* @__PURE__ */ _(S, { className: "w-4 h-4" }), "Edit"]
 							}),
-							/* @__PURE__ */ h("button", {
+							/* @__PURE__ */ v("button", {
 								type: "button",
-								onClick: () => N(!0),
+								onClick: () => M(!0),
 								className: "inline-flex items-center gap-2 px-4 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(y, { className: "w-4 h-4" }), "Delete"]
+								children: [/* @__PURE__ */ _(C, { className: "w-4 h-4" }), "Delete"]
 							})
 						]
 					})]
 				})]
 			}),
-			U && /* @__PURE__ */ h("div", {
-				className: `mb-6 p-4 rounded-lg border ${U.success ? "bg-state-success/10 border-state-success/20" : "bg-state-error/10 border-state-error/20"}`,
+			/* @__PURE__ */ _(h, {
+				className: "mb-6",
+				children: "A workflow is the visual ETL job that feeds this BigConsole — it fetches, transforms, and delivers data into linked data sinks. From here you can run it on demand, inspect its design and execution history, copy its webhook trigger, and edit it in the visual builder."
+			}),
+			/* @__PURE__ */ _(m, {
+				storageKey: "bigconsole-workflow-view",
+				steps: [
+					{
+						id: "execute",
+						label: "Run the workflow",
+						description: "Trigger an execution to pull fresh data now.",
+						onClick: Q
+					},
+					{
+						id: "design",
+						label: "Inspect the design",
+						description: "Expand the read-only preview to see each step.",
+						onClick: () => z(!0)
+					},
+					{
+						id: "edit",
+						label: "Edit in the builder",
+						description: "Open the FluidGrids visual builder to change the flow.",
+						onClick: Z
+					},
+					{
+						id: "sinks",
+						label: "Check the linked data sinks",
+						description: "See where this workflow writes its output.",
+						onClick: () => c("/datasinks")
+					}
+				]
+			}),
+			H && /* @__PURE__ */ v("div", {
+				className: `mb-6 p-4 rounded-lg border ${H.success ? "bg-state-success/10 border-state-success/20" : "bg-state-error/10 border-state-error/20"}`,
 				children: [
-					/* @__PURE__ */ h("div", {
+					/* @__PURE__ */ v("div", {
 						className: "flex items-center justify-between mb-2",
-						children: [/* @__PURE__ */ m("h3", {
+						children: [/* @__PURE__ */ _("h3", {
 							className: "text-sm font-semibold text-text-primary",
-							children: U.success ? "Execution Triggered" : "Execution Failed"
-						}), /* @__PURE__ */ h("span", {
+							children: H.success ? "Execution Triggered" : "Execution Failed"
+						}), /* @__PURE__ */ v("span", {
 							className: "text-xs text-text-secondary",
-							children: [U.executionTimeMs, "ms"]
+							children: [H.executionTimeMs, "ms"]
 						})]
 					}),
-					U.error ? /* @__PURE__ */ m("p", {
+					H.error ? /* @__PURE__ */ _("p", {
 						className: "text-sm text-state-error",
-						children: U.error
-					}) : /* @__PURE__ */ m("pre", {
+						children: H.error
+					}) : /* @__PURE__ */ _("pre", {
 						className: "text-xs text-text-secondary font-mono bg-bg-sunken p-2 rounded overflow-auto max-h-[200px]",
-						children: JSON.stringify(U.output, null, 2)
+						children: JSON.stringify(H.output, null, 2)
 					}),
-					U.runId && /* @__PURE__ */ h("p", {
+					H.runId && /* @__PURE__ */ v("p", {
 						className: "text-xs text-text-tertiary mt-2",
-						children: ["Run ID: ", /* @__PURE__ */ m("span", {
+						children: ["Run ID: ", /* @__PURE__ */ _("span", {
 							className: "font-mono",
-							children: U.runId
+							children: H.runId
 						})]
 					})
 				]
 			}),
-			/* @__PURE__ */ h("div", {
+			/* @__PURE__ */ v("div", {
 				className: "grid grid-cols-1 md:grid-cols-2 gap-6 mb-8",
-				children: [/* @__PURE__ */ h("div", {
+				children: [/* @__PURE__ */ v("div", {
 					className: "bg-bg-surface border border-border-default rounded-lg p-4",
-					children: [/* @__PURE__ */ m("h3", {
+					children: [/* @__PURE__ */ _("h3", {
 						className: "text-sm font-medium text-text-secondary mb-2",
 						children: "Description"
-					}), /* @__PURE__ */ m("p", {
+					}), /* @__PURE__ */ _("p", {
 						className: "text-sm text-text-primary",
-						children: A.description || "No description"
+						children: k.description || "No description"
 					})]
-				}), /* @__PURE__ */ h("div", {
-					className: "bg-bg-surface border border-border-default rounded-lg p-4",
-					children: [/* @__PURE__ */ m("h3", {
+				}), /* @__PURE__ */ v(ne, {
+					treatment: "glass",
+					glow: !0,
+					className: "p-4",
+					children: [/* @__PURE__ */ _("h3", {
 						className: "text-sm font-medium text-text-secondary mb-2",
 						children: "Execution Stats"
-					}), /* @__PURE__ */ h("div", {
+					}), /* @__PURE__ */ v("div", {
 						className: "grid grid-cols-2 gap-4",
-						children: [/* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("p", {
+						children: [/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("p", {
 							className: "text-2xl font-bold text-text-primary",
-							children: A.executionCount
-						}), /* @__PURE__ */ m("p", {
+							children: k.executionCount
+						}), /* @__PURE__ */ _("p", {
 							className: "text-xs text-text-secondary",
 							children: "Total Executions"
-						})] }), /* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("p", {
+						})] }), /* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("p", {
 							className: "text-sm font-medium text-text-primary",
-							children: A.lastExecutedAt ? _(new Date(A.lastExecutedAt), { addSuffix: !0 }) : "Never"
-						}), /* @__PURE__ */ m("p", {
+							children: k.lastExecutedAt ? b(new Date(k.lastExecutedAt), { addSuffix: !0 }) : "Never"
+						}), /* @__PURE__ */ _("p", {
 							className: "text-xs text-text-secondary",
 							children: "Last Executed"
 						})] })]
 					})]
 				})]
 			}),
-			A.webhookUrl && /* @__PURE__ */ h("div", {
+			k.webhookUrl && /* @__PURE__ */ v("div", {
 				className: "bg-bg-surface border border-border-default rounded-lg p-4 mb-8",
-				children: [/* @__PURE__ */ m("h3", {
+				children: [/* @__PURE__ */ _("h3", {
 					className: "text-sm font-medium text-text-secondary mb-2",
 					children: "Webhook URL"
-				}), /* @__PURE__ */ h("div", {
+				}), /* @__PURE__ */ v("div", {
 					className: "flex items-center gap-2",
-					children: [/* @__PURE__ */ m("code", {
+					children: [/* @__PURE__ */ _("code", {
 						className: "flex-1 text-sm text-text-primary font-mono bg-bg-sunken px-3 py-2 rounded overflow-auto",
-						children: A.webhookUrl
-					}), /* @__PURE__ */ m("button", {
+						children: k.webhookUrl
+					}), /* @__PURE__ */ _("button", {
 						type: "button",
-						onClick: ae,
+						onClick: ce,
 						className: "flex items-center gap-1 px-3 py-2 text-sm text-text-secondary hover:text-text-primary transition-colors",
-						children: L ? /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m(S, { className: "w-4 h-4 text-state-success" }), "Copied!"] }) : /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m(x, { className: "w-4 h-4" }), "Copy"] })
+						children: I ? /* @__PURE__ */ v(g, { children: [/* @__PURE__ */ _(E, { className: "w-4 h-4 text-state-success" }), "Copied!"] }) : /* @__PURE__ */ v(g, { children: [/* @__PURE__ */ _(T, { className: "w-4 h-4" }), "Copy"] })
 					})]
 				})]
 			}),
-			A.externalWorkflowId && /* @__PURE__ */ h("div", {
+			k.externalWorkflowId && /* @__PURE__ */ v("div", {
 				className: "bg-bg-surface border border-border-default rounded-lg mb-8 overflow-hidden",
-				children: [/* @__PURE__ */ h("button", {
+				children: [/* @__PURE__ */ v("button", {
 					type: "button",
-					onClick: () => B((e) => !e),
+					onClick: () => z((e) => !e),
 					className: "w-full flex items-center justify-between px-4 py-3 text-sm font-medium text-text-primary hover:bg-bg-sunken transition-colors",
-					children: [/* @__PURE__ */ m("span", { children: "Workflow Design Preview" }), /* @__PURE__ */ m(T, { className: `w-4 h-4 text-text-secondary transition-transform ${z ? "rotate-180" : ""}` })]
-				}), z && /* @__PURE__ */ m("div", {
+					children: [/* @__PURE__ */ _("span", { children: "Workflow Design Preview" }), /* @__PURE__ */ _(re, { className: `w-4 h-4 text-text-secondary transition-transform ${R ? "rotate-180" : ""}` })]
+				}), R && /* @__PURE__ */ _("div", {
 					className: "border-t border-border-default",
 					style: { height: "450px" },
-					children: /* @__PURE__ */ m(g, {
-						apiGatewayUrl: D,
-						workspaceId: k || "default",
-						authToken: O,
-						workflowId: A.externalWorkflowId,
+					children: /* @__PURE__ */ _(y, {
+						apiGatewayUrl: ie,
+						workspaceId: oe || "default",
+						authToken: ae,
+						workflowId: k.externalWorkflowId,
 						readonly: !0,
 						hideHeader: !0,
 						className: "h-full"
 					})
 				})]
 			}),
-			/* @__PURE__ */ h("div", {
+			/* @__PURE__ */ v("div", {
 				className: "bg-bg-surface border border-border-default rounded-lg p-4 mb-8",
-				children: [/* @__PURE__ */ h("h3", {
+				children: [/* @__PURE__ */ v("h3", {
 					className: "text-sm font-medium text-text-secondary mb-4",
 					children: [
 						"Linked DataSinks (",
 						$,
 						")"
 					]
-				}), $ === 0 ? /* @__PURE__ */ m("p", {
-					className: "text-sm text-text-secondary",
-					children: "No DataSinks linked to this workflow."
-				}) : /* @__PURE__ */ m("div", {
+				}), $ === 0 ? /* @__PURE__ */ _(p, {
+					illustration: "empty-generic",
+					title: "No data sinks linked",
+					description: "This workflow has no data sinks linked yet — its output isn't being stored."
+				}) : /* @__PURE__ */ _("div", {
 					className: "space-y-2",
-					children: A.dataSinkLinks?.map((e) => /* @__PURE__ */ h("div", {
+					children: k.dataSinkLinks?.map((e) => /* @__PURE__ */ v("div", {
 						className: "flex items-center justify-between px-3 py-2 bg-bg-sunken rounded-md",
-						children: [/* @__PURE__ */ h("div", {
+						children: [/* @__PURE__ */ v("div", {
 							className: "flex items-center gap-3",
-							children: [/* @__PURE__ */ m(C, { className: "w-4 h-4 text-text-secondary" }), /* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("p", {
+							children: [/* @__PURE__ */ _(D, { className: "w-4 h-4 text-text-secondary" }), /* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("p", {
 								className: "text-sm font-medium text-text-primary",
 								children: e.dataSink?.name || e.dataSink?.key || e.dataSinkId
-							}), e.dataSink?.key && /* @__PURE__ */ m("p", {
+							}), e.dataSink?.key && /* @__PURE__ */ _("p", {
 								className: "text-xs text-text-secondary font-mono",
 								children: e.dataSink.key
 							})] })]
-						}), /* @__PURE__ */ h("div", {
+						}), /* @__PURE__ */ v("div", {
 							className: "flex items-center gap-4",
-							children: [/* @__PURE__ */ h("div", {
+							children: [/* @__PURE__ */ v("div", {
 								className: "flex items-center gap-2",
-								children: [e.isEnabled ? /* @__PURE__ */ m("span", {
+								children: [e.isEnabled ? /* @__PURE__ */ _("span", {
 									className: "text-xs text-state-success",
 									children: "Enabled"
-								}) : /* @__PURE__ */ m("span", {
+								}) : /* @__PURE__ */ _("span", {
 									className: "text-xs text-text-secondary",
 									children: "Disabled"
-								}), /* @__PURE__ */ h("span", {
+								}), /* @__PURE__ */ v("span", {
 									className: "text-xs text-text-secondary",
 									children: ["Priority: ", e.priority]
 								})]
-							}), e.dataSink && /* @__PURE__ */ m("button", {
+							}), e.dataSink && /* @__PURE__ */ _("button", {
 								type: "button",
-								onClick: () => oe(e.dataSinkId),
+								onClick: () => le(e.dataSinkId),
 								className: "text-xs text-action-primary-bg hover:underline",
 								children: "View"
 							})]
@@ -481,52 +495,52 @@ var v = ({ className: e }) => /* @__PURE__ */ m("svg", {
 					}, e.id))
 				})]
 			}),
-			/* @__PURE__ */ h("div", {
+			/* @__PURE__ */ v("div", {
 				className: "grid grid-cols-1 md:grid-cols-2 gap-6",
-				children: [/* @__PURE__ */ h("div", {
+				children: [/* @__PURE__ */ v("div", {
 					className: "bg-bg-surface border border-border-default rounded-lg p-4",
 					children: [
-						/* @__PURE__ */ m("h3", {
+						/* @__PURE__ */ _("h3", {
 							className: "text-sm font-medium text-text-secondary mb-2",
 							children: "Created"
 						}),
-						/* @__PURE__ */ m("p", {
+						/* @__PURE__ */ _("p", {
 							className: "text-sm text-text-primary",
-							children: _(new Date(A.createdAt), { addSuffix: !0 })
+							children: b(new Date(k.createdAt), { addSuffix: !0 })
 						}),
-						/* @__PURE__ */ h("p", {
+						/* @__PURE__ */ v("p", {
 							className: "text-xs text-text-secondary",
-							children: ["by ", A.createdBy]
+							children: ["by ", k.createdBy]
 						})
 					]
-				}), /* @__PURE__ */ h("div", {
+				}), /* @__PURE__ */ v("div", {
 					className: "bg-bg-surface border border-border-default rounded-lg p-4",
 					children: [
-						/* @__PURE__ */ m("h3", {
+						/* @__PURE__ */ _("h3", {
 							className: "text-sm font-medium text-text-secondary mb-2",
 							children: "Last Updated"
 						}),
-						/* @__PURE__ */ m("p", {
+						/* @__PURE__ */ _("p", {
 							className: "text-sm text-text-primary",
-							children: _(new Date(A.updatedAt), { addSuffix: !0 })
+							children: b(new Date(k.updatedAt), { addSuffix: !0 })
 						}),
-						/* @__PURE__ */ h("p", {
+						/* @__PURE__ */ v("p", {
 							className: "text-xs text-text-secondary",
-							children: ["by ", A.updatedBy || A.createdBy]
+							children: ["by ", k.updatedBy || k.createdBy]
 						})
 					]
 				})]
 			}),
-			A && /* @__PURE__ */ m(c, {
-				workflow: A,
-				isOpen: M,
-				onClose: () => N(!1),
-				onConfirm: Q
+			k && /* @__PURE__ */ _(s, {
+				workflow: k,
+				isOpen: j,
+				onClose: () => M(!1),
+				onConfirm: se
 			})
 		]
 	});
 });
 //#endregion
-export { E as WorkflowViewPage };
+export { O as WorkflowViewPage };
 
 //# sourceMappingURL=WorkflowViewPage.js.map