@burdenoff/microfe-assethandler 2026.826.13 → 2026.826.14

package/dist/assethandler/pages/CmdbBrowserPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CmdbBrowserPage.d.ts","sourceRoot":"","sources":["../../../src/assethandler/pages/CmdbBrowserPage.tsx"],"names":[],"mappings":"AAycA,wBAAgB,eAAe,gCAwU9B"}
+{"version":3,"file":"CmdbBrowserPage.d.ts","sourceRoot":"","sources":["../../../src/assethandler/pages/CmdbBrowserPage.tsx"],"names":[],"mappings":"AAudA,wBAAgB,eAAe,gCAkW9B"}

package/dist/assethandler/pages/CmdbBrowserPage.js

@@ -7,13 +7,13 @@ import { StatTile as a } from "../components/StatTile.js";
 import { ChartCard as o } from "../components/ChartCard.js";
 import "../components/index.js";
 import { useMemo as s, useState as c, useSyncExternalStore as l } from "react";
-import { AppWindow as u, ChevronDown as d, ChevronRight as f, Cog as p, Database as m, HardDrive as h, Network as g, Pencil as _, Plus as ee, Search as v, Server as y, Trash2 as te, X as b } from "lucide-react";
-import { gql as x } from "@apollo/client";
-import { useMutation as S, useQuery as C } from "@apollo/client/react";
+import { AppWindow as u, ChevronDown as d, ChevronRight as f, Cog as p, Database as m, HardDrive as h, Network as g, Pencil as _, Plus as ee, Search as v, Server as y, Trash2 as b, X as x } from "lucide-react";
+import { gql as S } from "@apollo/client";
+import { useMutation as te, useQuery as C } from "@apollo/client/react";
 import { jsx as w, jsxs as T } from "react/jsx-runtime";
-import { Button as E, GlassCard as D, GradientText as O, IllustratedEmptyState as ne, Input as k, Label as A, PagePurpose as j, ResponsiveDialog as re, ResponsiveDialogContent as ie, ResponsiveDialogDescription as M, ResponsiveDialogFooter as ae, ResponsiveDialogHeader as N, ResponsiveDialogTitle as P, Select as F, SelectContent as I, SelectItem as L, SelectTrigger as R, SelectValue as z } from "@burdenoff/fe-libs/ui";
+import { Button as E, GlassCard as D, GradientText as O, IllustratedEmptyState as ne, Input as k, Label as A, PagePurpose as j, ResponsiveDialog as re, ResponsiveDialogContent as ie, ResponsiveDialogDescription as M, ResponsiveDialogFooter as N, ResponsiveDialogHeader as P, ResponsiveDialogTitle as ae, Select as F, SelectContent as I, SelectItem as L, SelectTrigger as R, SelectValue as z } from "@burdenoff/fe-libs/ui";
 //#region src/assethandler/pages/CmdbBrowserPage.tsx
-var oe = x`
+var oe = S`
   query AssetHandlerConfigurationItems {
     configurationItems {
       id
@@ -27,13 +27,17 @@ var oe = x`
       updatedAt
     }
   }
-`, B = x`
+`, B = S`
   mutation AssetHandlerUpsertConfigurationItem($input: UpsertConfigurationItemInput!) {
     upsertConfigurationItem(input: $input) {
       id
       ciNumber
     }
   }
+`, se = S`
+  mutation AssetHandlerDeleteConfigurationItem($id: ID!) {
+    deleteConfigurationItem(id: $id)
+  }
 `, V = [
 	"SERVER",
 	"SERVICE",
@@ -86,7 +90,7 @@ function K({ status: e }) {
 		children: n.label
 	});
 }
-function se() {
+function ce() {
 	return l((e) => {
 		if (typeof window > "u" || typeof window.matchMedia != "function") return () => {};
 		let t = window.matchMedia("(min-width: 1024px)");
@@ -99,10 +103,10 @@ function q(e) {
 		value: typeof t == "string" ? t : JSON.stringify(t)
 	})) : [];
 }
-function ce({ open: e, onOpenChange: t, seed: r, onSaved: i }) {
-	let a = !!r, [o, s] = c(""), [l, u] = c(""), [d, f] = c("SERVER"), [p, m] = c("ACTIVE"), [h, g] = c("PRODUCTION"), [_, v] = c(""), [y, b] = c([]), [x, C] = c(null);
-	e && x !== (r?.id ?? "__new__") && (C(r?.id ?? "__new__"), s(r?.ciNumber ?? ""), u(r?.name ?? ""), f(r?.ciType ?? "SERVER"), m(r?.status ?? "ACTIVE"), g(r?.environment ?? "PRODUCTION"), v(r?.owner ?? ""), b(q(r?.attributes))), !e && x !== null && C(null);
-	let [D, { loading: O }] = S(B, {
+function le({ open: e, onOpenChange: t, seed: r, onSaved: i }) {
+	let a = !!r, [o, s] = c(""), [l, u] = c(""), [d, f] = c("SERVER"), [p, m] = c("ACTIVE"), [h, g] = c("PRODUCTION"), [_, v] = c(""), [y, x] = c([]), [S, C] = c(null);
+	e && S !== (r?.id ?? "__new__") && (C(r?.id ?? "__new__"), s(r?.ciNumber ?? ""), u(r?.name ?? ""), f(r?.ciType ?? "SERVER"), m(r?.status ?? "ACTIVE"), g(r?.environment ?? "PRODUCTION"), v(r?.owner ?? ""), x(q(r?.attributes))), !e && S !== null && C(null);
+	let [D, { loading: O }] = te(B, {
 		onCompleted: (e) => {
 			n.success(a ? "Configuration item updated" : "Configuration item saved", `${e.upsertConfigurationItem.ciNumber} is now in the CMDB.`), t(!1), i();
 		},
@@ -123,7 +127,7 @@ function ce({ open: e, onOpenChange: t, seed: r, onSaved: i }) {
 			owner: _.trim() || null,
 			attributes: e
 		} } });
-	}, j = (e, t) => b((n) => n.map((n, r) => r === e ? {
+	}, j = (e, t) => x((n) => n.map((n, r) => r === e ? {
 		...n,
 		...t
 	} : n));
@@ -133,7 +137,7 @@ function ce({ open: e, onOpenChange: t, seed: r, onSaved: i }) {
 		children: /* @__PURE__ */ T(ie, {
 			className: "max-h-[85vh] overflow-y-auto sm:max-w-2xl",
 			children: [
-				/* @__PURE__ */ T(N, { children: [/* @__PURE__ */ w(P, { children: a ? "Edit CI" : "Add CI" }), /* @__PURE__ */ w(M, { children: "Register a configuration item in the CMDB and map it to your estate." })] }),
+				/* @__PURE__ */ T(P, { children: [/* @__PURE__ */ w(ae, { children: a ? "Edit CI" : "Add CI" }), /* @__PURE__ */ w(M, { children: "Register a configuration item in the CMDB and map it to your estate." })] }),
 				/* @__PURE__ */ T("div", {
 					className: "space-y-4",
 					children: [
@@ -208,7 +212,7 @@ function ce({ open: e, onOpenChange: t, seed: r, onSaved: i }) {
 									type: "button",
 									variant: "outline",
 									size: "sm",
-									onClick: () => b((e) => [...e, {
+									onClick: () => x((e) => [...e, {
 										key: "",
 										value: ""
 									}]),
@@ -238,9 +242,9 @@ function ce({ open: e, onOpenChange: t, seed: r, onSaved: i }) {
 											type: "button",
 											variant: "ghost",
 											size: "icon",
-											onClick: () => b((e) => e.filter((e, n) => n !== t)),
+											onClick: () => x((e) => e.filter((e, n) => n !== t)),
 											"aria-label": "Remove attribute",
-											children: /* @__PURE__ */ w(te, { className: "h-4 w-4" })
+											children: /* @__PURE__ */ w(b, { className: "h-4 w-4" })
 										})
 									]
 								}, t))
@@ -248,7 +252,7 @@ function ce({ open: e, onOpenChange: t, seed: r, onSaved: i }) {
 						})
 					]
 				}),
-				/* @__PURE__ */ T(ae, { children: [/* @__PURE__ */ w(E, {
+				/* @__PURE__ */ T(N, { children: [/* @__PURE__ */ w(E, {
 					variant: "outline",
 					onClick: () => t(!1),
 					disabled: O,
@@ -274,8 +278,8 @@ function J({ label: e, value: t }) {
 		})]
 	});
 }
-function le({ ci: e, onEdit: t, onClose: n }) {
-	let r = q(e.attributes);
+function ue({ ci: e, onEdit: t, onDelete: n, deleting: r, onClose: i }) {
+	let a = q(e.attributes);
 	return /* @__PURE__ */ T("div", {
 		className: "space-y-4",
 		children: [
@@ -298,18 +302,28 @@ function le({ ci: e, onEdit: t, onClose: n }) {
 					})]
 				}), /* @__PURE__ */ T("div", {
 					className: "flex items-center gap-1",
-					children: [/* @__PURE__ */ T(E, {
-						variant: "outline",
-						size: "sm",
-						onClick: t,
-						children: [/* @__PURE__ */ w(_, { className: "mr-1 h-3.5 w-3.5" }), "Edit"]
-					}), n ? /* @__PURE__ */ w(E, {
-						variant: "ghost",
-						size: "icon",
-						onClick: n,
-						"aria-label": "Close detail",
-						children: /* @__PURE__ */ w(b, { className: "h-4 w-4" })
-					}) : null]
+					children: [
+						/* @__PURE__ */ T(E, {
+							variant: "outline",
+							size: "sm",
+							onClick: t,
+							children: [/* @__PURE__ */ w(_, { className: "mr-1 h-3.5 w-3.5" }), "Edit"]
+						}),
+						/* @__PURE__ */ T(E, {
+							variant: "outline",
+							size: "sm",
+							onClick: n,
+							disabled: r,
+							children: [/* @__PURE__ */ w(b, { className: "mr-1 h-3.5 w-3.5" }), r ? "Deleting…" : "Delete"]
+						}),
+						i ? /* @__PURE__ */ w(E, {
+							variant: "ghost",
+							size: "icon",
+							onClick: i,
+							"aria-label": "Close detail",
+							children: /* @__PURE__ */ w(x, { className: "h-4 w-4" })
+						}) : null
+					]
 				})]
 			}),
 			/* @__PURE__ */ T("div", {
@@ -344,12 +358,12 @@ function le({ ci: e, onEdit: t, onClose: n }) {
 			/* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w("h4", {
 				className: "mb-2 text-xs font-semibold uppercase tracking-wide text-text-secondary",
 				children: "Attributes"
-			}), r.length === 0 ? /* @__PURE__ */ w("p", {
+			}), a.length === 0 ? /* @__PURE__ */ w("p", {
 				className: "text-sm text-text-secondary",
 				children: "No attributes recorded for this CI."
 			}) : /* @__PURE__ */ w("div", {
 				className: "divide-y divide-border-seam/60 rounded-lg bg-bg-sunken/40",
-				children: r.map((e) => /* @__PURE__ */ T("div", {
+				children: a.map((e) => /* @__PURE__ */ T("div", {
 					className: "flex items-start justify-between gap-3 px-3 py-2",
 					children: [/* @__PURE__ */ w("span", {
 						className: "text-sm text-text-secondary",
@@ -363,10 +377,15 @@ function le({ ci: e, onEdit: t, onClose: n }) {
 		]
 	});
 }
-function Y() {
-	let [n, l] = c(!1), [u, m] = c(null), [_, te] = c(null), [b, x] = c(!1), [S, A] = c(""), [M, ae] = c("ALL"), [B, V] = c("ALL"), [q, J] = c({}), Y = se(), { data: ue, loading: de, refetch: fe } = C(oe, { fetchPolicy: "cache-and-network" }), X = s(() => ue?.configurationItems ?? [], [ue?.configurationItems]), Z = s(() => {
-		let e = S.trim().toLowerCase();
-		return X.filter((t) => M !== "ALL" && t.status !== M || B !== "ALL" && t.environment !== B ? !1 : e ? [
+function de() {
+	let [l, u] = c(!1), [m, _] = c(null), [b, x] = c(null), [S, A] = c(!1), [M, N] = c(""), [B, V] = c("ALL"), [q, J] = c("ALL"), [de, fe] = c({}), pe = ce(), { data: Y, loading: me, refetch: he } = C(oe, { fetchPolicy: "cache-and-network" }), [ge, { loading: _e }] = te(se, {
+		onCompleted: () => {
+			n.success("Configuration item deleted"), x(null), A(!1), he();
+		},
+		onError: (e) => n.error("Could not delete configuration item", e.message)
+	}), X = s(() => Y?.configurationItems ?? [], [Y?.configurationItems]), Z = s(() => {
+		let e = M.trim().toLowerCase();
+		return X.filter((t) => B !== "ALL" && t.status !== B || q !== "ALL" && t.environment !== q ? !1 : e ? [
 			t.ciNumber,
 			t.name,
 			t.ciType,
@@ -374,10 +393,10 @@ function Y() {
 		].join(" ").toLowerCase().includes(e) : !0);
 	}, [
 		X,
-		S,
 		M,
-		B
-	]), pe = s(() => {
+		B,
+		q
+	]), ve = s(() => {
 		let e = /* @__PURE__ */ new Map();
 		for (let t of Z) {
 			let n = t.ciType || "OTHER", r = e.get(n);
@@ -392,25 +411,27 @@ function Y() {
 			maintenance: n,
 			retired: r
 		};
-	}, [X]), me = s(() => {
+	}, [X]), ye = s(() => {
 		let t = X.reduce((e, t) => (e[t.status] = (e[t.status] ?? 0) + 1, e), {});
 		return Object.entries(t).map(([t, n], r) => ({
 			name: G[t]?.label ?? t,
 			value: n,
 			color: e(r)
 		}));
-	}, [X]), he = s(() => {
+	}, [X]), be = s(() => {
 		let e = X.reduce((e, t) => (e[t.ciType] = (e[t.ciType] ?? 0) + 1, e), {});
 		return Object.entries(e).sort((e, t) => t[1] - e[1]).map(([e, t]) => ({
 			name: e,
 			count: t
 		}));
-	}, [X]), $ = s(() => X.find((e) => e.id === _) ?? null, [X, _]), ge = (e) => {
-		te(e.id), Y || x(!0);
-	}, _e = () => {
-		m(null), l(!0);
-	}, ve = (e) => {
-		m(e), l(!0), x(!1);
+	}, [X]), $ = s(() => X.find((e) => e.id === b) ?? null, [X, b]), xe = (e) => {
+		x(e.id), pe || A(!0);
+	}, Se = () => {
+		_(null), u(!0);
+	}, Ce = (e) => {
+		_(e), u(!0), A(!1);
+	}, we = (e) => {
+		window.confirm(`Delete ${e.ciNumber} — ${e.name}?`) && ge({ variables: { id: e.id } });
 	};
 	return /* @__PURE__ */ T("div", {
 		className: "space-y-5 p-4 sm:p-6",
@@ -427,21 +448,21 @@ function Y() {
 							children: "CMDB — Configuration Items"
 						}), /* @__PURE__ */ w("p", {
 							className: "mt-1 max-w-2xl text-sm text-text-secondary",
-							children: "A living map of every configuration item and its attributes."
+							children: "A searchable catalog of configuration items and their attributes."
 						})]
 					})]
 				}), /* @__PURE__ */ T(E, {
 					className: "w-full sm:w-auto",
-					onClick: _e,
+					onClick: Se,
 					children: [/* @__PURE__ */ w(ee, { className: "mr-2 h-4 w-4" }), "Add CI"]
 				})]
 			}),
-			/* @__PURE__ */ w(j, { children: "Your configuration management database (CMDB): servers, services, network gear and how they relate. Browse, search and inspect each configuration item to understand blast radius before a change and keep asset relationships accurate." }),
-			/* @__PURE__ */ w(ce, {
-				open: n,
-				onOpenChange: l,
-				seed: u,
-				onSaved: () => void fe()
+			/* @__PURE__ */ w(j, { children: "Your configuration-item catalog: record servers, services, network gear, status, ownership, environment and structured attributes. Dependency relationships and blast-radius analysis are not shipped yet." }),
+			/* @__PURE__ */ w(le, {
+				open: l,
+				onOpenChange: u,
+				seed: m,
+				onSaved: () => void he()
 			}),
 			/* @__PURE__ */ T("div", {
 				className: "grid gap-4 sm:grid-cols-2 lg:grid-cols-4",
@@ -478,7 +499,7 @@ function Y() {
 					title: "Status mix",
 					subtitle: "Configuration items by status",
 					children: /* @__PURE__ */ w(i, {
-						data: me,
+						data: ye,
 						height: 220,
 						centerLabel: "CIs",
 						centerValue: Q.total,
@@ -488,7 +509,7 @@ function Y() {
 					title: "By type",
 					subtitle: "Configuration items per type",
 					children: /* @__PURE__ */ w(r, {
-						data: he,
+						data: be,
 						xKey: "name",
 						series: [{
 							key: "count",
@@ -513,15 +534,15 @@ function Y() {
 							children: [/* @__PURE__ */ w(v, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-text-secondary" }), /* @__PURE__ */ w(k, {
 								className: "pl-9",
 								placeholder: "Search CIs by number, name, type or owner…",
-								value: S,
-								onChange: (e) => A(e.target.value),
+								value: M,
+								onChange: (e) => N(e.target.value),
 								"aria-label": "Search configuration items"
 							})]
 						}), /* @__PURE__ */ T("div", {
 							className: "grid gap-2 sm:grid-cols-2",
 							children: [/* @__PURE__ */ T(F, {
-								value: M,
-								onValueChange: ae,
+								value: B,
+								onValueChange: V,
 								children: [/* @__PURE__ */ w(R, { children: /* @__PURE__ */ w(z, { placeholder: "Status" }) }), /* @__PURE__ */ T(I, { children: [/* @__PURE__ */ w(L, {
 									value: "ALL",
 									children: "All statuses"
@@ -530,8 +551,8 @@ function Y() {
 									children: e
 								}, e))] })]
 							}), /* @__PURE__ */ T(F, {
-								value: B,
-								onValueChange: V,
+								value: q,
+								onValueChange: J,
 								children: [/* @__PURE__ */ w(R, { children: /* @__PURE__ */ w(z, { placeholder: "Environment" }) }), /* @__PURE__ */ T(I, { children: [/* @__PURE__ */ w(L, {
 									value: "ALL",
 									children: "All environments"
@@ -544,22 +565,22 @@ function Y() {
 					}), /* @__PURE__ */ T("div", {
 						className: "border-t border-border-seam",
 						children: [
-							de && X.length === 0 ? /* @__PURE__ */ w("div", {
+							me && X.length === 0 ? /* @__PURE__ */ w("div", {
 								className: "space-y-2 p-4",
 								children: Array.from({ length: 5 }).map((e, t) => /* @__PURE__ */ w("div", { className: "h-9 rounded-md bg-bg-sunken motion-safe:animate-vc-shimmer" }, t))
 							}) : null,
-							!de && Z.length === 0 ? /* @__PURE__ */ w(ne, {
-								illustration: S || M !== "ALL" || B !== "ALL" ? "empty-search" : "empty-data",
-								title: S || M !== "ALL" || B !== "ALL" ? "No configuration items match" : "No configuration items found",
-								description: S || M !== "ALL" || B !== "ALL" ? "Try a different search or filter." : "Add a configuration item to start mapping your estate."
+							!me && Z.length === 0 ? /* @__PURE__ */ w(ne, {
+								illustration: M || B !== "ALL" || q !== "ALL" ? "empty-search" : "empty-data",
+								title: M || B !== "ALL" || q !== "ALL" ? "No configuration items match" : "No configuration items found",
+								description: M || B !== "ALL" || q !== "ALL" ? "Try a different search or filter." : "Add a configuration item to start mapping your estate."
 							}) : null,
 							/* @__PURE__ */ w("div", {
 								className: "max-h-[540px] overflow-y-auto",
-								children: pe.map(([e, n]) => {
-									let r = W[e] ?? p, i = q[e];
+								children: ve.map(([e, n]) => {
+									let r = W[e] ?? p, i = de[e];
 									return /* @__PURE__ */ T("div", { children: [/* @__PURE__ */ T("button", {
 										type: "button",
-										onClick: () => J((t) => ({
+										onClick: () => fe((t) => ({
 											...t,
 											[e]: !t[e]
 										})),
@@ -578,9 +599,9 @@ function Y() {
 										]
 									}), i ? null : n.map((e) => /* @__PURE__ */ T("button", {
 										type: "button",
-										onClick: () => ge(e),
-										"aria-current": _ === e.id,
-										className: t("flex w-full items-center gap-3 border-b border-border-seam/40 px-4 py-2.5 pl-10 text-left last:border-b-0", _ === e.id ? "bg-action-primary-bg/10" : "hover:bg-bg-sunken/40"),
+										onClick: () => xe(e),
+										"aria-current": b === e.id,
+										className: t("flex w-full items-center gap-3 border-b border-border-seam/40 px-4 py-2.5 pl-10 text-left last:border-b-0", b === e.id ? "bg-action-primary-bg/10" : "hover:bg-bg-sunken/40"),
 										children: [/* @__PURE__ */ T("div", {
 											className: "min-w-0 flex-1",
 											children: [/* @__PURE__ */ w("p", {
@@ -603,9 +624,11 @@ function Y() {
 						className: "sticky top-4 border-border-seam",
 						children: /* @__PURE__ */ w("div", {
 							className: "p-4",
-							children: $ ? /* @__PURE__ */ w(le, {
+							children: $ ? /* @__PURE__ */ w(ue, {
 								ci: $,
-								onEdit: () => ve($)
+								onEdit: () => Ce($),
+								onDelete: () => we($),
+								deleting: _e
 							}) : /* @__PURE__ */ T("div", {
 								className: "flex flex-col items-center justify-center gap-2 py-12 text-center",
 								children: [
@@ -625,13 +648,15 @@ function Y() {
 				})]
 			}),
 			/* @__PURE__ */ w(re, {
-				open: b && !Y,
-				onOpenChange: x,
+				open: S && !pe,
+				onOpenChange: A,
 				children: /* @__PURE__ */ T(ie, {
 					className: "max-h-[85vh] overflow-y-auto",
-					children: [/* @__PURE__ */ w(N, { children: /* @__PURE__ */ w(P, { children: "Configuration item" }) }), $ ? /* @__PURE__ */ w(le, {
+					children: [/* @__PURE__ */ w(P, { children: /* @__PURE__ */ w(ae, { children: "Configuration item" }) }), $ ? /* @__PURE__ */ w(ue, {
 						ci: $,
-						onEdit: () => ve($)
+						onEdit: () => Ce($),
+						onDelete: () => we($),
+						deleting: _e
 					}) : null]
 				})
 			})
@@ -639,6 +664,6 @@ function Y() {
 	});
 }
 //#endregion
-export { Y as CmdbBrowserPage };
+export { de as CmdbBrowserPage };
 
 //# sourceMappingURL=CmdbBrowserPage.js.map