@burdenoff/microfe-bigconsole 2026.1104.1 → 2026.1104.3

package/dist/bigconsole/components/dashboard/LiveCanvasToggle.js

@@ -1,28 +1,29 @@
-import { memo as e } from "react";
-import { Radio as t } from "lucide-react";
-import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { LIVE_DATA_REFRESH_SECONDS as e } from "../../utils/liveBoardRefresh.js";
+import { memo as t } from "react";
+import { Radio as n } from "lucide-react";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
 //#region src/bigconsole/components/dashboard/LiveCanvasToggle.tsx
-var i = e(function({ isLive: e, onToggle: i }) {
-	return /* @__PURE__ */ r("button", {
+var a = t(function({ isLive: t, onToggle: a }) {
+	return /* @__PURE__ */ i("button", {
 		type: "button",
-		onClick: i,
-		"aria-pressed": e,
+		onClick: a,
+		"aria-pressed": t,
 		"data-testid": "live-canvas-toggle",
-		"data-live": e ? "on" : "off",
-		title: e ? "Live canvas on — new widgets and pages appear automatically, no reload needed" : "Turn on live canvas to watch the board update as the pipeline builds",
-		className: ["inline-flex items-center gap-1.5 rounded-md px-2.5 py-1 text-xs font-medium transition-colors", e ? "bg-status-success-bg text-status-success-text border border-status-success-border" : "text-text-secondary border border-border-default hover:bg-bg-sunken"].join(" "),
-		children: [e ? /* @__PURE__ */ r("span", {
+		"data-live": t ? "on" : "off",
+		title: t ? `Live canvas on — new widgets and pages appear automatically and widget data refreshes about every ${e} seconds, no reload needed` : `Turn on live canvas to watch the board update as the pipeline builds and refresh widget data about every ${e} seconds`,
+		className: ["inline-flex items-center gap-1.5 rounded-md px-2.5 py-1 text-xs font-medium transition-colors", t ? "bg-status-success-bg text-status-success-text border border-status-success-border" : "text-text-secondary border border-border-default hover:bg-bg-sunken"].join(" "),
+		children: [t ? /* @__PURE__ */ i("span", {
 			className: "relative flex h-2.5 w-2.5 flex-shrink-0",
 			"aria-hidden": "true",
-			children: [/* @__PURE__ */ n("span", { className: "animate-ping absolute inline-flex h-full w-full rounded-full bg-status-success-text opacity-60" }), /* @__PURE__ */ n("span", { className: "relative inline-flex h-2.5 w-2.5 rounded-full bg-status-success-text" })]
-		}) : /* @__PURE__ */ n(t, {
+			children: [/* @__PURE__ */ r("span", { className: "animate-ping absolute inline-flex h-full w-full rounded-full bg-status-success-text opacity-60" }), /* @__PURE__ */ r("span", { className: "relative inline-flex h-2.5 w-2.5 rounded-full bg-status-success-text" })]
+		}) : /* @__PURE__ */ r(n, {
 			className: "h-3.5 w-3.5 flex-shrink-0",
 			"aria-hidden": "true"
-		}), /* @__PURE__ */ n("span", {
+		}), /* @__PURE__ */ r("span", {
 			className: "uppercase tracking-wide",
-			children: e ? "Live" : "Go live"
+			children: t ? "Live" : "Go live"
 		})]
 	});
 });
 //#endregion
-export { i as LiveCanvasToggle, i as default };
+export { a as LiveCanvasToggle, a as default };

package/dist/bigconsole/components/datasink/LinkedWorkflowsPanel.d.ts

@@ -4,6 +4,10 @@ interface LinkedWorkflowsPanelProps {
     workflowLinks?: DataSinkWorkflowLink[];
     /** Whether loading */
     isLoading?: boolean;
+    /** Key of the sink; with `onLinked`, enables linking from this panel */
+    dataSinkKey?: string;
+    /** Reload the sink after a workflow is linked here */
+    onLinked?: () => Promise<void>;
 }
 export declare const LinkedWorkflowsPanel: import('react').NamedExoticComponent<LinkedWorkflowsPanelProps>;
 export default LinkedWorkflowsPanel;

package/dist/bigconsole/components/datasink/LinkedWorkflowsPanel.js

@@ -3,11 +3,16 @@ import "../../contexts/index.js";
 import { SECTION_FOCUS_RING as t } from "../common/sectionStyles.js";
 import { Section as n } from "../common/Section.js";
 import "../common/index.js";
-import { memo as r } from "react";
-import { Fragment as i, jsx as a, jsxs as o } from "react/jsx-runtime";
-import { formatDistanceToNow as s } from "date-fns";
+import { BIGCONSOLE_PERMISSIONS as r } from "../../../constants/permissions.js";
+import { SinkWorkflowLinkForm as i } from "./SinkWorkflowLinkForm.js";
+import { memo as a, useState as o } from "react";
+import { PermissionButton as s } from "@burdenoff/fe-libs/shared/components";
+import { Button as c } from "@burdenoff/fe-libs/ui";
+import { useI18n as l } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { Fragment as u, jsx as d, jsxs as f } from "react/jsx-runtime";
+import { formatDistanceToNow as p } from "date-fns";
 //#region src/bigconsole/components/datasink/LinkedWorkflowsPanel.tsx
-function c(e) {
+function m(e) {
 	switch (e) {
 		case "active": return {
 			label: "Active",
@@ -41,156 +46,176 @@ function c(e) {
 		};
 	}
 }
-var l = ({ className: e }) => /* @__PURE__ */ a("svg", {
+var h = ({ className: e }) => /* @__PURE__ */ d("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ a("path", {
+	children: /* @__PURE__ */ d("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 1.5,
 		d: "M13 10V3L4 14h7v7l9-11h-7z"
 	})
-}), u = ({ className: e }) => /* @__PURE__ */ a("svg", {
+}), g = ({ className: e }) => /* @__PURE__ */ d("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ a("path", {
+	children: /* @__PURE__ */ d("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 2,
 		d: "M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1"
 	})
-}), d = ({ className: e }) => /* @__PURE__ */ a("svg", {
+}), _ = ({ className: e }) => /* @__PURE__ */ d("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ a("path", {
+	children: /* @__PURE__ */ d("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 2,
 		d: "M9 5l7 7-7 7"
 	})
-}), f = r(function({ workflowLinks: r = [], isLoading: f = !1 }) {
-	let p = r.filter((e) => e.isEnabled), m = r.filter((e) => !e.isEnabled);
-	return /* @__PURE__ */ a(n, {
+}), v = a(function({ workflowLinks: a = [], isLoading: v = !1, dataSinkKey: y, onLinked: b }) {
+	let { t: x } = l(), [S, C] = o(!1), w = a.filter((e) => e.isEnabled), T = a.filter((e) => !e.isEnabled), E = !!(y && b);
+	return /* @__PURE__ */ d(n, {
 		headingLevel: 2,
 		title: "Linked workflows",
 		description: "FluidGrids workflows that push data into this sink.",
-		icon: /* @__PURE__ */ a(u, { className: "h-icon-sm w-icon-sm" }),
-		meta: /* @__PURE__ */ o("span", {
-			className: "text-xs text-text-muted",
-			children: [
-				r.length,
-				" workflow",
-				r.length === 1 ? "" : "s"
-			]
+		icon: /* @__PURE__ */ d(g, { className: "h-icon-sm w-icon-sm" }),
+		meta: /* @__PURE__ */ f("div", {
+			className: "flex flex-wrap items-center gap-2",
+			children: [/* @__PURE__ */ f("span", {
+				className: "text-xs text-text-muted",
+				children: [
+					a.length,
+					" workflow",
+					a.length === 1 ? "" : "s"
+				]
+			}), E && !S && /* @__PURE__ */ d(s, {
+				permission: r.WORKFLOW_UPDATE,
+				deniedBehavior: "hide",
+				children: /* @__PURE__ */ d(c, {
+					type: "button",
+					variant: "secondary",
+					size: "sm",
+					onClick: () => C(!0),
+					children: x("bigconsole.dataSinks.view.linkWorkflow.open", "Link workflow")
+				})
+			})]
 		}),
-		children: /* @__PURE__ */ a(i, { children: f ? /* @__PURE__ */ a("div", {
+		children: /* @__PURE__ */ f(u, { children: [E && S && y && /* @__PURE__ */ d(i, {
+			dataSinkKey: y,
+			workflowLinks: a,
+			onLinked: async () => {
+				await b?.(), C(!1);
+			},
+			onCancel: () => C(!1)
+		}), v ? /* @__PURE__ */ d("div", {
 			className: "flex items-center justify-center py-8",
-			children: /* @__PURE__ */ o("svg", {
+			children: /* @__PURE__ */ f("svg", {
 				className: "w-6 h-6 text-text-secondary animate-spin",
 				fill: "none",
 				viewBox: "0 0 24 24",
-				children: [/* @__PURE__ */ a("circle", {
+				children: [/* @__PURE__ */ d("circle", {
 					className: "opacity-25",
 					cx: "12",
 					cy: "12",
 					r: "10",
 					stroke: "currentColor",
 					strokeWidth: "4"
-				}), /* @__PURE__ */ a("path", {
+				}), /* @__PURE__ */ d("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"
 				})]
 			})
-		}) : r.length === 0 ? /* @__PURE__ */ o("div", {
+		}) : a.length === 0 ? /* @__PURE__ */ f("div", {
 			className: "py-8 text-center",
 			children: [
-				/* @__PURE__ */ a(l, { className: "mx-auto mb-3 h-icon-lg w-icon-lg text-text-muted" }),
-				/* @__PURE__ */ a("p", {
+				/* @__PURE__ */ d(h, { className: "mx-auto mb-3 h-icon-lg w-icon-lg text-text-muted" }),
+				/* @__PURE__ */ d("p", {
 					className: "mb-2 text-sm text-text-secondary",
 					children: "No workflows linked"
 				}),
-				/* @__PURE__ */ a("p", {
+				/* @__PURE__ */ d("p", {
 					className: "text-xs text-text-muted",
-					children: "Link workflows from the Workflows page to push data to this data sink."
+					children: E ? x("bigconsole.dataSinks.view.linkWorkflow.emptyHint", "Use Link workflow to choose a FluidGrids workflow that pushes data into this sink, or manage links from the Workflows page.") : "Link workflows from the Workflows page to push data to this data sink."
 				}),
-				/* @__PURE__ */ o(e, {
+				/* @__PURE__ */ f(e, {
 					to: "/workflows",
 					className: `mt-4 inline-flex min-h-[var(--size-controlHeight-md)] items-center gap-1 text-xs font-medium text-text-link hover:underline ${t}`,
-					children: ["Go to Workflows", /* @__PURE__ */ a(d, { className: "w-3 h-3" })]
+					children: ["Go to Workflows", /* @__PURE__ */ d(_, { className: "w-3 h-3" })]
 				})
 			]
-		}) : /* @__PURE__ */ o("div", {
+		}) : /* @__PURE__ */ f("div", {
 			className: "space-y-list-gap",
-			children: [p.map((n) => {
+			children: [w.map((n) => {
 				if (!n.workflow) return null;
-				let r = c(n.workflow.status);
-				return /* @__PURE__ */ o(e, {
+				let r = m(n.workflow.status);
+				return /* @__PURE__ */ f(e, {
 					to: `/workflows/${n.workflow.id}`,
 					className: `group flex min-h-[var(--size-controlHeight-md)] items-center justify-between gap-icon-gap rounded-input bg-bg-sunken p-3 motion-safe:transition-colors hover:bg-bg-elevated ${t}`,
-					children: [/* @__PURE__ */ o("div", {
+					children: [/* @__PURE__ */ f("div", {
 						className: "flex min-w-0 items-center gap-icon-gap",
-						children: [/* @__PURE__ */ a(l, { className: "h-icon-md w-icon-md shrink-0 text-text-secondary" }), /* @__PURE__ */ o("div", {
+						children: [/* @__PURE__ */ d(h, { className: "h-icon-md w-icon-md shrink-0 text-text-secondary" }), /* @__PURE__ */ f("div", {
 							className: "min-w-0",
-							children: [/* @__PURE__ */ a("p", {
+							children: [/* @__PURE__ */ d("p", {
 								className: "truncate text-sm font-medium text-text-primary group-hover:text-text-link",
 								children: n.workflow.name
-							}), /* @__PURE__ */ a("p", {
+							}), /* @__PURE__ */ d("p", {
 								className: "truncate font-mono text-xs text-text-secondary",
 								children: n.workflow.key
 							})]
 						})]
-					}), /* @__PURE__ */ o("div", {
+					}), /* @__PURE__ */ f("div", {
 						className: "flex shrink-0 items-center gap-icon-gap",
-						children: [n.workflow.lastExecutedAt && /* @__PURE__ */ a("span", {
+						children: [n.workflow.lastExecutedAt && /* @__PURE__ */ d("span", {
 							className: "hidden text-xs text-text-secondary sm:inline",
-							children: s(new Date(n.workflow.lastExecutedAt), { addSuffix: !0 })
-						}), /* @__PURE__ */ o("div", {
+							children: p(new Date(n.workflow.lastExecutedAt), { addSuffix: !0 })
+						}), /* @__PURE__ */ f("div", {
 							className: `flex items-center gap-1.5 rounded-pill px-2 py-0.5 ${r.bgColor}`,
-							children: [/* @__PURE__ */ a("span", { className: `h-1.5 w-1.5 rounded-pill ${r.dotColor}` }), /* @__PURE__ */ a("span", {
+							children: [/* @__PURE__ */ d("span", { className: `h-1.5 w-1.5 rounded-pill ${r.dotColor}` }), /* @__PURE__ */ d("span", {
 								className: `text-xs font-medium ${r.textColor}`,
 								children: r.label
 							})]
 						})]
 					})]
 				}, n.id);
-			}), m.length > 0 && /* @__PURE__ */ a(n, {
+			}), T.length > 0 && /* @__PURE__ */ d(n, {
 				emphasis: "bare",
 				padding: "none",
 				headingLevel: 3,
-				title: `Disabled (${m.length})`,
+				title: `Disabled (${T.length})`,
 				className: "mt-form-gap border-t border-[var(--color-border-subtle)] pt-form-gap",
 				headerClassName: "mb-list-gap",
 				bodyClassName: "space-y-list-gap",
-				children: m.map((t) => t.workflow ? /* @__PURE__ */ o(e, {
+				children: T.map((t) => t.workflow ? /* @__PURE__ */ f(e, {
 					to: `/workflows/${t.workflow.id}`,
 					className: "group flex min-h-[var(--size-controlHeight-md)] items-center justify-between gap-icon-gap rounded-input bg-bg-sunken p-3 opacity-60 motion-safe:transition-colors hover:opacity-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface",
-					children: [/* @__PURE__ */ o("div", {
+					children: [/* @__PURE__ */ f("div", {
 						className: "flex min-w-0 items-center gap-icon-gap",
-						children: [/* @__PURE__ */ a(l, { className: "h-icon-md w-icon-md shrink-0 text-text-muted" }), /* @__PURE__ */ o("div", {
+						children: [/* @__PURE__ */ d(h, { className: "h-icon-md w-icon-md shrink-0 text-text-muted" }), /* @__PURE__ */ f("div", {
 							className: "min-w-0",
-							children: [/* @__PURE__ */ a("p", {
+							children: [/* @__PURE__ */ d("p", {
 								className: "truncate text-sm font-medium text-text-secondary group-hover:text-text-primary",
 								children: t.workflow.name
-							}), /* @__PURE__ */ a("p", {
+							}), /* @__PURE__ */ d("p", {
 								className: "truncate font-mono text-xs text-text-muted",
 								children: t.workflow.key
 							})]
 						})]
-					}), /* @__PURE__ */ a("span", {
+					}), /* @__PURE__ */ d("span", {
 						className: "shrink-0 text-xs text-text-muted",
 						children: "Disabled"
 					})]
 				}, t.id) : null)
 			})]
-		}) })
+		})] })
 	});
 });
 //#endregion
-export { f as LinkedWorkflowsPanel, f as default };
+export { v as LinkedWorkflowsPanel, v as default };

package/dist/bigconsole/components/datasink/SinkWorkflowLinkForm.d.ts

@@ -0,0 +1,13 @@
+import { DataSinkWorkflowLink } from '../../types';
+export interface SinkWorkflowLinkFormProps {
+    /** Key of the sink the workflow will deliver into */
+    dataSinkKey: string;
+    /** Links the sink already has */
+    workflowLinks?: DataSinkWorkflowLink[];
+    /** Called after a successful link so the page can reload the sink */
+    onLinked: () => Promise<void>;
+    /** Called when the user closes the form without linking */
+    onCancel: () => void;
+}
+export declare function SinkWorkflowLinkForm({ dataSinkKey, workflowLinks, onLinked, onCancel }: SinkWorkflowLinkFormProps): import('react').JSX.Element;
+export default SinkWorkflowLinkForm;

package/dist/bigconsole/components/datasink/SinkWorkflowLinkForm.js

@@ -0,0 +1,80 @@
+import e from "../../hooks/useWorkflowOperations.js";
+import { SECTION_FOCUS_RING as t } from "../common/sectionStyles.js";
+import "../common/index.js";
+import { linkableWorkflowsForSink as n } from "../../utils/sinkWorkflowLink.js";
+import { useMemo as r, useState as i } from "react";
+import { Button as a } from "@burdenoff/fe-libs/ui";
+import { useI18n as o } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+//#region src/bigconsole/components/datasink/SinkWorkflowLinkForm.tsx
+function l({ dataSinkKey: l, workflowLinks: u, onLinked: d, onCancel: f }) {
+	let { t: p } = o(), { workflows: m, loading: h, error: g, linkDataSink: _ } = e(), [v, y] = i(""), [b, x] = i(!1), [S, C] = i(null), w = r(() => n(m, u), [m, u]), T = async (e) => {
+		if (e.preventDefault(), !(!w.some((e) => e.id === v) || b)) {
+			x(!0), C(null);
+			try {
+				if (!await _(v, { dataSinkKey: l })) {
+					C(p("bigconsole.dataSinks.view.linkWorkflow.saveError", "The workflow could not be linked. Try again."));
+					return;
+				}
+				await d();
+			} finally {
+				x(!1);
+			}
+		}
+	}, E = `w-full min-w-0 rounded-input border border-[var(--color-border-subtle)] bg-bg-canvas px-3 py-2 text-sm text-text-primary ${t}`;
+	return /* @__PURE__ */ c("form", {
+		onSubmit: T,
+		className: "mb-form-gap flex min-w-0 flex-col gap-form-gap rounded-card border border-[var(--color-border-subtle)] bg-bg-sunken p-3",
+		"data-testid": "sink-workflow-link-form",
+		children: [
+			/* @__PURE__ */ c("label", {
+				className: "block text-sm font-medium text-text-primary",
+				children: [p("bigconsole.dataSinks.view.linkWorkflow.workflowLabel", "Workflow"), /* @__PURE__ */ c("select", {
+					value: v,
+					onChange: (e) => y(e.target.value),
+					disabled: h || b,
+					required: !0,
+					className: E,
+					children: [/* @__PURE__ */ s("option", {
+						value: "",
+						children: p("bigconsole.dataSinks.view.linkWorkflow.select", "Select a workflow")
+					}), w.map((e) => /* @__PURE__ */ s("option", {
+						value: e.id,
+						children: e.name || e.key
+					}, e.id))]
+				})]
+			}),
+			/* @__PURE__ */ s("p", {
+				className: "text-xs text-text-secondary",
+				children: p("bigconsole.dataSinks.view.linkWorkflow.help", "The workflow will deliver its output into this sink’s key ({{key}}).", { key: l })
+			}),
+			!h && !g && w.length === 0 && /* @__PURE__ */ s("p", {
+				className: "text-sm text-text-secondary",
+				children: p("bigconsole.dataSinks.view.linkWorkflow.noAvailable", "Every workflow in this workspace is already linked to this sink, or there are none yet.")
+			}),
+			(g || S) && /* @__PURE__ */ s("p", {
+				role: "alert",
+				className: "text-sm text-status-error-text",
+				children: S || p("bigconsole.dataSinks.view.linkWorkflow.loadError", "Workflows could not be loaded. Close and reopen the form to retry.")
+			}),
+			/* @__PURE__ */ c("div", {
+				className: "flex flex-wrap gap-2",
+				children: [/* @__PURE__ */ s(a, {
+					type: "submit",
+					disabled: !v || b || h,
+					className: "w-full sm:w-auto",
+					children: b ? p("bigconsole.dataSinks.view.linkWorkflow.saving", "Linking…") : p("bigconsole.dataSinks.view.linkWorkflow.submit", "Link workflow")
+				}), /* @__PURE__ */ s(a, {
+					type: "button",
+					variant: "ghost",
+					onClick: f,
+					disabled: b,
+					className: "w-full sm:w-auto",
+					children: p("bigconsole.dataSinks.view.linkWorkflow.cancel", "Cancel")
+				})]
+			})
+		]
+	});
+}
+//#endregion
+export { l as SinkWorkflowLinkForm, l as default };