@burdenoff/microfe-vibecontrols 2026.624.3 → 2026.625.2

package/dist/pages/AnalyticsPage.js

@@ -17,10 +17,11 @@ import { useI18n as y } from "@burdenoff/fe-libs/shared/providers/shell/I18nProv
 import { Download as b, Printer as x } from "lucide-react";
 import { usePermissions as S } from "@burdenoff/fe-libs/shared/providers/shell";
 import { Fragment as C, jsx as w, jsxs as T } from "react/jsx-runtime";
-import { MotionPage as E } from "@burdenoff/fe-libs/shared/motion";
+import { GlassCard as E } from "@burdenoff/fe-libs/ui";
+import { MotionPage as D } from "@burdenoff/fe-libs/shared/motion";
 //#region src/pages/AnalyticsPage.tsx
-var D = h(() => import("../components/analytics/AnalyticsTimeSeriesChart.js").then((e) => ({ default: e.AnalyticsTimeSeriesChart }))), O = h(() => import("../components/analytics/AnalyticsBreakdownChart.js").then((e) => ({ default: e.AnalyticsBreakdownChart }))), k = () => /* @__PURE__ */ w("div", {
-	className: "bg-bg-surface border border-border-default rounded-lg p-4",
+var O = h(() => import("../components/analytics/AnalyticsTimeSeriesChart.js").then((e) => ({ default: e.AnalyticsTimeSeriesChart }))), k = h(() => import("../components/analytics/AnalyticsBreakdownChart.js").then((e) => ({ default: e.AnalyticsBreakdownChart }))), A = () => /* @__PURE__ */ w("div", {
+	className: "bg-bg-surface border border-border-seam rounded-lg p-4 shadow-[var(--shadow-pop)]",
 	children: /* @__PURE__ */ w(a, { height: "h-40" })
 }), ee = [
 	"overview",
@@ -33,14 +34,14 @@ var D = h(() => import("../components/analytics/AnalyticsTimeSeriesChart.js").th
 	"aievents",
 	"audit",
 	"docs"
-], A = {
+], j = {
 	primary: "var(--color-text-link)",
 	success: "var(--color-status-success-text)",
 	accent: "var(--color-accent-purple)",
 	warning: "var(--color-status-warning-text)"
 };
-function j() {
-	let { workspaceId: a } = t(), { t: h } = y(), j = n(), { hasPermission: I, isLoading: L } = S(), [R, z] = v("LAST_7D"), [B, V] = v("DAY"), [H, U] = o(ee, "overview"), W = g((e, t) => {
+function M() {
+	let { workspaceId: a } = t(), { t: h } = y(), E = n(), { hasPermission: M, isLoading: L } = S(), [R, z] = v("LAST_7D"), [B, V] = v("DAY"), [H, U] = o(ee, "overview"), W = g((e, t) => {
 		let n = h(e);
 		return n === e ? t : n;
 	}, [h]), { startDate: G, endDate: K } = _(() => c(R), [R]), q = _(() => s(H), [H]), { data: J, loading: Y, error: X, refetch: Z } = e({
@@ -60,13 +61,13 @@ function j() {
 		typeof window < "u" && window.print();
 	}, []), ne = g(() => {
 		if (!Q) return;
-		let e = F(H, Q);
+		let e = I(H, Q);
 		if (e.length === 0) return;
-		let t = P(e), n = new Blob([t], { type: "text/csv;charset=utf-8;" }), r = URL.createObjectURL(n), i = document.createElement("a");
+		let t = F(e), n = new Blob([t], { type: "text/csv;charset=utf-8;" }), r = URL.createObjectURL(n), i = document.createElement("a");
 		i.href = r, i.download = `vibecontrols-analytics-${H}-${(/* @__PURE__ */ new Date()).toISOString().slice(0, 10)}.csv`, document.body.appendChild(i), i.click(), document.body.removeChild(i), URL.revokeObjectURL(r);
 	}, [Q, H]), re = g((e) => {
-		j(e);
-	}, [j]);
+		E(e);
+	}, [E]);
 	if (L) return /* @__PURE__ */ w("div", {
 		className: "flex items-center justify-center min-h-[400px]",
 		children: /* @__PURE__ */ w("p", {
@@ -74,7 +75,7 @@ function j() {
 			children: "Loading permissions…"
 		})
 	});
-	if (!I(i.ANALYTICS_READ)) return /* @__PURE__ */ w("div", {
+	if (!M(i.ANALYTICS_READ)) return /* @__PURE__ */ w("div", {
 		className: "flex items-center justify-center min-h-[400px]",
 		children: /* @__PURE__ */ T("div", {
 			className: "text-center space-y-2",
@@ -87,7 +88,7 @@ function j() {
 			})]
 		})
 	});
-	if (!a) return /* @__PURE__ */ T(E, {
+	if (!a) return /* @__PURE__ */ T(D, {
 		className: "min-h-screen space-y-6 bg-bg-canvas px-6 lg:px-8 py-6",
 		children: [/* @__PURE__ */ w(r, { title: W("nav.analytics", "Analytics") }), /* @__PURE__ */ w("div", {
 			className: "text-sm text-text-secondary",
@@ -96,7 +97,7 @@ function j() {
 	});
 	if (X && !Q) {
 		let e = X.message ?? "", t = e.includes("upstream connect error") || e.includes("Connection refused") || e.includes("disconnect/reset before headers") || e.includes("Unexpected response");
-		return /* @__PURE__ */ T(E, {
+		return /* @__PURE__ */ T(D, {
 			className: "min-h-screen space-y-6 bg-bg-canvas px-6 lg:px-8 py-6",
 			children: [/* @__PURE__ */ w(r, { title: W("nav.analytics", "Analytics") }), /* @__PURE__ */ T("div", {
 				className: "space-y-3 rounded-card border border-status-warning-border bg-status-warning-bg-subtle p-4 text-sm text-text-primary",
@@ -115,7 +116,7 @@ function j() {
 			})]
 		});
 	}
-	return /* @__PURE__ */ T(E, {
+	return /* @__PURE__ */ T(D, {
 		className: "min-h-screen space-y-6 bg-bg-canvas px-6 lg:px-8 py-6 vc-printable",
 		children: [
 			/* @__PURE__ */ w(r, { title: W("nav.analytics", "Analytics") }),
@@ -158,7 +159,7 @@ function j() {
 				})]
 			}),
 			/* @__PURE__ */ w(m, {
-				fallback: /* @__PURE__ */ w(k, {}),
+				fallback: /* @__PURE__ */ w(A, {}),
 				children: /* @__PURE__ */ T("section", {
 					id: `analytics-panel-${H}`,
 					role: "tabpanel",
@@ -173,37 +174,37 @@ function j() {
 									loading: Y,
 									onCardClick: re
 								}),
-								/* @__PURE__ */ w(D, {
+								/* @__PURE__ */ w(O, {
 									title: "Activity Over Time",
 									datasets: [
 										{
 											label: "Sessions",
 											data: Q?.sessions?.createdOverTime,
-											color: A.primary
+											color: j.primary
 										},
 										{
 											label: "Executions",
 											data: Q?.actions?.executionsOverTime,
-											color: A.success
+											color: j.success
 										},
 										{
 											label: "AI Events",
 											data: Q?.aiEvents?.eventsOverTime,
-											color: A.accent
+											color: j.accent
 										},
 										{
 											label: "Audit Logs",
 											data: Q?.audit?.eventsOverTime,
-											color: A.warning
+											color: j.warning
 										}
 									]
 								}),
 								/* @__PURE__ */ T("div", {
 									className: "grid grid-cols-1 gap-4 lg:grid-cols-2",
-									children: [/* @__PURE__ */ w(O, {
+									children: [/* @__PURE__ */ w(k, {
 										title: "Sessions by Status",
 										data: Q?.sessions?.byStatus
-									}), /* @__PURE__ */ w(O, {
+									}), /* @__PURE__ */ w(k, {
 										title: "Vibes by Status",
 										data: Q?.vibes?.byStatus
 									})]
@@ -216,33 +217,33 @@ function j() {
 								/* @__PURE__ */ T("div", {
 									className: "grid grid-cols-2 gap-3 sm:grid-cols-4",
 									children: [
-										/* @__PURE__ */ w(M, {
+										/* @__PURE__ */ w(N, {
 											label: "Total",
 											value: Q.agents.total
 										}),
-										/* @__PURE__ */ w(M, {
+										/* @__PURE__ */ w(N, {
 											label: "Active",
 											value: Q.agents.active,
 											variant: "success"
 										}),
-										/* @__PURE__ */ w(M, {
+										/* @__PURE__ */ w(N, {
 											label: "Inactive",
 											value: Q.agents.inactive,
 											variant: "warning"
 										}),
-										/* @__PURE__ */ w(M, {
+										/* @__PURE__ */ w(N, {
 											label: "Stale Heartbeat",
 											value: Q.agents.staleHeartbeatCount,
 											variant: "error"
 										})
 									]
 								}),
-								/* @__PURE__ */ w(D, {
+								/* @__PURE__ */ w(O, {
 									title: "Agents Created Over Time",
 									datasets: [{
 										label: "Agents",
 										data: Q.agents.createdOverTime,
-										color: A.primary
+										color: j.primary
 									}],
 									height: 250
 								}),
@@ -266,20 +267,20 @@ function j() {
 								/* @__PURE__ */ T("div", {
 									className: "grid grid-cols-2 gap-3 sm:grid-cols-4",
 									children: [
-										/* @__PURE__ */ w(M, {
+										/* @__PURE__ */ w(N, {
 											label: "Total",
 											value: Q.sessions.total
 										}),
-										/* @__PURE__ */ w(M, {
+										/* @__PURE__ */ w(N, {
 											label: "Running",
 											value: Q.sessions.active,
 											variant: "success"
 										}),
-										/* @__PURE__ */ w(M, {
+										/* @__PURE__ */ w(N, {
 											label: "Collaborators",
 											value: Q.sessions.totalCollaborators
 										}),
-										/* @__PURE__ */ w(M, {
+										/* @__PURE__ */ w(N, {
 											label: "Shares",
 											value: Q.sessions.totalShares + Q.sessions.totalShareLinks
 										})
@@ -292,22 +293,22 @@ function j() {
 										" ",
 										/* @__PURE__ */ w("span", {
 											className: "font-medium text-text-primary",
-											children: N(Q.sessions.avgDurationMs)
+											children: P(Q.sessions.avgDurationMs)
 										})
 									]
 								}),
-								/* @__PURE__ */ w(D, {
+								/* @__PURE__ */ w(O, {
 									title: "Sessions Created Over Time",
 									datasets: [{
 										label: "Sessions",
 										data: Q.sessions.createdOverTime,
-										color: A.primary
+										color: j.primary
 									}],
 									height: 250
 								}),
 								/* @__PURE__ */ T("div", {
 									className: "grid grid-cols-1 gap-4 lg:grid-cols-2",
-									children: [/* @__PURE__ */ w(O, {
+									children: [/* @__PURE__ */ w(k, {
 										title: "Sessions by Type",
 										data: Q.sessions.byType
 									}), /* @__PURE__ */ w(d, {
@@ -325,36 +326,36 @@ function j() {
 								/* @__PURE__ */ T("div", {
 									className: "grid grid-cols-2 gap-3 sm:grid-cols-4",
 									children: [
-										/* @__PURE__ */ w(M, {
+										/* @__PURE__ */ w(N, {
 											label: "Total",
 											value: Q.vibes.total
 										}),
-										/* @__PURE__ */ w(M, {
+										/* @__PURE__ */ w(N, {
 											label: "With Agent",
 											value: Q.vibes.withAgent,
 											variant: "success"
 										}),
-										/* @__PURE__ */ w(M, {
+										/* @__PURE__ */ w(N, {
 											label: "Without Agent",
 											value: Q.vibes.withoutAgent
 										})
 									]
 								}),
-								/* @__PURE__ */ w(D, {
+								/* @__PURE__ */ w(O, {
 									title: "Vibes Created Over Time",
 									datasets: [{
 										label: "Vibes",
 										data: Q.vibes.createdOverTime,
-										color: A.accent
+										color: j.accent
 									}],
 									height: 250
 								}),
 								/* @__PURE__ */ T("div", {
 									className: "grid grid-cols-1 gap-4 lg:grid-cols-2",
-									children: [/* @__PURE__ */ w(O, {
+									children: [/* @__PURE__ */ w(k, {
 										title: "Vibes by Type",
 										data: Q.vibes.byType
-									}), /* @__PURE__ */ w(O, {
+									}), /* @__PURE__ */ w(k, {
 										title: "Vibes by Status",
 										data: Q.vibes.byStatus
 									})]
@@ -367,40 +368,40 @@ function j() {
 								/* @__PURE__ */ T("div", {
 									className: "grid grid-cols-2 gap-3 sm:grid-cols-4",
 									children: [
-										/* @__PURE__ */ w(M, {
+										/* @__PURE__ */ w(N, {
 											label: "Total Actions",
 											value: Q.actions.total
 										}),
-										/* @__PURE__ */ w(M, {
+										/* @__PURE__ */ w(N, {
 											label: "Executions",
 											value: Q.actions.totalExecutions
 										}),
-										/* @__PURE__ */ w(M, {
+										/* @__PURE__ */ w(N, {
 											label: "Success Rate",
 											value: Q.actions.successRate == null ? "N/A" : `${Q.actions.successRate.toFixed(1)}%`,
 											variant: Q.actions.successRate != null && Q.actions.successRate >= 90 ? "success" : "warning"
 										}),
-										/* @__PURE__ */ w(M, {
+										/* @__PURE__ */ w(N, {
 											label: "Avg Duration",
-											value: Q.actions.avgDurationMs == null ? "N/A" : N(Q.actions.avgDurationMs)
+											value: Q.actions.avgDurationMs == null ? "N/A" : P(Q.actions.avgDurationMs)
 										})
 									]
 								}),
-								/* @__PURE__ */ w(D, {
+								/* @__PURE__ */ w(O, {
 									title: "Executions Over Time",
 									datasets: [{
 										label: "Executions",
 										data: Q.actions.executionsOverTime,
-										color: A.success
+										color: j.success
 									}],
 									height: 250
 								}),
 								/* @__PURE__ */ T("div", {
 									className: "grid grid-cols-1 gap-4 lg:grid-cols-2",
-									children: [/* @__PURE__ */ w(O, {
+									children: [/* @__PURE__ */ w(k, {
 										title: "By Action Type",
 										data: Q.actions.byActionType
-									}), /* @__PURE__ */ w(O, {
+									}), /* @__PURE__ */ w(k, {
 										title: "Execution Status",
 										data: Q.actions.executionsByStatus
 									})]
@@ -423,14 +424,14 @@ function j() {
 							className: "space-y-4",
 							children: [/* @__PURE__ */ T("div", {
 								className: "grid grid-cols-2 gap-3 sm:grid-cols-3",
-								children: [/* @__PURE__ */ w(M, {
+								children: [/* @__PURE__ */ w(N, {
 									label: "Decks",
 									value: Q.vibeDecks.totalDecks
-								}), /* @__PURE__ */ w(M, {
+								}), /* @__PURE__ */ w(N, {
 									label: "Buttons",
 									value: Q.vibeDecks.totalButtons
 								})]
-							}), /* @__PURE__ */ w(O, {
+							}), /* @__PURE__ */ w(k, {
 								title: "Buttons by Action Type",
 								data: Q.vibeDecks.buttonsByActionType
 							})]
@@ -438,22 +439,22 @@ function j() {
 						H === "aievents" && Q?.aiEvents ? /* @__PURE__ */ T("div", {
 							className: "space-y-4",
 							children: [
-								/* @__PURE__ */ w(M, {
+								/* @__PURE__ */ w(N, {
 									label: "Total AI Events",
 									value: Q.aiEvents.total
 								}),
-								/* @__PURE__ */ w(D, {
+								/* @__PURE__ */ w(O, {
 									title: "AI Events Over Time",
 									datasets: [{
 										label: "Events",
 										data: Q.aiEvents.eventsOverTime,
-										color: A.accent
+										color: j.accent
 									}],
 									height: 250
 								}),
 								/* @__PURE__ */ T("div", {
 									className: "grid grid-cols-1 gap-4 lg:grid-cols-2",
-									children: [/* @__PURE__ */ w(O, {
+									children: [/* @__PURE__ */ w(k, {
 										title: "By Source",
 										data: Q.aiEvents.bySource
 									}), /* @__PURE__ */ w(d, {
@@ -467,25 +468,25 @@ function j() {
 						H === "audit" && Q?.audit ? /* @__PURE__ */ T("div", {
 							className: "space-y-4",
 							children: [
-								/* @__PURE__ */ w(M, {
+								/* @__PURE__ */ w(N, {
 									label: "Total Audit Logs",
 									value: Q.audit.total
 								}),
-								/* @__PURE__ */ w(D, {
+								/* @__PURE__ */ w(O, {
 									title: "Audit Events Over Time",
 									datasets: [{
 										label: "Events",
 										data: Q.audit.eventsOverTime,
-										color: A.warning
+										color: j.warning
 									}],
 									height: 250
 								}),
 								/* @__PURE__ */ T("div", {
 									className: "grid grid-cols-1 gap-4 lg:grid-cols-2",
-									children: [/* @__PURE__ */ w(O, {
+									children: [/* @__PURE__ */ w(k, {
 										title: "By Action",
 										data: Q.audit.byAction
-									}), /* @__PURE__ */ w(O, {
+									}), /* @__PURE__ */ w(k, {
 										title: "By Status",
 										data: Q.audit.byStatus
 									})]
@@ -502,19 +503,19 @@ function j() {
 							children: [/* @__PURE__ */ T("div", {
 								className: "grid grid-cols-2 gap-3 sm:grid-cols-4",
 								children: [
-									/* @__PURE__ */ w(M, {
+									/* @__PURE__ */ w(N, {
 										label: "Sites",
 										value: Q.docs.totalSites
 									}),
-									/* @__PURE__ */ w(M, {
+									/* @__PURE__ */ w(N, {
 										label: "Pages",
 										value: Q.docs.totalPages
 									}),
-									/* @__PURE__ */ w(M, {
+									/* @__PURE__ */ w(N, {
 										label: "Revisions",
 										value: Q.docs.totalRevisions
 									}),
-									/* @__PURE__ */ w(M, {
+									/* @__PURE__ */ w(N, {
 										label: "Build Success",
 										value: Q.docs.buildSuccessRate == null ? "N/A" : `${Q.docs.buildSuccessRate.toFixed(1)}%`,
 										variant: Q.docs.buildSuccessRate != null && Q.docs.buildSuccessRate >= 90 ? "success" : "warning"
@@ -522,10 +523,10 @@ function j() {
 								]
 							}), /* @__PURE__ */ T("div", {
 								className: "grid grid-cols-1 gap-4 lg:grid-cols-2",
-								children: [/* @__PURE__ */ w(O, {
+								children: [/* @__PURE__ */ w(k, {
 									title: "Pages by Status",
 									data: Q.docs.pagesByStatus
-								}), /* @__PURE__ */ w(O, {
+								}), /* @__PURE__ */ w(k, {
 									title: "Revisions by Status",
 									data: Q.docs.revisionsByStatus
 								})]
@@ -537,9 +538,10 @@ function j() {
 		]
 	});
 }
-function M({ label: e, value: t, variant: n }) {
-	return /* @__PURE__ */ T("div", {
-		className: `${n === "success" ? "bg-status-success-bg-subtle border-status-success-border" : n === "warning" ? "bg-status-warning-bg-subtle border-status-warning-border" : n === "error" ? "bg-status-error-bg-subtle border-status-error-border" : "bg-bg-surface border-border-subtle"} rounded-card border p-4 shadow-elevation-1`,
+function N({ label: e, value: t, variant: n }) {
+	return /* @__PURE__ */ T(E, {
+		treatment: n ? "plain" : "metric",
+		className: `p-4 ${n ? `border ${n === "success" ? "bg-status-success-bg-subtle border-status-success-border" : n === "warning" ? "bg-status-warning-bg-subtle border-status-warning-border" : n === "error" ? "bg-status-error-bg-subtle border-status-error-border" : ""}` : ""}`,
 		children: [/* @__PURE__ */ w("p", {
 			className: "text-xs text-text-secondary",
 			children: e
@@ -549,16 +551,16 @@ function M({ label: e, value: t, variant: n }) {
 		})]
 	});
 }
-function N(e) {
+function P(e) {
 	return e < 1e3 ? `${Math.round(e)}ms` : e < 6e4 ? `${(e / 1e3).toFixed(1)}s` : `${Math.floor(e / 6e4)}m ${Math.round(e % 6e4 / 1e3)}s`;
 }
-function P(e) {
+function F(e) {
 	return e.map((e) => e.map((e) => {
 		let t = e == null ? "" : String(e);
 		return /[",\n\r]/.test(t) ? `"${t.replace(/"/g, "\"\"")}"` : t;
 	}).join(",")).join("\r\n");
 }
-function F(e, t) {
+function I(e, t) {
 	let n = [];
 	if (e === "overview") return n.push(["metric", "value"]), t.sessions && n.push(["sessions.total", t.sessions.total ?? 0]), t.agents && n.push(["agents.total", t.agents.total ?? 0]), t.vibes && n.push(["vibes.total", t.vibes.total ?? 0]), t.actions && n.push(["actions.total", t.actions.total ?? 0]), n;
 	if (e === "agents" && t.agents) {
@@ -578,6 +580,6 @@ function F(e, t) {
 	return e === "actions" && t.actions ? (n.push(["metric", "value"]), n.push(["total", t.actions.total ?? 0]), n.push(["totalExecutions", t.actions.totalExecutions ?? 0]), n.push(["successRate", t.actions.successRate ?? ""]), n.push(["avgDurationMs", t.actions.avgDurationMs ?? ""]), n) : e === "vibes" && t.vibes ? (n.push(["metric", "value"]), n.push(["total", t.vibes.total ?? 0]), n.push(["withAgent", t.vibes.withAgent ?? 0]), n.push(["withoutAgent", t.vibes.withoutAgent ?? 0]), n) : e === "vibedecks" && t.vibeDecks ? (n.push(["metric", "value"]), n.push(["decks", t.vibeDecks.totalDecks ?? 0]), n.push(["buttons", t.vibeDecks.totalButtons ?? 0]), n) : e === "aievents" && t.aiEvents ? (n.push(["metric", "value"]), n.push(["total", t.aiEvents.total ?? 0]), n) : e === "audit" && t.audit ? (n.push(["metric", "value"]), n.push(["total", t.audit.total ?? 0]), n) : e === "docs" && t.docs ? (n.push(["metric", "value"]), n.push(["sites", t.docs.totalSites ?? 0]), n.push(["pages", t.docs.totalPages ?? 0]), n.push(["revisions", t.docs.totalRevisions ?? 0]), n.push(["buildSuccessRate", t.docs.buildSuccessRate ?? ""]), n) : (n.push(["metric", "value"]), n.push(["note", `No CSV serialiser for ${e} tab yet`]), n);
 }
 //#endregion
-export { j as AnalyticsPage };
+export { M as AnalyticsPage };
 
 //# sourceMappingURL=AnalyticsPage.js.map