@overvis/hmi-workspace-ui 0.0.0-stage → 0.1.0

package/dist/page-2KPemaAj.js

@@ -0,0 +1,328 @@
+import { t as e } from "./rolldown-runtime-Dy4uBu1J.js";
+import { r as t } from "./trpc-CvJUuUXp.js";
+import { h as n, m as r } from "./i18n-BgzakKoC.js";
+import { L as i } from "./mutation-form-validators-BNz5bsv1.js";
+import { t as a } from "./button-6SxPBYMz.js";
+import { n as o } from "./skeleton-6yk8Tdh5.js";
+import { a as s, o as c, r as l } from "./context-u9KJQmdB.js";
+import { r as u } from "./dialogs-D_v1LeH4.js";
+import { n as d } from "./api-error-9rQmUN5L.js";
+import { t as f } from "./notice-card-DyGywFsW.js";
+import { a as p, t as ee } from "./dashboard-context-CBfG6DoT.js";
+import { h as m } from "./mutations-THtGG6Ai.js";
+import { a as h, h as g, r as _, t as v } from "./dropdown-menu-DSzbBq3v.js";
+import { P as y, t as te } from "./provider-DoEpKcQ-.js";
+import { t as b } from "./page-header-RB2YFWlE.js";
+import { n as x } from "./theme-provider-BkRohQFU.js";
+import { n as S, r as C } from "./query-gate-DVhNIkge.js";
+import { c as w, d as T, f as E, h as D, l as O, m as k, p as A, u as j } from "./dashboards-page-BlrJguNz.js";
+import { useQuery as ne } from "@tanstack/react-query";
+import { useEffect as re, useState as M } from "react";
+import { DASHBOARD_DIAGNOSTICS_ATTR as N, DASHBOARD_SCOPE_ATTR as P, boundedDashboardHostDiagnostics as F, dashboardConfigurationIssues as I, dashboardStylesheetUrl as L, formatDashboardConfigurationIssues as R } from "@overvis/hmi-shared/dashboard";
+import { Fragment as z, jsx as B, jsxs as V } from "react/jsx-runtime";
+import { CloudDownloadIcon as H, CopyIcon as U, EllipsisIcon as W, SettingsIcon as G } from "lucide-react";
+import { resolveLocalized as K } from "@overvis/hmi-shared";
+//#region src/workspace/dashboards/actions-menu.tsx
+function q({ dashboard: e }) {
+	let t = r(), n = l(), [i, o] = M(null);
+	return n ? /* @__PURE__ */ V(z, { children: [
+		/* @__PURE__ */ V(v, { children: [/* @__PURE__ */ B(g, {
+			render: /* @__PURE__ */ B(a, {
+				variant: "ghost",
+				size: "icon",
+				"aria-label": t("dashboard_actions")
+			}),
+			children: /* @__PURE__ */ B(W, {})
+		}), /* @__PURE__ */ V(_, {
+			align: "end",
+			className: "w-auto",
+			children: [/* @__PURE__ */ V(h, {
+				onClick: () => {
+					o("settings");
+				},
+				children: [/* @__PURE__ */ B(G, {}), t("dashboard_edit_settings")]
+			}), /* @__PURE__ */ V(h, {
+				onClick: () => {
+					o("copy");
+				},
+				children: [/* @__PURE__ */ B(U, {}), t("dashboard_copy_action")]
+			})]
+		})] }),
+		i === "settings" ? /* @__PURE__ */ B(u, {
+			workspaceId: e.workspaceId,
+			dashboardId: e.id,
+			onClose: () => {
+				o(null);
+			}
+		}) : null,
+		i === "copy" ? /* @__PURE__ */ B(k, {
+			workspaceId: e.workspaceId,
+			dashboard: e,
+			onClose: () => {
+				o(null);
+			}
+		}) : null
+	] }) : null;
+}
+//#endregion
+//#region src/workspace/dashboards/mount-diagnostics.ts
+var J = {
+	invalid_module: "Invalid dashboard module: check supportedLocales and graphicsSymbols exports",
+	no_default: "Missing or invalid default export: expected a dashboard component function",
+	no_config_type: "Missing or invalid dashboardConfigType export: expected a TypeBox schema",
+	rebuild_required: "Dashboard build manifest is missing, invalid or incompatible with the host; rebuild required"
+}, Y = class extends Error {
+	reason;
+	constructor(e) {
+		super(J[e]), this.reason = e;
+	}
+};
+async function ie(e) {
+	let t = w(), n = await E(j(e, t));
+	if (!n.ok) {
+		if (n.reason === "no_config_type") return {
+			kind: "config-export",
+			cacheNonce: t
+		};
+		if (n.reason === "rebuild_required") return {
+			kind: "rebuild-required",
+			cacheNonce: t
+		};
+		throw new Y(n.reason);
+	}
+	return {
+		kind: "ok",
+		...n.module,
+		cacheNonce: t
+	};
+}
+function X(e) {
+	return {
+		stage: "exports",
+		code: e,
+		message: J[e]
+	};
+}
+function ae(e) {
+	return e instanceof Y ? X(e.reason) : {
+		stage: "module-load",
+		code: "load_failed",
+		message: e instanceof Error ? e.message : typeof e == "string" ? e : "Dashboard module failed to load"
+	};
+}
+//#endregion
+//#region src/workspace/dashboards/mount.tsx
+function oe(e) {
+	return e.moduleStatus === "error" ? "error" : e.moduleStatus === "loading" || !e.cssReady ? "skeleton" : "ready";
+}
+function se(e) {
+	return e === "ok" || e === "missing";
+}
+function ce(e) {
+	return e.stylesheetUrl == null || e.cacheNonce != null && e.settledNonce === e.cacheNonce;
+}
+function Z(e) {
+	if (e.loaded.kind === "config-export") return "/: missing dashboardConfigType export";
+	let t;
+	try {
+		t = I(e.loaded.dashboardConfigType, e.configuration);
+	} catch (e) {
+		return `Configuration validation failed: ${e instanceof Error ? e.message : "invalid schema"}`;
+	}
+	return t.length === 0 ? null : R(t);
+}
+function le({ children: e }) {
+	return /* @__PURE__ */ B("div", {
+		"data-slot": "dashboard-mount-canvas",
+		className: "flex min-h-full flex-col",
+		children: e
+	});
+}
+function ue({ workspaceId: e, dashboardId: t }) {
+	let n = r(), i = l();
+	return /* @__PURE__ */ B(f, {
+		title: n("dashboard_config_error_title"),
+		description: n("dashboard_config_error_description"),
+		...i ? { primaryAction: {
+			label: n("parameter_diagnostic_open_dashboard"),
+			href: `/workspace/${encodeURIComponent(e)}/setup/dashboards/${encodeURIComponent(t)}`
+		} } : {}
+	});
+}
+function Q({ entrypointUrl: e, stylesheetUrl: t, configuration: a, workspaceId: c, dashboardId: l, title: u }) {
+	let d = r(), h = n(), { resolvedTheme: g } = x(), _ = s(), v = h, [b, S] = M(null), C = ne({
+		queryKey: [
+			m,
+			e,
+			t
+		],
+		queryFn: () => ie(e),
+		staleTime: Infinity,
+		retry: !1
+	}), w = C.data?.cacheNonce, T = ce({
+		stylesheetUrl: t,
+		cacheNonce: w,
+		settledNonce: b
+	});
+	re(() => {
+		if (t == null || w == null) return;
+		let e = !1, n = O(t, w);
+		return n.settled.then((t) => {
+			!e && se(t) && S(w);
+		}), () => {
+			e = !0, n.stop();
+		};
+	}, [w, t]);
+	let E = oe({
+		moduleStatus: C.isError || !C.isLoading && C.data == null ? "error" : C.isFetching || C.data == null ? "loading" : "success",
+		cssReady: T
+	}), D, k = [], j = E === "skeleton" ? "loading" : "error";
+	if (E === "skeleton") D = /* @__PURE__ */ B("div", {
+		className: "p-4",
+		children: /* @__PURE__ */ B(o, { className: "h-40 w-full" })
+	});
+	else if (E === "error" || C.data == null) k = [ae(C.error)], D = /* @__PURE__ */ B("div", {
+		className: "p-4",
+		children: /* @__PURE__ */ B(f, {
+			title: d("dashboard_load_failed_title"),
+			description: d("dashboard_load_failed_description"),
+			onRetry: () => C.refetch(),
+			retrying: C.isFetching
+		})
+	});
+	else if (C.data.kind === "rebuild-required") k = [X("rebuild_required")], D = /* @__PURE__ */ B("div", {
+		className: "p-4",
+		children: /* @__PURE__ */ B(f, {
+			title: d("dashboard_rebuild_required_title"),
+			description: d("dashboard_rebuild_required_description")
+		})
+	});
+	else if (C.data.kind === "config-export") {
+		k = [X("no_config_type")];
+		let e = Z({
+			loaded: { kind: "config-export" },
+			configuration: a
+		});
+		console.error(`Dashboard ${l} configuration error:\n${e}`), D = /* @__PURE__ */ B("div", {
+			className: "p-4",
+			children: /* @__PURE__ */ B(f, {
+				title: d("dashboard_config_error_title"),
+				description: d("dashboard_config_export_missing_description")
+			})
+		});
+	} else {
+		let e = C.data, t = Z({
+			loaded: {
+				kind: "ok",
+				dashboardConfigType: e.dashboardConfigType
+			},
+			configuration: a
+		});
+		if (t != null) k = [{
+			stage: "configuration",
+			code: "invalid_configuration",
+			message: t
+		}], console.error(`Dashboard ${l} configuration error:\n${t}`), D = /* @__PURE__ */ B("div", {
+			className: "p-4",
+			children: /* @__PURE__ */ B(ue, {
+				workspaceId: c,
+				dashboardId: l
+			})
+		});
+		else {
+			j = "ready";
+			let t = e.component, n = A({
+				locale: v,
+				supportedLocales: e.supportedLocales
+			});
+			D = /* @__PURE__ */ B(te, {
+				symbols: e.graphicsSymbols,
+				children: /* @__PURE__ */ B(i, {
+					access: _.access,
+					children: /* @__PURE__ */ B(p, {
+						workspaceId: c,
+						dashboardId: l,
+						children: /* @__PURE__ */ B(ee, {
+							dashboardId: l,
+							title: u,
+							children: /* @__PURE__ */ B(y, {
+								locale: n,
+								children: /* @__PURE__ */ B(t, {
+									configuration: a,
+									theme: g,
+									locale: n,
+									workspaceId: c,
+									dashboardId: l
+								})
+							})
+						})
+					})
+				})
+			});
+		}
+	}
+	return /* @__PURE__ */ B("div", {
+		[P]: "",
+		"data-context-dashboard-id": l,
+		"data-dashboard-state": j,
+		...j === "error" && k.length > 0 ? { [N]: JSON.stringify(F(k)) } : {},
+		className: "min-h-0 min-w-0 flex-1",
+		children: /* @__PURE__ */ B(le, { children: D })
+	});
+}
+//#endregion
+//#region src/workspace/dashboards/page.tsx
+var de = /* @__PURE__ */ e({ DashboardPage: () => $ });
+function $({ workspaceId: e, dashboardId: i }) {
+	let a = r(), s = n(), { mode: l } = c(), u = t.dashboard.get.useQuery({ id: i }), p = T(i);
+	return /* @__PURE__ */ B(C, {
+		query: u,
+		loading: /* @__PURE__ */ V("div", {
+			className: "flex flex-1 flex-col gap-4 p-4",
+			children: [/* @__PURE__ */ B(o, { className: "h-8 w-64" }), /* @__PURE__ */ B(o, { className: "h-40 w-full" })]
+		}),
+		error: (e) => /* @__PURE__ */ B(S, {
+			className: "flex-1 justify-center p-8",
+			message: d(e ?? "dashboard_not_found"),
+			onRetry: () => u.refetch()
+		}),
+		children: (t) => {
+			let n = p.data?.usingRemoteFallback === !0, r = l === "local" && typeof window < "u" && new URLSearchParams(window.location.search).get("hmi-preview") === "built", c = p.data?.url;
+			return /* @__PURE__ */ V("div", {
+				className: "flex min-h-0 flex-1 flex-col",
+				children: [/* @__PURE__ */ B(b, {
+					icon: /* @__PURE__ */ B(D, {
+						icon: t.icon,
+						strokeWidth: 1.75
+					}),
+					title: K(t.name, s),
+					actions: /* @__PURE__ */ B(q, { dashboard: t }, t.id),
+					description: t.description != null && K(t.description, s).length > 0 ? K(t.description, s) : void 0,
+					children: n && !r ? /* @__PURE__ */ B(f, {
+						severity: "warning",
+						size: "compact",
+						className: "max-w-xl",
+						icon: /* @__PURE__ */ B(H, {}),
+						title: a("dashboard_local_missing_title"),
+						description: a("dashboard_local_missing_description")
+					}) : null
+				}), /* @__PURE__ */ B("div", {
+					className: "flex min-h-0 flex-1 flex-col",
+					children: p.isLoading || c == null ? /* @__PURE__ */ B("div", {
+						className: "p-4",
+						children: /* @__PURE__ */ B(o, { className: "h-40 w-full" })
+					}) : /* @__PURE__ */ B(Q, {
+						entrypointUrl: c,
+						stylesheetUrl: l === "cloud" || n ? L(i) : null,
+						configuration: t.configuration,
+						workspaceId: e,
+						dashboardId: i,
+						title: K(t.name, s)
+					})
+				})]
+			});
+		}
+	});
+}
+//#endregion
+export { de as n, $ as t };