@burdenoff/microfe-bigconsole 2026.612.1 → 2026.612.2

package/dist/bigconsole/pages/DashboardBuilderPage.js

@@ -15,32 +15,34 @@ import u from "../components/dashboard/ExportDashboardDialog.js";
 import "../components/dashboard/index.js";
 import { memo as d, useCallback as f, useEffect as p, useState as m } from "react";
 import { useParams as h } from "react-router-dom";
-import { jsx as g, jsxs as _ } from "react/jsx-runtime";
+import { ArrowLeft as g } from "lucide-react";
+import { jsx as _, jsxs as v } from "react/jsx-runtime";
+import { Button as y } from "@burdenoff/fe-libs/ui";
 //#region src/bigconsole/pages/DashboardBuilderPage.tsx
-function v() {
+function b() {
 	try {
 		return window.__breadcrumbRegistry;
 	} catch {
 		return;
 	}
 }
-function y(e, t) {
-	let n = v();
+function x(e, t) {
+	let n = b();
 	n?.register && n.register(e, t);
 }
-function b(e) {
-	let t = v();
+function S(e) {
+	let t = b();
 	t?.unregister && t.unregister(e);
 }
-var x = d(function() {
-	let { dashboardId: d } = h(), v = n(), [x, S] = m(!1), [C, w] = m(!1), [T, E] = m(!1), [D, O] = m(null), { fetchDashboard: k, updateDashboard: A, loading: j, error: M } = i(), { createWidget: N, updateWidget: P, deleteWidget: F, duplicateWidget: I, batchUpdatePositions: L } = r(void 0, d), { createPage: R, updatePage: z, deletePage: B, reorderPages: V } = a(), H = t((e) => e.setCurrentDashboard), U = t((e) => e.currentDashboard), W = t((e) => e.setViewMode), G = e((e) => e.selectWidget), K = e((e) => e.widgets), q = e((e) => e.clipboardWidgetId), J = e((e) => e.clipboardAction), Y = e((e) => e.clearClipboard);
-	p(() => (W("edit"), () => W("view")), [W]), p(() => {
+var C = d(function() {
+	let { dashboardId: d } = h(), b = n(), [C, w] = m(!1), [T, E] = m(!1), [D, O] = m(!1), [k, A] = m(null), { fetchDashboard: j, updateDashboard: M, loading: N, error: P } = i(), { createWidget: F, updateWidget: I, deleteWidget: L, duplicateWidget: R, batchUpdatePositions: z } = r(void 0, d), { createPage: B, updatePage: V, deletePage: H, reorderPages: U } = a(), W = t((e) => e.setCurrentDashboard), G = t((e) => e.currentDashboard), K = t((e) => e.setViewMode), q = e((e) => e.selectWidget), J = e((e) => e.widgets), Y = e((e) => e.clipboardWidgetId), X = e((e) => e.clipboardAction), Z = e((e) => e.clearClipboard);
+	p(() => (K("edit"), () => K("view")), [K]), p(() => {
 		if (!d) {
-			v("/dashboards");
+			b("/dashboards");
 			return;
 		}
-		return k(d).then((e) => {
-			e ? (H({
+		return j(d).then((e) => {
+			e ? (W({
 				id: e.id,
 				title: e.name,
 				description: e.description || "",
@@ -52,25 +54,25 @@ var x = d(function() {
 				})),
 				createdAt: e.createdAt,
 				updatedAt: e.updatedAt
-			}), e.pages.length > 0 && !D && O(e.pages[0].id), e.name && y(d, e.name)) : v("/dashboards");
+			}), e.pages.length > 0 && !k && A(e.pages[0].id), e.name && x(d, e.name)) : b("/dashboards");
 		}), () => {
-			d && b(d);
+			d && S(d);
 		};
 	}, [
 		d,
-		v,
-		H,
-		k,
-		D
+		b,
+		W,
+		j,
+		k
 	]);
-	let X = f(async () => {
-		if (!q || !d || !U?.pages?.[0]?.id) return;
-		let e = K.get(q);
+	let Q = f(async () => {
+		if (!Y || !d || !G?.pages?.[0]?.id) return;
+		let e = J.get(Y);
 		if (!e) {
-			Y();
+			Z();
 			return;
 		}
-		let t = U.pages[0].id, n = Array.from(K.values()), r = {
+		let t = G.pages[0].id, n = Array.from(J.values()), r = {
 			width: e.positionWidth ?? 4,
 			height: e.positionHeight ?? 4
 		}, { x: i, y: a } = c(n, r, { cols: 12 }), o = {
@@ -78,11 +80,11 @@ var x = d(function() {
 			y: a,
 			width: r.width,
 			height: r.height
-		}, s = J === "copy" ? `${e.title} (Copy)` : e.title, l = null;
+		}, s = X === "copy" ? `${e.title} (Copy)` : e.title, l = null;
 		try {
-			l = await I(q, o, s);
+			l = await R(Y, o, s);
 		} catch {}
-		l ||= await N({
+		l ||= await F({
 			pageId: t,
 			dashboardId: d,
 			type: e.type,
@@ -96,24 +98,24 @@ var x = d(function() {
 			position: o,
 			refreshInterval: e.refreshInterval ?? void 0,
 			metadata: e.metadata
-		}), l && (G(l.id), J === "cut" && await F(q)), Y();
+		}), l && (q(l.id), X === "cut" && await L(Y)), Z();
 	}, [
-		q,
-		J,
+		Y,
+		X,
 		d,
-		U,
-		K,
-		I,
-		N,
-		F,
 		G,
-		Y
-	]), Z = f(async (e) => {
-		if (!d || !U?.pages?.[0]?.id) return;
-		let t = U.pages[0].id, n = e.replace(/_/g, " ").toLowerCase().replace(/^\w/, (e) => e.toUpperCase()), r = Array.from(K.values()), i = o(e), a = {
+		J,
+		R,
+		F,
+		L,
+		q,
+		Z
+	]), $ = f(async (e) => {
+		if (!d || !G?.pages?.[0]?.id) return;
+		let t = G.pages[0].id, n = e.replace(/_/g, " ").toLowerCase().replace(/^\w/, (e) => e.toUpperCase()), r = Array.from(J.values()), i = o(e), a = {
 			width: i?.defaultSize?.width ?? 4,
 			height: i?.defaultSize?.height ?? 4
-		}, { x: s, y: l } = c(r, a, { cols: 12 }), u = await N({
+		}, { x: s, y: l } = c(r, a, { cols: 12 }), u = await F({
 			pageId: t,
 			dashboardId: d,
 			type: e,
@@ -126,16 +128,18 @@ var x = d(function() {
 				height: a.height
 			}
 		});
-		u && (G(u.id), S(!1));
+		u && (q(u.id), w(!1));
 	}, [
 		d,
-		U,
-		N,
 		G,
-		K
-	]), Q = f(async () => {
+		F,
+		q,
+		J
+	]), ee = f(() => {
+		b("/dashboards");
+	}, [b]), te = f(async () => {
 		if (d) {
-			w(!0);
+			E(!0);
 			try {
 				let t = e.getState(), n = Array.from(t.widgets.values()), r = t.dirtyWidgetIds, i = n.filter((e) => r.has(e.id));
 				if (i.length > 0) {
@@ -151,14 +155,14 @@ var x = d(function() {
 							parserRules: e.parserRules ?? void 0
 						};
 						try {
-							return await P(t);
+							return await I(t);
 						} catch (e) {
 							throw e;
 						}
 					});
 					await Promise.all(e), t.clearAllDirty();
 				}
-				n.length > 0 && await L(n.map((e) => ({
+				n.length > 0 && await z(n.map((e) => ({
 					id: e.id,
 					position: e.position || {
 						x: e.positionX ?? 0,
@@ -166,233 +170,249 @@ var x = d(function() {
 						width: e.positionWidth ?? 4,
 						height: e.positionHeight ?? 4
 					}
-				}))), U && await A({
+				}))), G && await M({
 					id: d,
-					name: U.title,
-					description: U.description
+					name: G.title,
+					description: G.description
 				});
 			} catch {} finally {
-				w(!1);
+				E(!1);
 			}
 		}
 	}, [
 		d,
-		U,
-		P,
-		L,
-		A
-	]), $ = f(() => {
-		E(!0);
-	}, []), ee = f(() => {
-		E(!1);
-	}, []), te = f((e) => {
-		O(e);
-	}, []), ne = f(async () => {
-		if (!U || !d) return;
-		let e = await R({
+		G,
+		I,
+		z,
+		M
+	]), ne = f(() => {
+		O(!0);
+	}, []), re = f(() => {
+		O(!1);
+	}, []), ie = f((e) => {
+		A(e);
+	}, []), ae = f(async () => {
+		if (!G || !d) return;
+		let e = await B({
 			dashboardId: d,
-			name: `Page ${U.pages.length + 1}`
+			name: `Page ${G.pages.length + 1}`
 		});
-		e && (H({
-			...U,
-			pages: [...U.pages, {
+		e && (W({
+			...G,
+			pages: [...G.pages, {
 				id: e.id,
 				title: e.name,
 				index: e.order,
 				layoutConfig: e.layoutConfig || {}
 			}]
-		}), O(e.id));
+		}), A(e.id));
 	}, [
-		U,
+		G,
 		d,
-		H,
-		R
-	]), re = f(async (e, t) => {
-		U && await z({
+		W,
+		B
+	]), oe = f(async (e, t) => {
+		G && await V({
 			id: e,
 			name: t
-		}) && H({
-			...U,
-			pages: U.pages.map((n) => n.id === e ? {
+		}) && W({
+			...G,
+			pages: G.pages.map((n) => n.id === e ? {
 				...n,
 				title: t
 			} : n)
 		});
 	}, [
-		U,
-		H,
-		z
-	]), ie = f(async (e) => {
-		if (!U || !d) return;
-		let t = U.pages.find((t) => t.id === e);
+		G,
+		W,
+		V
+	]), se = f(async (e) => {
+		if (!G || !d) return;
+		let t = G.pages.find((t) => t.id === e);
 		if (!t) return;
-		let n = await R({
+		let n = await B({
 			dashboardId: d,
 			name: `${t.title} (Copy)`
 		});
-		n && (H({
-			...U,
-			pages: [...U.pages, {
+		n && (W({
+			...G,
+			pages: [...G.pages, {
 				id: n.id,
 				title: n.name,
 				index: n.order,
 				layoutConfig: n.layoutConfig || {}
 			}]
-		}), O(n.id));
+		}), A(n.id));
 	}, [
-		U,
+		G,
 		d,
-		H,
-		R
-	]), ae = f(async (e) => {
-		if (!(!U || U.pages.length <= 1) && await B(e)) {
-			let t = U.pages.filter((t) => t.id !== e).map((e, t) => ({
+		W,
+		B
+	]), ce = f(async (e) => {
+		if (!(!G || G.pages.length <= 1) && await H(e)) {
+			let t = G.pages.filter((t) => t.id !== e).map((e, t) => ({
 				...e,
 				index: t
 			}));
-			H({
-				...U,
+			W({
+				...G,
 				pages: t
-			}), D === e && O(t[0]?.id || null);
+			}), k === e && A(t[0]?.id || null);
 		}
 	}, [
-		U,
-		H,
-		D,
-		B
-	]), oe = f(async (e) => {
-		!U || !d || (H({
-			...U,
+		G,
+		W,
+		k,
+		H
+	]), le = f(async (e) => {
+		!G || !d || (W({
+			...G,
 			pages: e.map((e, t) => ({
 				...e,
 				index: t
 			}))
-		}), await V(d, e.map((e) => e.id)));
+		}), await U(d, e.map((e) => e.id)));
 	}, [
-		U,
+		G,
 		d,
-		H,
-		V
+		W,
+		U
 	]);
-	return j || !U ? /* @__PURE__ */ g("div", {
+	return N || !G ? /* @__PURE__ */ _("div", {
 		className: "flex items-center justify-center h-full",
-		children: /* @__PURE__ */ g("div", { className: "animate-spin w-8 h-8 border-4 border-action-primary-bg border-t-transparent rounded-full" })
-	}) : M ? /* @__PURE__ */ g("div", {
+		children: /* @__PURE__ */ _("div", { className: "animate-spin w-8 h-8 border-4 border-action-primary-bg border-t-transparent rounded-full" })
+	}) : P ? /* @__PURE__ */ _("div", {
 		className: "flex flex-col items-center justify-center h-full p-6",
-		children: /* @__PURE__ */ _("div", {
+		children: /* @__PURE__ */ v("div", {
 			className: "bg-status-error-bg border border-status-error-border rounded-lg p-4 max-w-md",
 			children: [
-				/* @__PURE__ */ g("h3", {
+				/* @__PURE__ */ _("h3", {
 					className: "text-sm font-medium text-status-error-text",
 					children: "Failed to load dashboard"
 				}),
-				/* @__PURE__ */ g("p", {
+				/* @__PURE__ */ _("p", {
 					className: "text-sm text-text-secondary mt-1",
-					children: M.message
+					children: P.message
 				}),
-				/* @__PURE__ */ g("button", {
+				/* @__PURE__ */ _("button", {
 					type: "button",
-					onClick: () => v("/dashboards"),
+					onClick: () => b("/dashboards"),
 					className: "mt-3 px-3 py-1.5 text-sm font-medium text-action-primary-fg bg-action-primary-bg hover:bg-action-primary-bgHover rounded-md",
 					children: "Back to Dashboards"
 				})
 			]
 		})
-	}) : /* @__PURE__ */ _("div", {
-		className: "flex h-full",
-		children: [
-			/* @__PURE__ */ g("div", {
-				className: `
-          ${x ? "w-72" : "w-0"}
+	}) : /* @__PURE__ */ v("div", {
+		className: "flex flex-col h-full",
+		children: [/* @__PURE__ */ v("div", {
+			className: "flex items-center gap-3 px-3 py-2 border-b border-border-default bg-bg-surface flex-shrink-0",
+			children: [/* @__PURE__ */ v(y, {
+				onClick: ee,
+				variant: "ghost",
+				size: "sm",
+				title: "Back to Dashboards",
+				"aria-label": "Back to Dashboards",
+				children: [/* @__PURE__ */ _(g, { className: "w-4 h-4 mr-2" }), "Back"]
+			}), /* @__PURE__ */ _("h2", {
+				className: "text-sm font-semibold text-text-primary truncate",
+				children: G.title
+			})]
+		}), /* @__PURE__ */ v("div", {
+			className: "flex flex-1 min-h-0 relative",
+			children: [
+				/* @__PURE__ */ _("div", {
+					className: `
+          ${C ? "w-72" : "w-0"}
           flex-shrink-0
           bg-bg-surface
           border-r border-border-default
           transition-all duration-300
           overflow-hidden
         `,
-				children: x && /* @__PURE__ */ _("div", {
-					className: "h-full flex flex-col",
-					children: [/* @__PURE__ */ _("div", {
-						className: "flex items-center justify-between p-3 border-b border-border-default",
-						children: [/* @__PURE__ */ g("h3", {
-							className: "text-sm font-semibold text-text-primary",
-							children: "Widgets"
-						}), /* @__PURE__ */ g("button", {
-							type: "button",
-							onClick: () => S(!1),
-							className: "\n                  p-1 rounded-md\n                  text-text-secondary\n                  hover:text-text-primary\n                  hover:bg-bg-muted\n                ",
-							children: /* @__PURE__ */ g("svg", {
-								className: "w-4 h-4",
-								fill: "none",
-								stroke: "currentColor",
-								viewBox: "0 0 24 24",
-								children: /* @__PURE__ */ g("path", {
-									strokeLinecap: "round",
-									strokeLinejoin: "round",
-									strokeWidth: 2,
-									d: "M6 18L18 6M6 6l12 12"
+					children: C && /* @__PURE__ */ v("div", {
+						className: "h-full flex flex-col",
+						children: [/* @__PURE__ */ v("div", {
+							className: "flex items-center justify-between p-3 border-b border-border-default",
+							children: [/* @__PURE__ */ _("h3", {
+								className: "text-sm font-semibold text-text-primary",
+								children: "Widgets"
+							}), /* @__PURE__ */ _("button", {
+								type: "button",
+								onClick: () => w(!1),
+								className: "\n                  p-1 rounded-md\n                  text-text-secondary\n                  hover:text-text-primary\n                  hover:bg-bg-muted\n                ",
+								children: /* @__PURE__ */ _("svg", {
+									className: "w-4 h-4",
+									fill: "none",
+									stroke: "currentColor",
+									viewBox: "0 0 24 24",
+									children: /* @__PURE__ */ _("path", {
+										strokeLinecap: "round",
+										strokeLinejoin: "round",
+										strokeWidth: 2,
+										d: "M6 18L18 6M6 6l12 12"
+									})
 								})
-							})
+							})]
+						}), /* @__PURE__ */ _("div", {
+							className: "flex-1 overflow-auto",
+							children: /* @__PURE__ */ _(s, { onSelect: $ })
 						})]
-					}), /* @__PURE__ */ g("div", {
-						className: "flex-1 overflow-auto",
-						children: /* @__PURE__ */ g(s, { onSelect: Z })
-					})]
-				})
-			}),
-			!x && /* @__PURE__ */ g("button", {
-				type: "button",
-				onClick: () => S(!0),
-				className: "\n            absolute left-0 top-1/2 -translate-y-1/2 z-20\n            w-8 h-24\n            bg-bg-surface\n            border border-l-0 border-border-default\n            rounded-r-lg\n            flex items-center justify-center\n            text-text-secondary\n            hover:text-text-primary\n            hover:bg-bg-muted\n            transition-colors\n          ",
-				title: "Open widget panel",
-				children: /* @__PURE__ */ g("svg", {
-					className: "w-4 h-4",
-					fill: "none",
-					stroke: "currentColor",
-					viewBox: "0 0 24 24",
-					children: /* @__PURE__ */ g("path", {
-						strokeLinecap: "round",
-						strokeLinejoin: "round",
-						strokeWidth: 2,
-						d: "M9 5l7 7-7 7"
 					})
+				}),
+				!C && /* @__PURE__ */ _("button", {
+					type: "button",
+					onClick: () => w(!0),
+					className: "\n            absolute left-0 top-1/2 -translate-y-1/2 z-20\n            w-8 h-24\n            bg-bg-surface\n            border border-l-0 border-border-default\n            rounded-r-lg\n            flex items-center justify-center\n            text-text-secondary\n            hover:text-text-primary\n            hover:bg-bg-muted\n            transition-colors\n          ",
+					title: "Open widget panel",
+					children: /* @__PURE__ */ _("svg", {
+						className: "w-4 h-4",
+						fill: "none",
+						stroke: "currentColor",
+						viewBox: "0 0 24 24",
+						children: /* @__PURE__ */ _("path", {
+							strokeLinecap: "round",
+							strokeLinejoin: "round",
+							strokeWidth: 2,
+							d: "M9 5l7 7-7 7"
+						})
+					})
+				}),
+				/* @__PURE__ */ _("div", {
+					className: "flex-1 relative",
+					children: /* @__PURE__ */ _(l, {
+						dashboardId: G.id,
+						pageId: k || G.pages?.[0]?.id,
+						title: G.title,
+						onPaste: Q,
+						onSave: te,
+						isSaving: T,
+						onExport: ne,
+						pages: G.pages.map((e) => ({
+							id: e.id,
+							name: e.title || `Page ${(e.index ?? 0) + 1}`,
+							order: e.index ?? 0
+						})),
+						activePageId: k || G.pages?.[0]?.id,
+						onPageChange: ie,
+						onPageAdd: ae,
+						onPageRename: oe,
+						onPageDuplicate: se,
+						onPageDelete: ce,
+						onPagesReorder: le,
+						showPageTabs: !0
+					})
+				}),
+				/* @__PURE__ */ _(u, {
+					isOpen: D,
+					dashboardId: G.id,
+					dashboardName: G.title,
+					onClose: re
 				})
-			}),
-			/* @__PURE__ */ g("div", {
-				className: "flex-1 relative",
-				children: /* @__PURE__ */ g(l, {
-					dashboardId: U.id,
-					pageId: D || U.pages?.[0]?.id,
-					title: U.title,
-					onPaste: X,
-					onSave: Q,
-					isSaving: C,
-					onExport: $,
-					pages: U.pages.map((e) => ({
-						id: e.id,
-						name: e.title || `Page ${(e.index ?? 0) + 1}`,
-						order: e.index ?? 0
-					})),
-					activePageId: D || U.pages?.[0]?.id,
-					onPageChange: te,
-					onPageAdd: ne,
-					onPageRename: re,
-					onPageDuplicate: ie,
-					onPageDelete: ae,
-					onPagesReorder: oe,
-					showPageTabs: !0
-				})
-			}),
-			/* @__PURE__ */ g(u, {
-				isOpen: T,
-				dashboardId: U.id,
-				dashboardName: U.title,
-				onClose: ee
-			})
-		]
+			]
+		})]
 	});
 });
 //#endregion
-export { x as DashboardBuilderPage, x as default };
+export { C as DashboardBuilderPage, C as default };
 
 //# sourceMappingURL=DashboardBuilderPage.js.map