@burdenoff/microfe-bigconsole 2026.1004.3 → 2026.1004.4

package/dist/bigconsole/pages/WorkflowViewPage.js

@@ -2,582 +2,630 @@ import { useAppNavigate as e } from "../contexts/NavigationContext.js";
 import "../contexts/index.js";
 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 { SECTION_FOCUS_RING as i, sectionSurfaceClasses as ee } from "../components/common/sectionStyles.js";
+import { SECTION_FOCUS_RING as r, sectionSurfaceClasses as i } from "../components/common/sectionStyles.js";
 import { Section as a, SectionStack as o } from "../components/common/Section.js";
 import "../components/common/index.js";
 import { BIGCONSOLE_PERMISSIONS as s } from "../../constants/permissions.js";
-import { isNative as c, nativeCopyText as te, nativeNotify as l, nativeToast as u } from "../../utils/nativeBridge.js";
+import { isNative as c, nativeCopyText as ee, nativeNotify as l, nativeToast as te } from "../../utils/nativeBridge.js";
 import ne from "../components/workflow/WorkflowStatusBadge.js";
-import d from "../components/workflow/WorkflowDeleteDialog.js";
-import { memo as f, useCallback as p, useEffect as re, useState as m } from "react";
-import { useParams as h } from "react-router";
-import { AccessDenied as g, PermissionButton as _ } from "@burdenoff/fe-libs/shared/components";
-import { usePermissions as ie } from "@burdenoff/fe-libs/shared/providers/shell";
-import { Button as v, IllustratedEmptyState as y, NextSteps as ae, PagePurpose as oe, Spinner as se } from "@burdenoff/fe-libs/ui";
-import { Fragment as b, jsx as x, jsxs as S } from "react/jsx-runtime";
-import { WorkflowBuilder as ce } from "@burdenoff/fluidgrids-fe-sdk";
-import { useI18n as le } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
-import { formatDistanceToNow as C } from "date-fns";
+import re from "../components/workflow/WorkflowDeleteDialog.js";
+import { WorkflowSinkLinkForm as ie } from "../components/workflow/WorkflowSinkLinkForm.js";
+import { WorkflowDesignPreview as ae } from "../components/workflow/WorkflowDesignPreview.js";
+import { memo as u, useCallback as d, useEffect as oe, useState as f } from "react";
+import { useParams as se } from "react-router";
+import { AccessDenied as ce, PermissionButton as p } from "@burdenoff/fe-libs/shared/components";
+import { usePermissions as le } from "@burdenoff/fe-libs/shared/providers/shell";
+import { Button as m, IllustratedEmptyState as h, NextSteps as ue, PagePurpose as de, Spinner as g } from "@burdenoff/fe-libs/ui";
+import { Fragment as _, jsx as v, jsxs as y } from "react/jsx-runtime";
+import { useLazyWorkflowDefinition as fe } from "@burdenoff/fluidgrids-fe-sdk";
+import { useI18n as pe } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { formatDistanceToNow as b } from "date-fns";
 //#region src/bigconsole/pages/WorkflowViewPage.tsx
-var ue = ({ className: e }) => /* @__PURE__ */ x("svg", {
+var me = ({ className: e }) => /* @__PURE__ */ v("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ x("path", {
+	children: /* @__PURE__ */ v("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 2,
 		d: "M15 19l-7-7 7-7"
 	})
-}), de = ({ className: e }) => /* @__PURE__ */ x("svg", {
+}), he = ({ className: e }) => /* @__PURE__ */ v("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ x("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"
 	})
-}), fe = ({ className: e }) => /* @__PURE__ */ x("svg", {
+}), ge = ({ className: e }) => /* @__PURE__ */ v("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ x("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"
 	})
-}), pe = ({ className: e }) => /* @__PURE__ */ S("svg", {
+}), _e = ({ className: e }) => /* @__PURE__ */ y("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: [/* @__PURE__ */ x("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__ */ x("path", {
+	}), /* @__PURE__ */ v("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 2,
 		d: "M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
 	})]
-}), me = ({ className: e }) => /* @__PURE__ */ x("svg", {
+}), ve = ({ className: e }) => /* @__PURE__ */ v("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ x("path", {
+	children: /* @__PURE__ */ v("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"
 	})
-}), he = ({ className: e }) => /* @__PURE__ */ x("svg", {
+}), ye = ({ className: e }) => /* @__PURE__ */ v("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ x("path", {
+	children: /* @__PURE__ */ v("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 2,
 		d: "M5 13l4 4L19 7"
 	})
-}), ge = ({ className: e }) => /* @__PURE__ */ x("svg", {
+}), be = ({ className: e }) => /* @__PURE__ */ v("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ x("path", {
+	children: /* @__PURE__ */ v("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"
 	})
-}), _e = ({ className: e }) => /* @__PURE__ */ x("svg", {
+}), xe = ({ className: e }) => /* @__PURE__ */ v("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ x("path", {
+	children: /* @__PURE__ */ v("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 2,
 		d: "M19 9l-7 7-7-7"
 	})
-}), w = f(function() {
-	let f = e(), { t: w } = le(), { workflowId: T } = h(), { apiGatewayUrl: ve, authToken: ye, workspaceId: E } = r(), { hasPermission: D, isLoading: O } = ie(), k = D(s.WORKFLOW_READ), A = D(s.WORKFLOW_UPDATE);
-	D(s.WORKFLOW_DELETE);
-	let j = D(s.WORKFLOW_EXECUTE), [M, N] = m(null), [P, F] = m(!1), [, I] = m(!1), [L, R] = m(!1), [be, z] = m(!1), [B, V] = m(!1), [xe, H] = m(!1), [U, W] = m(null), { loading: Se, error: G, fetchWorkflow: K, deleteWorkflow: q, executeWorkflow: J, pollWorkflowExecution: Y } = t({ skipFetch: !0 });
-	re(() => {
-		if (!T) {
-			H(!0);
+}), x = u(function() {
+	let u = e(), { t: x } = pe(), { workflowId: S } = se(), { hasPermission: C, isLoading: Se } = le(), Ce = C(s.WORKFLOW_READ), w = C(s.WORKFLOW_UPDATE), T = C(s.DATASINK_READ);
+	C(s.WORKFLOW_DELETE);
+	let we = C(s.WORKFLOW_EXECUTE), [E, D] = f(null), [Te, O] = f(!1), [, k] = f(!1), [A, j] = f(!1), [Ee, M] = f(!1), [N, P] = f(!1), [F, I] = f(null), [De, L] = f(null), { unlinkDataSink: Oe } = t({ skipFetch: !0 }), [R, z] = f(!1), { getWorkflow: ke, workflow: B, loading: Ae, error: je } = fe(), [Me, V] = f(!1), [H, U] = f(null), { loading: Ne, error: W, fetchWorkflow: G, deleteWorkflow: K, executeWorkflow: q, pollWorkflowExecution: J } = t({ skipFetch: !0 });
+	oe(() => {
+		if (!S) {
+			V(!0);
 			return;
 		}
 		let e = !1, t = async (r) => {
 			try {
-				let i = await K(T);
+				let i = await G(S);
 				if (e) return;
-				i ? (N(i), H(!0)) : r === 0 ? setTimeout(() => {
+				i ? (D(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;
 		};
-	}, [T, K]);
-	let Ce = p(() => {
-		f("/workflows");
-	}, [f]), X = p(() => {
-		f(`/workflows/${T}/edit`);
-	}, [f, T]), we = p(async () => {
-		if (T) {
-			I(!0);
+	}, [S, G]);
+	let Pe = d(() => {
+		u("/workflows/feeds");
+	}, [u]), Y = d(() => {
+		E?.key && u(`/workflows/workflow/${encodeURIComponent(E.key)}/${encodeURIComponent(B?.version ?? "v1")}`);
+	}, [
+		u,
+		E,
+		B
+	]), Fe = d(async () => {
+		if (S) {
+			k(!0);
 			try {
-				await q(T) ? (c() && l("success"), f("/workflows")) : c() && l("error");
+				await K(S) ? (c() && l("success"), u("/workflows/feeds")) : c() && l("error");
 			} catch {
 				c() && l("error");
 			} finally {
-				I(!1), F(!1);
+				k(!1), O(!1);
 			}
 		}
 	}, [
-		T,
-		q,
-		f
-	]), Z = p(async () => {
-		if (!T) return;
-		R(!0), W(null);
+		S,
+		K,
+		u
+	]), X = d(async () => {
+		if (!S) return;
+		j(!0), U(null);
 		let e = Date.now();
 		try {
-			let t = await J(T);
+			let t = await q(S);
 			if (t) {
 				let n = Date.now() - e;
-				t.externalWorkflowId ? (W({
+				t.externalWorkflowId ? (U({
 					success: !0,
 					output: {
 						externalWorkflowId: t.externalWorkflowId,
 						executionCount: t.executionCount,
-						status: w("bigconsole.workflows.view.executionTriggeredPolling", "Triggered — polling for completion...")
+						status: x("bigconsole.workflows.view.executionTriggeredPolling", "Triggered — polling for completion...")
 					},
 					error: null,
 					executionTimeMs: n
-				}), Y(T, {
+				}), J(S, {
 					intervalMs: 3e3,
 					timeoutMs: 12e4,
 					onProgress: (e) => {
-						N(e);
+						D(e);
 					}
 				}).then((t) => {
-					t && (N(t), W((n) => n && {
+					t && (D(t), U((n) => n && {
 						...n,
 						output: {
 							...n.output || {},
-							status: t.status === "error" ? w("bigconsole.workflows.view.executionStatusFailed", "Failed") : w("bigconsole.workflows.view.executionStatusCompleted", "Completed"),
+							status: t.status === "error" ? x("bigconsole.workflows.view.executionStatusFailed", "Failed") : x("bigconsole.workflows.view.executionStatusCompleted", "Completed"),
 							executionCount: t.executionCount,
 							lastExecutedAt: t.lastExecutedAt
 						},
 						executionTimeMs: Date.now() - e
 					}));
-				})) : W({
+				})) : U({
 					success: !0,
 					output: {
 						executionCount: t.executionCount,
 						lastExecutedAt: t.lastExecutedAt,
-						status: w("bigconsole.workflows.view.executionStatusCompleted", "Completed")
+						status: x("bigconsole.workflows.view.executionStatusCompleted", "Completed")
 					},
 					error: null,
 					executionTimeMs: n
 				});
-				let r = await K(T);
-				r && N(r);
+				let r = await G(S);
+				r && D(r);
 			}
 		} catch (t) {
-			W({
+			U({
 				success: !1,
 				output: null,
-				error: t instanceof Error ? t.message : w("bigconsole.workflows.errors.executionFailed", "Execution failed"),
+				error: t instanceof Error ? t.message : x("bigconsole.workflows.errors.executionFailed", "Execution failed"),
 				executionTimeMs: Date.now() - e
 			});
 		} finally {
-			R(!1);
+			j(!1);
 		}
 	}, [
-		T,
+		S,
+		q,
+		G,
 		J,
-		K,
-		Y,
-		w
-	]), Te = p(async () => {
-		if (M?.webhookUrl) try {
-			await te(M.webhookUrl), z(!0), c() && u(w("bigconsole.workflows.view.webhookCopiedToast", "Webhook copied")), setTimeout(() => z(!1), 2e3);
+		x
+	]), Ie = d(async () => {
+		if (E?.webhookUrl) try {
+			await ee(E.webhookUrl), M(!0), c() && te(x("bigconsole.workflows.view.webhookCopiedToast", "Webhook copied")), setTimeout(() => M(!1), 2e3);
 		} catch {}
-	}, [M?.webhookUrl, w]), Ee = p((e) => {
-		f(`/datasinks/${e}`);
-	}, [f]), Q = /* @__PURE__ */ S("button", {
+	}, [E?.webhookUrl, x]), Le = d((e) => {
+		u(`/datasinks/${e}`);
+	}, [u]), Z = /* @__PURE__ */ y("button", {
 		type: "button",
-		onClick: Ce,
-		className: `inline-flex min-h-[var(--size-controlHeight-md)] items-center gap-1 rounded-button text-sm text-text-secondary motion-safe:transition-colors hover:text-text-primary ${i}`,
-		children: [/* @__PURE__ */ x(ue, { className: "w-4 h-4" }), w("bigconsole.workflows.view.backToWorkflows", "Back to Workflows")]
+		onClick: Pe,
+		className: `inline-flex min-h-[var(--size-controlHeight-md)] items-center gap-1 rounded-button text-sm text-text-secondary motion-safe:transition-colors hover:text-text-primary ${r}`,
+		children: [/* @__PURE__ */ v(me, { className: "w-4 h-4" }), x("bigconsole.workflows.view.backToWorkflows", "Back to Workflows")]
 	});
-	if (!xe || Se && !M || O) return /* @__PURE__ */ x("div", {
+	if (!Me || Ne && !E || Se) return /* @__PURE__ */ v("div", {
 		className: "mx-auto flex min-h-[400px] max-w-5xl items-center justify-center p-4 sm:p-[var(--space-pagePadding)]",
-		children: /* @__PURE__ */ x(se, { size: "lg" })
+		children: /* @__PURE__ */ v(g, { size: "lg" })
 	});
-	if (!k) return /* @__PURE__ */ x(g, {
-		title: w("bigconsole.workflows.errors.accessDeniedTitle", "Access Denied"),
-		description: w("bigconsole.workflows.errors.accessDeniedViewDescription", "You don't have permission to view this workflow.")
+	if (!Ce) return /* @__PURE__ */ v(ce, {
+		title: x("bigconsole.workflows.errors.accessDeniedTitle", "Access Denied"),
+		description: x("bigconsole.workflows.errors.accessDeniedViewDescription", "You don't have permission to view this workflow.")
 	});
-	if (G || !M) return /* @__PURE__ */ x("div", {
+	if (W || !E) return /* @__PURE__ */ v("div", {
 		className: "mx-auto max-w-5xl p-4 sm:p-[var(--space-pagePadding)]",
-		children: /* @__PURE__ */ S(o, { children: [/* @__PURE__ */ x("div", { children: Q }), /* @__PURE__ */ x("section", {
+		children: /* @__PURE__ */ y(o, { children: [/* @__PURE__ */ v("div", { children: Z }), /* @__PURE__ */ v("section", {
 			"aria-label": "Workflow not found",
 			"data-section-emphasis": "standard",
 			"data-testid": "workflow-not-found",
-			className: ee("standard"),
-			children: /* @__PURE__ */ x(y, {
+			className: i("standard"),
+			children: /* @__PURE__ */ v(h, {
 				illustration: "empty-data",
-				title: w("bigconsole.workflows.view.notFoundTitle", "Workflow not found"),
-				description: G?.message || w("bigconsole.workflows.view.notFoundDescription", "The workflow you are looking for does not exist.")
+				title: x("bigconsole.workflows.view.notFoundTitle", "Workflow not found"),
+				description: W?.message || x("bigconsole.workflows.view.notFoundDescription", "The workflow you are looking for does not exist.")
 			})
 		})] })
 	});
-	let $ = M.dataSinkLinks?.length || 0, De = !!M.externalWorkflowId, Oe = [
-		...j ? [{
+	let Q = E.dataSinkLinks?.length || 0, Re = !!E.externalWorkflowId, $ = B?.id === E.externalWorkflowId ? B.definitionJson?.data : void 0, ze = [
+		...we ? [{
 			id: "execute",
-			label: w("bigconsole.workflows.view.nextStepExecuteLabel", "Run the workflow"),
-			description: w("bigconsole.workflows.view.nextStepExecuteDescription", "Trigger an execution to pull fresh data now."),
-			onClick: Z
+			label: x("bigconsole.workflows.view.nextStepExecuteLabel", "Run the workflow"),
+			description: x("bigconsole.workflows.view.nextStepExecuteDescription", "Trigger an execution to pull fresh data now."),
+			onClick: X
 		}] : [],
 		{
 			id: "design",
-			label: w("bigconsole.workflows.view.nextStepDesignLabel", "Inspect the design"),
-			description: w("bigconsole.workflows.view.nextStepDesignDescription", "Expand the read-only preview to see each step."),
-			onClick: () => V(!0)
+			label: x("bigconsole.workflows.view.nextStepDesignLabel", "Inspect the design"),
+			description: x("bigconsole.workflows.view.nextStepDesignDescription", "Expand the read-only preview to see each step."),
+			onClick: () => z(!0)
 		},
-		...A ? [{
+		...w ? [{
 			id: "edit",
-			label: w("bigconsole.workflows.view.nextStepEditLabel", "Edit in the builder"),
-			description: w("bigconsole.workflows.view.nextStepEditDescription", "Open the FluidGrids visual builder to change the flow."),
-			onClick: X
+			label: x("bigconsole.workflows.view.nextStepEditLabel", "Edit in the builder"),
+			description: x("bigconsole.workflows.view.nextStepEditDescription", "Open the FluidGrids visual builder to change the flow."),
+			onClick: Y
 		}] : [],
 		{
 			id: "sinks",
-			label: w("bigconsole.workflows.view.nextStepSinksLabel", "Check the linked data sinks"),
-			description: w("bigconsole.workflows.view.nextStepSinksDescription", "See where this workflow writes its output."),
-			onClick: () => f("/datasinks")
+			label: x("bigconsole.workflows.view.nextStepSinksLabel", "Check the linked data sinks"),
+			description: x("bigconsole.workflows.view.nextStepSinksDescription", "See where this workflow writes its output."),
+			onClick: () => u("/datasinks")
 		}
 	];
-	return /* @__PURE__ */ S("div", {
+	return /* @__PURE__ */ y("div", {
 		className: "mx-auto max-w-5xl p-4 sm:p-[var(--space-pagePadding)]",
-		children: [/* @__PURE__ */ S(o, { children: [
-			/* @__PURE__ */ S("header", {
+		children: [/* @__PURE__ */ y(o, { children: [
+			/* @__PURE__ */ y("header", {
 				"data-section-emphasis": "bare",
 				className: "min-w-0",
-				children: [/* @__PURE__ */ x("div", {
+				children: [/* @__PURE__ */ v("div", {
 					className: "mb-form-gap",
-					children: Q
-				}), /* @__PURE__ */ S("div", {
+					children: Z
+				}), /* @__PURE__ */ y("div", {
 					className: "flex flex-col gap-form-gap md:flex-row md:items-start md:justify-between",
-					children: [/* @__PURE__ */ S("div", {
+					children: [/* @__PURE__ */ y("div", {
 						className: "min-w-0",
 						children: [
-							/* @__PURE__ */ S("div", {
+							/* @__PURE__ */ y("div", {
 								className: "flex flex-wrap items-center gap-icon-gap",
-								children: [/* @__PURE__ */ x("h1", {
+								children: [/* @__PURE__ */ v("h1", {
 									className: "break-words text-2xl font-bold text-text-primary",
-									children: M.name
-								}), /* @__PURE__ */ x(ne, { status: M.status })]
+									children: E.name
+								}), /* @__PURE__ */ v(ne, { status: E.status })]
 							}),
-							/* @__PURE__ */ x("p", {
+							/* @__PURE__ */ v("p", {
 								className: "mt-1 break-all font-mono text-sm text-text-secondary",
-								children: M.key
+								children: E.key
 							}),
-							M.externalWorkflowId && /* @__PURE__ */ S("p", {
+							E.externalWorkflowId && /* @__PURE__ */ y("p", {
 								className: "mt-1 text-xs text-text-muted",
 								children: [
-									w("bigconsole.workflows.view.fluidGridsIdLabel", "FluidGrids ID:"),
+									x("bigconsole.workflows.view.fluidGridsIdLabel", "FluidGrids ID:"),
 									" ",
-									/* @__PURE__ */ x("span", {
+									/* @__PURE__ */ v("span", {
 										className: "break-all font-mono",
-										children: M.externalWorkflowId
+										children: E.externalWorkflowId
 									})
 								]
 							})
 						]
-					}), /* @__PURE__ */ S("div", {
+					}), /* @__PURE__ */ y("div", {
 						className: "flex flex-wrap items-center gap-control-gap",
 						children: [
-							/* @__PURE__ */ x(_, {
+							/* @__PURE__ */ v(p, {
 								permission: s.WORKFLOW_EXECUTE,
 								deniedBehavior: "disable",
-								children: /* @__PURE__ */ S(v, {
+								children: /* @__PURE__ */ y(m, {
 									size: "lg",
-									onClick: Z,
-									disabled: L,
-									children: [/* @__PURE__ */ x(pe, { className: "w-4 h-4" }), L ? w("bigconsole.workflows.actions.executing", "Executing...") : w("bigconsole.workflows.actions.execute", "Execute")]
+									onClick: X,
+									disabled: A,
+									children: [/* @__PURE__ */ v(_e, { className: "w-4 h-4" }), A ? x("bigconsole.workflows.actions.executing", "Executing...") : x("bigconsole.workflows.actions.execute", "Execute")]
 								})
 							}),
-							/* @__PURE__ */ x(_, {
+							/* @__PURE__ */ v(p, {
 								permission: s.WORKFLOW_UPDATE,
 								deniedBehavior: "disable",
-								children: /* @__PURE__ */ S(v, {
+								children: /* @__PURE__ */ y(m, {
 									size: "lg",
 									variant: "outline",
-									onClick: X,
-									children: [/* @__PURE__ */ x(de, { className: "w-4 h-4" }), w("bigconsole.workflows.actions.edit", "Edit")]
+									onClick: Y,
+									children: [/* @__PURE__ */ v(he, { className: "w-4 h-4" }), x("bigconsole.workflows.actions.edit", "Edit")]
 								})
 							}),
-							/* @__PURE__ */ x(_, {
+							/* @__PURE__ */ v(p, {
 								permission: s.WORKFLOW_DELETE,
 								deniedBehavior: "hide",
-								children: /* @__PURE__ */ S(v, {
+								children: /* @__PURE__ */ y(m, {
 									size: "lg",
 									variant: "ghost",
-									onClick: () => F(!0),
+									onClick: () => O(!0),
 									className: "text-[var(--color-status-error-text)] hover:bg-status-error-bg/10 hover:text-[var(--color-status-error-text)]",
-									children: [/* @__PURE__ */ x(fe, { className: "w-4 h-4" }), w("bigconsole.workflows.actions.delete", "Delete")]
+									children: [/* @__PURE__ */ v(ge, { className: "w-4 h-4" }), x("bigconsole.workflows.actions.delete", "Delete")]
 								})
 							})
 						]
 					})]
 				})]
 			}),
-			/* @__PURE__ */ x(oe, { children: w("bigconsole.workflows.view.purpose", "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__ */ x(ae, {
+			/* @__PURE__ */ v(de, { children: x("bigconsole.workflows.view.purpose", "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__ */ v(ue, {
 				storageKey: "bigconsole-workflow-view",
-				steps: Oe
+				steps: ze
 			}),
-			U && /* @__PURE__ */ S(a, {
+			H && /* @__PURE__ */ y(a, {
 				headingLevel: 2,
-				tone: U.success ? "success" : "danger",
-				title: U.success ? w("bigconsole.workflows.view.executionResultTriggered", "Execution Triggered") : w("bigconsole.workflows.view.executionResultFailed", "Execution Failed"),
-				description: U.success ? "The run was accepted. Results refresh below as the run progresses." : "The run could not be started. The detail below comes straight from the workflow service.",
-				meta: /* @__PURE__ */ S("span", {
+				tone: H.success ? "success" : "danger",
+				title: H.success ? x("bigconsole.workflows.view.executionResultTriggered", "Execution Triggered") : x("bigconsole.workflows.view.executionResultFailed", "Execution Failed"),
+				description: H.success ? "The run was accepted. Results refresh below as the run progresses." : "The run could not be started. The detail below comes straight from the workflow service.",
+				meta: /* @__PURE__ */ y("span", {
 					className: "rounded-pill bg-bg-sunken px-2 py-0.5 text-xs font-medium text-text-secondary",
-					children: [U.executionTimeMs, "ms"]
+					children: [H.executionTimeMs, "ms"]
 				}),
 				"data-testid": "workflow-execution-result",
-				children: [U.error ? /* @__PURE__ */ x("p", {
+				children: [H.error ? /* @__PURE__ */ v("p", {
 					className: "break-words text-sm text-[var(--color-status-error-text)]",
-					children: U.error
-				}) : /* @__PURE__ */ x("pre", {
+					children: H.error
+				}) : /* @__PURE__ */ v("pre", {
 					className: "max-h-[200px] min-w-0 overflow-auto rounded-card bg-bg-sunken p-2 font-mono text-xs text-text-secondary",
-					children: JSON.stringify(U.output, null, 2)
-				}), U.runId && /* @__PURE__ */ S("p", {
+					children: JSON.stringify(H.output, null, 2)
+				}), H.runId && /* @__PURE__ */ y("p", {
 					className: "mt-2 text-xs text-text-muted",
 					children: [
-						w("bigconsole.workflows.view.runIdLabel", "Run ID:"),
+						x("bigconsole.workflows.view.runIdLabel", "Run ID:"),
 						" ",
-						/* @__PURE__ */ x("span", {
+						/* @__PURE__ */ v("span", {
 							className: "break-all font-mono",
-							children: U.runId
+							children: H.runId
 						})
 					]
 				})]
 			}),
-			/* @__PURE__ */ S("div", {
+			/* @__PURE__ */ y("div", {
 				className: "grid grid-cols-1 gap-section-gap md:grid-cols-2",
-				children: [/* @__PURE__ */ x(a, {
+				children: [/* @__PURE__ */ v(a, {
 					headingLevel: 2,
 					emphasis: "muted",
-					title: w("bigconsole.workflows.view.descriptionLabel", "Description"),
+					title: x("bigconsole.workflows.view.descriptionLabel", "Description"),
 					description: "What this workflow is for, as entered by its author.",
-					children: /* @__PURE__ */ x("p", {
+					children: /* @__PURE__ */ v("p", {
 						className: "break-words text-sm text-text-primary",
-						children: M.description || w("bigconsole.workflows.view.noDescription", "No description")
+						children: E.description || x("bigconsole.workflows.view.noDescription", "No description")
 					})
-				}), /* @__PURE__ */ x(a, {
+				}), /* @__PURE__ */ v(a, {
 					headingLevel: 2,
-					emphasis: De ? "standard" : "primary",
-					title: w("bigconsole.workflows.view.executionStatsLabel", "Execution Stats"),
+					emphasis: Re ? "standard" : "primary",
+					title: x("bigconsole.workflows.view.executionStatsLabel", "Execution Stats"),
 					description: "How often this workflow has run, and when it last did.",
 					"data-testid": "workflow-execution-stats",
-					children: /* @__PURE__ */ S("div", {
+					children: /* @__PURE__ */ y("div", {
 						className: "grid grid-cols-1 gap-form-gap sm:grid-cols-2",
-						children: [/* @__PURE__ */ S("div", {
+						children: [/* @__PURE__ */ y("div", {
 							className: "min-w-0",
-							children: [/* @__PURE__ */ x("p", {
+							children: [/* @__PURE__ */ v("p", {
 								className: "text-2xl font-bold text-text-primary",
-								children: M.executionCount
-							}), /* @__PURE__ */ x("p", {
+								children: E.executionCount
+							}), /* @__PURE__ */ v("p", {
 								className: "text-xs text-text-secondary",
-								children: w("bigconsole.workflows.view.totalExecutionsLabel", "Total Executions")
+								children: x("bigconsole.workflows.view.totalExecutionsLabel", "Total Executions")
 							})]
-						}), /* @__PURE__ */ S("div", {
+						}), /* @__PURE__ */ y("div", {
 							className: "min-w-0",
-							children: [/* @__PURE__ */ x("p", {
+							children: [/* @__PURE__ */ v("p", {
 								className: "text-sm font-medium text-text-primary",
-								children: M.lastExecutedAt ? C(new Date(M.lastExecutedAt), { addSuffix: !0 }) : w("bigconsole.workflows.view.never", "Never")
-							}), /* @__PURE__ */ x("p", {
+								children: E.lastExecutedAt ? b(new Date(E.lastExecutedAt), { addSuffix: !0 }) : x("bigconsole.workflows.view.never", "Never")
+							}), /* @__PURE__ */ v("p", {
 								className: "text-xs text-text-secondary",
-								children: w("bigconsole.workflows.view.lastExecutedLabel", "Last Executed")
+								children: x("bigconsole.workflows.view.lastExecutedLabel", "Last Executed")
 							})]
 						})]
 					})
 				})]
 			}),
-			M.externalWorkflowId && /* @__PURE__ */ x(a, {
+			E.externalWorkflowId && /* @__PURE__ */ v(a, {
 				headingLevel: 2,
 				emphasis: "primary",
-				title: w("bigconsole.workflows.view.designPreviewTitle", "Workflow Design Preview"),
+				title: x("bigconsole.workflows.view.designPreviewTitle", "Workflow Design Preview"),
 				description: "The steps this workflow runs, read-only. Open the builder to change them.",
-				actions: /* @__PURE__ */ S(v, {
+				actions: /* @__PURE__ */ y(m, {
 					variant: "outline",
 					size: "sm",
-					"aria-expanded": B,
+					"aria-expanded": R,
 					"aria-controls": "workflow-design-canvas",
-					onClick: () => V((e) => !e),
-					children: [B ? "Hide design" : "Show design", /* @__PURE__ */ x(_e, { className: `w-4 h-4 motion-safe:transition-transform ${B ? "rotate-180" : ""}` })]
+					onClick: () => {
+						let e = !R;
+						z(e), e && E.externalWorkflowId && ke(E.key, E.externalWorkflowId);
+					},
+					children: [R ? "Hide design" : "Show design", /* @__PURE__ */ v(xe, { className: `w-4 h-4 motion-safe:transition-transform ${R ? "rotate-180" : ""}` })]
 				}),
 				"data-testid": "workflow-design-preview",
-				children: B ? /* @__PURE__ */ x("div", {
+				children: R ? /* @__PURE__ */ v("div", {
 					id: "workflow-design-canvas",
 					className: "h-[320px] min-w-0 overflow-hidden rounded-card border border-[var(--color-border-subtle)] sm:h-[420px] lg:h-[450px]",
-					children: /* @__PURE__ */ x(ce, {
-						apiGatewayUrl: ve,
-						workspaceId: E || "default",
-						authToken: ye,
-						workflowId: M.externalWorkflowId,
-						readonly: !0,
-						hideHeader: !0,
-						className: "h-full"
+					children: Ae ? /* @__PURE__ */ v("div", {
+						role: "status",
+						className: "flex h-full items-center justify-center",
+						children: /* @__PURE__ */ v(g, {})
+					}) : je ? /* @__PURE__ */ v("p", {
+						role: "alert",
+						className: "p-4 text-sm text-status-error-text",
+						children: x("bigconsole.workflows.view.previewError", "Could not load the workflow design. Close and reopen the preview to retry.")
+					}) : $ ? /* @__PURE__ */ v(ae, { workflow: $ }, B?.id) : /* @__PURE__ */ v("p", {
+						className: "p-4 text-sm text-text-secondary",
+						children: x("bigconsole.workflows.view.previewUnavailable", "No saved workflow design is available.")
 					})
-				}) : /* @__PURE__ */ x("p", {
+				}) : /* @__PURE__ */ v("p", {
 					id: "workflow-design-canvas",
 					className: "text-sm text-text-secondary",
 					children: "The canvas is collapsed. Show the design to see every step, its order and its connections."
 				})
 			}),
-			M.webhookUrl && /* @__PURE__ */ x(a, {
+			E.webhookUrl && /* @__PURE__ */ v(a, {
 				headingLevel: 2,
 				emphasis: "muted",
-				title: w("bigconsole.workflows.view.webhookUrlLabel", "Webhook URL"),
+				title: x("bigconsole.workflows.view.webhookUrlLabel", "Webhook URL"),
 				description: "POST to this URL to run the workflow from an external system.",
-				actions: /* @__PURE__ */ x(v, {
+				actions: /* @__PURE__ */ v(m, {
 					variant: "ghost",
 					size: "sm",
-					onClick: Te,
-					children: be ? /* @__PURE__ */ S(b, { children: [/* @__PURE__ */ x(he, { className: "w-4 h-4 text-status-success-text" }), w("bigconsole.workflows.actions.copied", "Copied!")] }) : /* @__PURE__ */ S(b, { children: [/* @__PURE__ */ x(me, { className: "w-4 h-4" }), w("bigconsole.workflows.actions.copy", "Copy")] })
+					onClick: Ie,
+					children: Ee ? /* @__PURE__ */ y(_, { children: [/* @__PURE__ */ v(ye, { className: "w-4 h-4 text-status-success-text" }), x("bigconsole.workflows.actions.copied", "Copied!")] }) : /* @__PURE__ */ y(_, { children: [/* @__PURE__ */ v(ve, { className: "w-4 h-4" }), x("bigconsole.workflows.actions.copy", "Copy")] })
 				}),
-				children: /* @__PURE__ */ x("code", {
+				children: /* @__PURE__ */ v("code", {
 					className: "block min-w-0 overflow-x-auto break-all rounded-card bg-bg-sunken px-3 py-2 font-mono text-sm text-text-primary",
-					children: M.webhookUrl
+					children: E.webhookUrl
 				})
 			}),
-			/* @__PURE__ */ x(a, {
+			/* @__PURE__ */ y(a, {
 				headingLevel: 2,
-				title: w("bigconsole.workflows.view.linkedDataSinksTitle", "Linked DataSinks ({{count}})", { count: $ }),
+				title: x("bigconsole.workflows.view.linkedDataSinksTitle", "Linked DataSinks ({{count}})", { count: Q }),
 				description: "Where this workflow writes the data it produces.",
+				actions: w && T ? /* @__PURE__ */ v(m, {
+					variant: "outline",
+					"aria-expanded": N,
+					onClick: () => P((e) => !e),
+					children: N ? x("bigconsole.workflows.links.cancel", "Cancel linking") : x("bigconsole.workflows.links.link", "Link sink")
+				}) : void 0,
 				"data-testid": "workflow-linked-datasinks",
-				children: $ === 0 ? /* @__PURE__ */ x(y, {
-					illustration: "empty-generic",
-					title: w("bigconsole.workflows.view.noDataSinksTitle", "No data sinks linked"),
-					description: w("bigconsole.workflows.view.noDataSinksDescription", "This workflow has no data sinks linked yet — its output isn't being stored.")
-				}) : /* @__PURE__ */ x("ul", {
-					className: "flex flex-col gap-list-gap",
-					children: M.dataSinkLinks?.map((e) => /* @__PURE__ */ S("li", {
-						className: "flex flex-col gap-control-gap rounded-card bg-bg-sunken px-3 py-2 sm:flex-row sm:items-center sm:justify-between",
-						children: [/* @__PURE__ */ S("div", {
-							className: "flex min-w-0 items-center gap-icon-gap",
-							children: [/* @__PURE__ */ x(ge, { className: "w-4 h-4 shrink-0 text-text-secondary" }), /* @__PURE__ */ S("div", {
-								className: "min-w-0",
-								children: [/* @__PURE__ */ x("p", {
-									className: "truncate text-sm font-medium text-text-primary",
-									children: e.dataSink?.name || e.dataSink?.key || e.dataSinkId
-								}), e.dataSink?.key && /* @__PURE__ */ x("p", {
-									className: "truncate font-mono text-xs text-text-secondary",
-									children: e.dataSink.key
+				children: [
+					F && /* @__PURE__ */ v("p", {
+						role: "status",
+						className: "mb-3 text-sm text-text-secondary",
+						children: F
+					}),
+					N && w && T && /* @__PURE__ */ v(ie, {
+						workflowId: E.id,
+						linkedSinkIds: E.dataSinkLinks.map((e) => e.dataSinkId),
+						onLinked: async () => {
+							let e = await G(E.id);
+							e && D(e), P(!1), I(x("bigconsole.workflows.links.linked", "Data sink linked."));
+						}
+					}),
+					Q === 0 ? /* @__PURE__ */ v(h, {
+						illustration: "empty-generic",
+						title: x("bigconsole.workflows.view.noDataSinksTitle", "No data sinks linked"),
+						description: x("bigconsole.workflows.view.noDataSinksDescription", "This workflow has no data sinks linked yet — its output isn't being stored.")
+					}) : /* @__PURE__ */ v("ul", {
+						className: "flex flex-col gap-list-gap",
+						children: [...E.dataSinkLinks].sort((e, t) => e.priority - t.priority).map((e) => /* @__PURE__ */ y("li", {
+							className: "flex flex-col gap-control-gap rounded-card bg-bg-sunken px-3 py-2 sm:flex-row sm:items-center sm:justify-between",
+							children: [/* @__PURE__ */ y("div", {
+								className: "flex min-w-0 items-center gap-icon-gap",
+								children: [/* @__PURE__ */ v(be, { className: "w-4 h-4 shrink-0 text-text-secondary" }), /* @__PURE__ */ y("div", {
+									className: "min-w-0",
+									children: [/* @__PURE__ */ v("p", {
+										className: "truncate text-sm font-medium text-text-primary",
+										children: e.dataSink?.name || e.dataSink?.key || e.dataSinkId
+									}), e.dataSink?.key && /* @__PURE__ */ v("p", {
+										className: "truncate font-mono text-xs text-text-secondary",
+										children: e.dataSink.key
+									})]
 								})]
+							}), /* @__PURE__ */ y("div", {
+								className: "flex flex-wrap items-center gap-control-gap",
+								children: [
+									e.isEnabled ? /* @__PURE__ */ v("span", {
+										className: "rounded-pill bg-[var(--color-status-success-bgSubtle)] px-2 py-0.5 text-xs font-medium text-status-success-text",
+										children: x("bigconsole.workflows.view.dataSinkEnabled", "Enabled")
+									}) : /* @__PURE__ */ v("span", {
+										className: "rounded-pill bg-bg-surface px-2 py-0.5 text-xs font-medium text-text-secondary",
+										children: x("bigconsole.workflows.view.dataSinkDisabled", "Disabled")
+									}),
+									/* @__PURE__ */ v("span", {
+										className: "text-xs text-text-muted",
+										children: x("bigconsole.workflows.view.dataSinkPriority", "Priority: {{priority}}", { priority: e.priority })
+									}),
+									w && /* @__PURE__ */ v(m, {
+										variant: "outline",
+										size: "sm",
+										disabled: De !== null,
+										onClick: async () => {
+											L(e.dataSinkId);
+											try {
+												if (await Oe(E.id, e.dataSinkId)) {
+													let e = await G(E.id);
+													e && D(e), I(x("bigconsole.workflows.links.unlinked", "Data sink unlinked."));
+												} else I(x("bigconsole.workflows.links.unlinkError", "The data sink could not be unlinked. Try again."));
+											} finally {
+												L(null);
+											}
+										},
+										children: x("bigconsole.workflows.links.unlink", "Unlink")
+									}),
+									e.dataSink && /* @__PURE__ */ v("button", {
+										type: "button",
+										onClick: () => Le(e.dataSinkId),
+										className: "inline-flex min-h-[var(--size-controlHeight-md)] items-center rounded-button px-2 text-xs font-medium text-text-link hover:underline sm:min-h-[var(--size-controlHeight-sm)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface",
+										children: x("bigconsole.workflows.actions.view", "View")
+									})
+								]
 							})]
-						}), /* @__PURE__ */ S("div", {
-							className: "flex flex-wrap items-center gap-control-gap",
-							children: [
-								e.isEnabled ? /* @__PURE__ */ x("span", {
-									className: "rounded-pill bg-[var(--color-status-success-bgSubtle)] px-2 py-0.5 text-xs font-medium text-status-success-text",
-									children: w("bigconsole.workflows.view.dataSinkEnabled", "Enabled")
-								}) : /* @__PURE__ */ x("span", {
-									className: "rounded-pill bg-bg-surface px-2 py-0.5 text-xs font-medium text-text-secondary",
-									children: w("bigconsole.workflows.view.dataSinkDisabled", "Disabled")
-								}),
-								/* @__PURE__ */ x("span", {
-									className: "text-xs text-text-muted",
-									children: w("bigconsole.workflows.view.dataSinkPriority", "Priority: {{priority}}", { priority: e.priority })
-								}),
-								e.dataSink && /* @__PURE__ */ x("button", {
-									type: "button",
-									onClick: () => Ee(e.dataSinkId),
-									className: "inline-flex min-h-[var(--size-controlHeight-md)] items-center rounded-button px-2 text-xs font-medium text-text-link hover:underline sm:min-h-[var(--size-controlHeight-sm)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface",
-									children: w("bigconsole.workflows.actions.view", "View")
-								})
-							]
-						})]
-					}, e.id))
-				})
+						}, e.id))
+					})
+				]
 			}),
-			/* @__PURE__ */ x(a, {
+			/* @__PURE__ */ v(a, {
 				headingLevel: 2,
 				emphasis: "muted",
 				title: "Record history",
 				padding: "compact",
-				children: /* @__PURE__ */ S("dl", {
+				children: /* @__PURE__ */ y("dl", {
 					className: "grid grid-cols-1 gap-form-gap sm:grid-cols-2",
-					children: [/* @__PURE__ */ S("div", {
+					children: [/* @__PURE__ */ y("div", {
 						className: "min-w-0",
 						children: [
-							/* @__PURE__ */ x("dt", {
+							/* @__PURE__ */ v("dt", {
 								className: "text-xs text-text-secondary",
-								children: w("bigconsole.workflows.view.createdLabel", "Created")
+								children: x("bigconsole.workflows.view.createdLabel", "Created")
 							}),
-							/* @__PURE__ */ x("dd", {
+							/* @__PURE__ */ v("dd", {
 								className: "text-sm text-text-primary",
-								children: C(new Date(M.createdAt), { addSuffix: !0 })
+								children: b(new Date(E.createdAt), { addSuffix: !0 })
 							}),
-							/* @__PURE__ */ x("dd", {
+							/* @__PURE__ */ v("dd", {
 								className: "truncate text-xs text-text-muted",
-								children: w("bigconsole.workflows.view.byAuthor", "by {{author}}", { author: M.createdBy })
+								children: x("bigconsole.workflows.view.byAuthor", "by {{author}}", { author: E.createdBy })
 							})
 						]
-					}), /* @__PURE__ */ S("div", {
+					}), /* @__PURE__ */ y("div", {
 						className: "min-w-0",
 						children: [
-							/* @__PURE__ */ x("dt", {
+							/* @__PURE__ */ v("dt", {
 								className: "text-xs text-text-secondary",
-								children: w("bigconsole.workflows.view.lastUpdatedLabel", "Last Updated")
+								children: x("bigconsole.workflows.view.lastUpdatedLabel", "Last Updated")
 							}),
-							/* @__PURE__ */ x("dd", {
+							/* @__PURE__ */ v("dd", {
 								className: "text-sm text-text-primary",
-								children: C(new Date(M.updatedAt), { addSuffix: !0 })
+								children: b(new Date(E.updatedAt), { addSuffix: !0 })
 							}),
-							/* @__PURE__ */ x("dd", {
+							/* @__PURE__ */ v("dd", {
 								className: "truncate text-xs text-text-muted",
-								children: w("bigconsole.workflows.view.byAuthor", "by {{author}}", { author: M.updatedBy || M.createdBy })
+								children: x("bigconsole.workflows.view.byAuthor", "by {{author}}", { author: E.updatedBy || E.createdBy })
 							})
 						]
 					})]
 				})
 			})
-		] }), M && /* @__PURE__ */ x(d, {
-			workflow: M,
-			isOpen: P,
-			onClose: () => F(!1),
-			onConfirm: we
+		] }), E && /* @__PURE__ */ v(re, {
+			workflow: E,
+			isOpen: Te,
+			onClose: () => O(!1),
+			onConfirm: Fe
 		})]
 	});
 });
 //#endregion
-export { w as WorkflowViewPage };
+export { x as WorkflowViewPage };
 
 //# sourceMappingURL=WorkflowViewPage.js.map