@overvis/hmi-workspace-ui 0.1.0 → 0.1.2

package/dist/alarm-list-DKFio0hg.js

@@ -0,0 +1,414 @@
+import { $r as e, Kn as t, Nr as n, Qn as r, _n as i, fn as a, gn as o, ii as s, mn as c, pn as l, vn as u, yn as d, zn as f } from "./quick-report-BcZsfkCZ.js";
+import { f as p, h as m, m as h } from "./i18n-ChjEbYEg.js";
+import { B as g, H as _, K as v, Mt as y, Nt as b, R as x, U as S, V as C, X as w, Y as T, jt as E, xt as D } from "./alert-dialog-D_iDv2lQ.js";
+import { B as O, H as ee, L as te, V as k, l as A } from "./spinner-B-KLtBjp.js";
+import { useState as j } from "react";
+import { jsx as M, jsxs as N } from "react/jsx-runtime";
+import P from "typebox";
+import { BellOffIcon as F, CheckIcon as I, HistoryIcon as L, SirenIcon as R, TriangleAlertIcon as z } from "lucide-react";
+import { formatAppDateTime as B, resolveLocalized as V, schema as H } from "@overvis/hmi-shared";
+import { canWriteParameterValues as U } from "@overvis/hmi-shared/workspace";
+import { ALARM_NOTE_MAX as W, ALARM_RULE_UNAVAILABLE_KEY as G } from "@overvis/hmi-shared/automation";
+import { Link as K } from "@tanstack/react-router";
+// src/workspace/alarms/actions.tsx
+var q = 6e4, J = 60 * q, Y = [
+	15 * q,
+	J,
+	8 * J,
+	24 * J,
+	168 * J
+];
+function ne(e) {
+	return e === 15 * q ? p("alarm_shelve_15m") : e === J ? p("alarm_shelve_1h") : e === 8 * J ? p("alarm_shelve_8h") : e === 24 * J ? p("alarm_shelve_24h") : p("alarm_shelve_7d");
+}
+var re = H(P.Object({ comment: P.String({ maxLength: W }) })), ie = H(P.Object({
+	durationMs: P.Integer({ minimum: q }),
+	reason: P.String({
+		minLength: 1,
+		maxLength: W,
+		pattern: "\\S"
+	})
+}));
+function X() {
+	let e = s.useUtils();
+	return () => {
+		e.alarm.log.invalidate();
+	};
+}
+function ae({ alarm: e, title: n, onClose: i }) {
+	let a = h(), o = s.alarm.acknowledge.useMutation(), c = X(), l = t({
+		defaultValues: { comment: "" },
+		validators: f({
+			schema: re,
+			submit: async (t) => {
+				let n = t.comment.trim();
+				return await o.mutateAsync({
+					id: e.id,
+					...n.length === 0 ? {} : { comment: n }
+				}), c(), null;
+			}
+		}),
+		onSubmitInvalid: r,
+		onSubmit: i
+	});
+	return /* @__PURE__ */ M(x, {
+		open: !0,
+		onOpenChange: (e) => {
+			e || i();
+		},
+		children: /* @__PURE__ */ M(g, { children: /* @__PURE__ */ M(l.AppForm, { children: /* @__PURE__ */ N(l.FormRoot, {
+			layout: "dialog",
+			children: [
+				/* @__PURE__ */ N(S, { children: [/* @__PURE__ */ M(v, { children: a("alarm_acknowledge_title") }), /* @__PURE__ */ M(C, { children: n })] }),
+				/* @__PURE__ */ M(k, { children: /* @__PURE__ */ M(l.AppField, {
+					name: "comment",
+					children: (e) => /* @__PURE__ */ M(e.TextAreaField, {
+						label: a("alarm_acknowledge_comment"),
+						placeholder: a("alarm_acknowledge_comment_placeholder"),
+						maxLength: W,
+						autoFocus: !0
+					})
+				}) }),
+				/* @__PURE__ */ N(_, { children: [/* @__PURE__ */ M(E, {
+					type: "button",
+					variant: "outline",
+					onClick: i,
+					children: a("action_cancel")
+				}), /* @__PURE__ */ M(l.SubmitButton, {
+					label: a("alarm_acknowledge"),
+					pendingLabel: a("alarm_acknowledging")
+				})] })
+			]
+		}) }) })
+	});
+}
+function oe({ alarm: n, title: i, onClose: a }) {
+	let o = h(), c = s.alarm.shelve.useMutation(), l = X(), u = t({
+		defaultValues: {
+			durationMs: J,
+			reason: ""
+		},
+		validators: f({
+			schema: ie,
+			submit: async (e) => (await c.mutateAsync({
+				id: n.id,
+				durationMs: e.durationMs,
+				reason: e.reason.trim()
+			}), l(), null)
+		}),
+		onSubmitInvalid: r,
+		onSubmit: a
+	});
+	return /* @__PURE__ */ M(x, {
+		open: !0,
+		onOpenChange: (e) => {
+			e || a();
+		},
+		children: /* @__PURE__ */ M(g, { children: /* @__PURE__ */ M(u.AppForm, { children: /* @__PURE__ */ N(u.FormRoot, {
+			layout: "dialog",
+			children: [
+				/* @__PURE__ */ N(S, { children: [/* @__PURE__ */ M(v, { children: o("alarm_shelve_title") }), /* @__PURE__ */ M(C, { children: i })] }),
+				/* @__PURE__ */ M("p", {
+					className: "text-sm text-muted-foreground",
+					children: o("alarm_shelve_explanation")
+				}),
+				/* @__PURE__ */ N(k, { children: [/* @__PURE__ */ M(u.Field, {
+					name: "durationMs",
+					children: (t) => /* @__PURE__ */ N(te, { children: [
+						/* @__PURE__ */ M(ee, {
+							id: "alarm-shelve-duration",
+							children: o("alarm_shelve_duration")
+						}),
+						/* @__PURE__ */ M(T, {
+							variant: "outline",
+							size: "sm",
+							spacing: 0,
+							"aria-labelledby": "alarm-shelve-duration",
+							className: "flex-wrap",
+							value: [String(t.state.value)],
+							onValueChange: (e) => {
+								let n = Y.find((t) => String(t) === e[0]);
+								n != null && t.handleChange(n);
+							},
+							children: Y.map((e) => /* @__PURE__ */ M(w, {
+								value: String(e),
+								children: ne(e)
+							}, e))
+						}),
+						/* @__PURE__ */ M(O, { errors: e(t.state.meta.errors, t.name) })
+					] })
+				}), /* @__PURE__ */ M(u.AppField, {
+					name: "reason",
+					children: (e) => /* @__PURE__ */ M(e.TextAreaField, {
+						label: o("alarm_shelve_reason"),
+						placeholder: o("alarm_shelve_reason_placeholder"),
+						maxLength: W,
+						required: !0
+					})
+				})] }),
+				/* @__PURE__ */ N(_, { children: [/* @__PURE__ */ M(E, {
+					type: "button",
+					variant: "outline",
+					onClick: a,
+					children: o("action_cancel")
+				}), /* @__PURE__ */ M(u.SubmitButton, {
+					label: o("alarm_shelve"),
+					pendingLabel: o("alarm_shelving")
+				})] })
+			]
+		}) }) })
+	});
+}
+function se({ alarm: e, title: n, onClose: i }) {
+	let a = h(), o = s.alarm.unshelve.useMutation(), c = X(), l = t({
+		defaultValues: {},
+		validators: f({ submit: async () => (await o.mutateAsync({ id: e.id }), c(), null) }),
+		onSubmitInvalid: r,
+		onSubmit: i
+	});
+	return /* @__PURE__ */ M(x, {
+		open: !0,
+		onOpenChange: (e) => {
+			e || i();
+		},
+		children: /* @__PURE__ */ M(g, { children: /* @__PURE__ */ M(l.AppForm, { children: /* @__PURE__ */ N(l.FormRoot, {
+			layout: "dialog",
+			children: [
+				/* @__PURE__ */ N(S, { children: [/* @__PURE__ */ M(v, { children: a("alarm_unshelve_title") }), /* @__PURE__ */ M(C, { children: n })] }),
+				/* @__PURE__ */ M("p", {
+					className: "text-sm text-muted-foreground",
+					children: a("alarm_unshelve_explanation")
+				}),
+				/* @__PURE__ */ N(_, { children: [/* @__PURE__ */ M(E, {
+					type: "button",
+					variant: "outline",
+					onClick: i,
+					children: a("action_cancel")
+				}), /* @__PURE__ */ M(l.SubmitButton, {
+					label: a("alarm_unshelve"),
+					pendingLabel: a("alarm_unshelving")
+				})] })
+			]
+		}) }) })
+	});
+}
+// src/workspace/alarms/alarm-list.tsx
+function ce(e) {
+	return e.source.kind === "alarm_rule" && e.key === G;
+}
+function Z(e, t) {
+	let n = t.title.length > 0 ? t.title : p("alarm_untitled");
+	return ce(e) ? {
+		title: p("alarm_unavailable_title", { name: n }),
+		body: p("alarm_unavailable_body")
+	} : {
+		title: n,
+		body: t.body
+	};
+}
+function Q({ severity: e }) {
+	let t = h();
+	return e === "urgent" ? /* @__PURE__ */ N(A, {
+		variant: "destructive",
+		children: [/* @__PURE__ */ M(R, { "data-icon": "inline-start" }), t("automation_severity_urgent")]
+	}) : e === "warning" ? /* @__PURE__ */ N(A, {
+		variant: "warning",
+		children: [/* @__PURE__ */ M(z, { "data-icon": "inline-start" }), t("automation_severity_warning")]
+	}) : /* @__PURE__ */ M(A, {
+		variant: "outline",
+		children: t("automation_severity_info")
+	});
+}
+function $(e, t) {
+	let n = m(), r = s.alarmRule.list.useQuery({ workspaceId: e }, { enabled: t }), i = s.automation.list.useQuery({ workspaceId: e }, { enabled: t }), a = /* @__PURE__ */ new Map();
+	for (let e of r.data?.items ?? []) a.set(e.id, V(e.name, n));
+	for (let e of i.data?.items ?? []) a.set(e.id, V(e.name, n));
+	return {
+		names: a,
+		rules: r.data?.items ?? [],
+		automations: i.data?.items ?? [],
+		name: (e) => a.get(c(e)) ?? null
+	};
+}
+function le({ alarm: e, workspaceId: t, now: r, canOperate: a, sourceName: o, showHistoryLink: s, compact: c, onOpen: d }) {
+	let f = h(), p = m(), g = n()?.timezone ?? "UTC", { title: _, body: v } = Z(e, l(e.message, p, g)), x = u(e, r), S = i(e, r), C = [];
+	C.push(/* @__PURE__ */ M("span", { children: e.clearedAt == null ? f("alarm_state_active") : f("alarm_state_cleared", { time: B(e.clearedAt) }) }, "state")), e.acknowledgedAt != null && C.push(/* @__PURE__ */ M("span", { children: e.acknowledgedByName == null ? f("alarm_state_acknowledged", { time: B(e.acknowledgedAt) }) : f("alarm_state_acknowledged_by", {
+		name: e.acknowledgedByName,
+		time: B(e.acknowledgedAt)
+	}) }, "acknowledged")), S && e.shelvedUntil != null && C.push(/* @__PURE__ */ M("span", { children: e.shelvedByName == null ? f("alarm_state_shelved", { time: B(e.shelvedUntil) }) : f("alarm_state_shelved_by", {
+		name: e.shelvedByName,
+		time: B(e.shelvedUntil)
+	}) }, "shelved"));
+	let w = [e.acknowledgedAt != null && e.acknowledgeComment != null ? {
+		key: "comment",
+		label: f("alarm_acknowledge_comment"),
+		text: e.acknowledgeComment
+	} : null, S && e.shelveReason != null ? {
+		key: "reason",
+		label: f("alarm_shelve_reason"),
+		text: e.shelveReason
+	} : null].filter((e) => e != null);
+	return /* @__PURE__ */ N("li", {
+		className: b("flex flex-col gap-2 rounded-lg border bg-card p-3", x ? e.severity === "urgent" ? "border-destructive/40" : e.severity === "warning" ? "border-warning/50" : void 0 : "bg-muted/30"),
+		children: [
+			/* @__PURE__ */ N("div", {
+				className: "flex flex-wrap items-start gap-x-2 gap-y-1",
+				children: [
+					/* @__PURE__ */ M(Q, { severity: e.severity }),
+					x ? /* @__PURE__ */ M(A, {
+						variant: "secondary",
+						children: f("alarm_needs_acknowledgement")
+					}) : null,
+					S ? /* @__PURE__ */ N(A, {
+						variant: "outline",
+						children: [/* @__PURE__ */ M(F, { "data-icon": "inline-start" }), f("alarm_shelved")]
+					}) : null
+				]
+			}),
+			/* @__PURE__ */ N("div", {
+				className: "flex min-w-0 flex-col gap-1",
+				children: [
+					/* @__PURE__ */ M("p", {
+						className: b("font-medium wrap-break-word", x ? "text-foreground" : "text-muted-foreground"),
+						children: _
+					}),
+					v.length > 0 && !c ? /* @__PURE__ */ M("p", {
+						className: "text-sm wrap-break-word whitespace-pre-line text-muted-foreground",
+						children: v
+					}) : null,
+					/* @__PURE__ */ N("p", {
+						className: "text-xs text-muted-foreground",
+						children: [f("alarm_raised_at", { time: B(e.raisedAt) }), o == null ? null : ` · ${o}`]
+					}),
+					/* @__PURE__ */ M("p", {
+						className: "flex flex-wrap gap-x-3 gap-y-0.5 text-xs text-muted-foreground",
+						children: C
+					}),
+					w.map((e) => /* @__PURE__ */ N("p", {
+						className: "text-xs wrap-break-word text-muted-foreground",
+						children: [
+							/* @__PURE__ */ N("span", {
+								className: "font-medium",
+								children: [e.label, ":"]
+							}),
+							" ",
+							e.text
+						]
+					}, e.key))
+				]
+			}),
+			a || s ? /* @__PURE__ */ N("div", {
+				className: "flex flex-wrap gap-2",
+				children: [
+					a && e.acknowledgedAt == null ? /* @__PURE__ */ N(E, {
+						size: "sm",
+						onClick: () => {
+							d({
+								kind: "acknowledge",
+								alarm: e,
+								title: _
+							});
+						},
+						children: [/* @__PURE__ */ M(I, { "data-icon": "inline-start" }), f("alarm_acknowledge")]
+					}) : null,
+					a && !S ? /* @__PURE__ */ N(E, {
+						size: "sm",
+						variant: "outline",
+						onClick: () => {
+							d({
+								kind: "shelve",
+								alarm: e,
+								title: _
+							});
+						},
+						children: [/* @__PURE__ */ M(F, { "data-icon": "inline-start" }), f("alarm_shelve")]
+					}) : null,
+					a && S ? /* @__PURE__ */ M(E, {
+						size: "sm",
+						variant: "outline",
+						onClick: () => {
+							d({
+								kind: "unshelve",
+								alarm: e,
+								title: _
+							});
+						},
+						children: f("alarm_unshelve")
+					}) : null,
+					s ? /* @__PURE__ */ N(K, {
+						to: "/workspace/$workspaceId/alarms",
+						params: { workspaceId: t },
+						search: {
+							tab: "history",
+							alarm: e.id
+						},
+						className: y({
+							variant: "ghost",
+							size: "sm"
+						}),
+						children: [/* @__PURE__ */ M(L, { "data-icon": "inline-start" }), f("alarm_history_of_alarm")]
+					}) : null
+				]
+			}) : null
+		]
+	});
+}
+function ue({ workspaceId: e, sourceIds: t, keyPrefix: r, parameterIds: i, compact: s = !1, empty: c, className: l }) {
+	let u = h(), f = n(), p = e ?? f?.id;
+	if (p == null) throw Error("AlarmList needs a workspaceId outside a workspace");
+	let m = f?.id === p ? f.access : null, g = m != null && U(m), { alarms: _, failed: v, now: y } = a(p), x = $(p, !s), [S, C] = j(null), w = () => {
+		C(null);
+	};
+	if (_ == null) return v ? /* @__PURE__ */ M("p", {
+		role: "alert",
+		className: b("text-sm text-destructive", l),
+		children: u("alarm_feed_failed")
+	}) : /* @__PURE__ */ N("div", {
+		className: b("flex flex-col gap-2", l),
+		"aria-busy": !0,
+		children: [/* @__PURE__ */ M(D, { className: "h-20 w-full" }), /* @__PURE__ */ M(D, { className: "h-20 w-full" })]
+	});
+	let T = d(o(_, {
+		...t == null ? {} : { sourceIds: t },
+		...r == null ? {} : { keyPrefix: r },
+		...i == null ? {} : { parameterIds: i }
+	}), y);
+	return /* @__PURE__ */ N("div", {
+		className: b("flex flex-col gap-2", l),
+		children: [
+			T.length === 0 ? c ?? /* @__PURE__ */ M("p", {
+				className: "rounded-lg border py-8 text-center text-sm text-muted-foreground",
+				children: u("alarm_none_active")
+			}) : /* @__PURE__ */ M("ul", {
+				"aria-label": u("alarm_active_title"),
+				className: "flex flex-col gap-2",
+				children: T.map((e) => /* @__PURE__ */ M(le, {
+					alarm: e,
+					workspaceId: p,
+					now: y,
+					canOperate: g,
+					sourceName: s ? null : x.name(e.source),
+					showHistoryLink: f?.id === p,
+					compact: s,
+					onOpen: C
+				}, e.id))
+			}),
+			S?.kind === "acknowledge" ? /* @__PURE__ */ M(ae, {
+				alarm: S.alarm,
+				title: S.title,
+				onClose: w
+			}) : null,
+			S?.kind === "shelve" ? /* @__PURE__ */ M(oe, {
+				alarm: S.alarm,
+				title: S.title,
+				onClose: w
+			}) : null,
+			S?.kind === "unshelve" ? /* @__PURE__ */ M(se, {
+				alarm: S.alarm,
+				title: S.title,
+				onClose: w
+			}) : null
+		]
+	});
+}
+export { $ as i, Q as n, Z as r, ue as t };