@burdenoff/microfe-technospam 2026.801.1 → 2026.827.1

package/dist/technospam/pages/AnalyticsAnalyticsPagePage.js

@@ -20,9 +20,9 @@ import { BarChart as fe } from "../../node_modules/recharts/es6/chart/BarChart.j
 import { PieChart as pe } from "../../node_modules/recharts/es6/chart/PieChart.js";
 import { AreaChart as me } from "../../node_modules/recharts/es6/chart/AreaChart.js";
 import { useMemo as h, useState as g } from "react";
-import { Activity as _, Award as he, BarChart3 as ge, BookOpen as v, CalendarRange as y, Code2 as b, GraduationCap as x, Library as _e, Percent as ve, TrendingUp as ye, Trophy as be, Users as xe, X as S } from "lucide-react";
-import { jsx as C, jsxs as w } from "react/jsx-runtime";
-import { Button as T, GlassCard as E, Input as D } from "@burdenoff/fe-libs/ui";
+import { Activity as _, Award as he, BarChart3 as ge, BookOpen as v, CalendarRange as y, Code2 as b, GraduationCap as x, Library as _e, Percent as ve, Target as S, TrendingUp as ye, Trophy as be, Users as xe, X as C } from "lucide-react";
+import { jsx as w, jsxs as T } from "react/jsx-runtime";
+import { Button as E, GlassCard as D, Input as O } from "@burdenoff/fe-libs/ui";
 //#region src/technospam/pages/AnalyticsAnalyticsPagePage.tsx
 var Se = [
 	"ENROLLED",
@@ -55,13 +55,13 @@ var Se = [
 	RUNTIME_ERROR: "var(--color-status-error)",
 	COMPILE_ERROR: "var(--color-status-error)",
 	PENDING: "var(--color-text-muted)"
-}, O = {
+}, k = {
 	background: "var(--color-bg-surface)",
 	border: "1px solid var(--color-border-seam)",
 	borderRadius: 12,
 	color: "var(--color-text-primary)",
 	fontSize: 12
-}, k = { color: "var(--color-text-secondary)" }, A = {
+}, A = { color: "var(--color-text-secondary)" }, j = {
 	fill: "var(--color-text-muted)",
 	fontSize: 12
 };
@@ -80,72 +80,135 @@ function De(e) {
 		})
 	};
 }
-var j = {
+var M = {
 	blue: "bg-accent-primary/15 text-accent-primary ring-accent-primary/20",
 	teal: "bg-accent-teal/15 text-accent-teal ring-accent-teal/20",
 	purple: "bg-accent-purple/15 text-accent-purple ring-accent-purple/20",
 	indigo: "bg-accent-indigo/15 text-accent-indigo ring-accent-indigo/20"
 };
-function M({ icon: e, title: t, subtitle: r, tone: i }) {
-	return /* @__PURE__ */ w("div", {
+function N({ icon: e, title: t, subtitle: r, tone: i }) {
+	return /* @__PURE__ */ T("div", {
 		className: "mb-4 flex items-center gap-3",
-		children: [/* @__PURE__ */ C("span", {
-			className: n("flex h-9 w-9 shrink-0 items-center justify-center rounded-xl ring-1", j[i]),
-			children: /* @__PURE__ */ C(e, { size: 17 })
-		}), /* @__PURE__ */ w("div", {
+		children: [/* @__PURE__ */ w("span", {
+			className: n("flex h-9 w-9 shrink-0 items-center justify-center rounded-xl ring-1", M[i]),
+			children: /* @__PURE__ */ w(e, { size: 17 })
+		}), /* @__PURE__ */ T("div", {
 			className: "min-w-0",
-			children: [/* @__PURE__ */ C("h3", {
+			children: [/* @__PURE__ */ w("h3", {
 				className: "truncate text-sm font-semibold text-text-primary",
 				children: t
-			}), r ? /* @__PURE__ */ C("p", {
+			}), r ? /* @__PURE__ */ w("p", {
 				className: "truncate text-xs text-text-muted",
 				children: r
 			}) : null]
 		})]
 	});
 }
-function N({ title: e, subtitle: t, icon: n, tone: r = "teal", isEmpty: i, emptyLabel: a, children: o }) {
-	return /* @__PURE__ */ w(E, {
+function P({ title: e, subtitle: t, icon: n, tone: r = "teal", isEmpty: i, emptyLabel: a, children: o }) {
+	return /* @__PURE__ */ T(D, {
 		className: "p-5 transition-shadow duration-200 hover:shadow-lg",
-		children: [/* @__PURE__ */ C(M, {
+		children: [/* @__PURE__ */ w(N, {
 			icon: n,
 			title: e,
 			subtitle: t,
 			tone: r
-		}), i ? /* @__PURE__ */ C("div", {
+		}), i ? /* @__PURE__ */ w("div", {
 			className: "flex h-[240px] items-center justify-center text-center text-sm text-text-muted",
 			children: a
-		}) : /* @__PURE__ */ C(l, {
+		}) : /* @__PURE__ */ w(l, {
 			width: "100%",
 			height: 260,
 			children: o
 		})]
 	});
 }
-function Oe(e) {
-	return e ? `${e}T00:00:00.000Z` : void 0;
+function Oe({ data: e }) {
+	let t = e.length > 1 ? e[e.length - 1] : void 0;
+	return /* @__PURE__ */ T(D, {
+		className: "p-5 transition-shadow duration-200 hover:shadow-lg",
+		children: [/* @__PURE__ */ w(N, {
+			icon: S,
+			title: "Accepted rate by topic",
+			subtitle: "Where your solutions land, and where they don't",
+			tone: "indigo"
+		}), e.length === 0 ? /* @__PURE__ */ w("div", {
+			className: "flex h-[240px] items-center justify-center text-center text-sm text-text-muted",
+			children: "Solve a practice problem and your per-topic rate builds here"
+		}) : /* @__PURE__ */ T("div", {
+			className: "space-y-3",
+			children: [e.map((e) => {
+				let r = t?.topic === e.topic;
+				return /* @__PURE__ */ T("div", { children: [/* @__PURE__ */ T("div", {
+					className: "mb-1 flex flex-wrap items-baseline gap-x-2",
+					children: [
+						/* @__PURE__ */ w("span", {
+							className: "truncate text-sm font-medium text-text-primary",
+							children: e.topic
+						}),
+						/* @__PURE__ */ T("span", {
+							className: n("text-sm font-semibold tabular-nums", r ? "text-status-warning-text" : "text-text-secondary"),
+							children: [e.rate, "%"]
+						}),
+						/* @__PURE__ */ T("span", {
+							className: "ml-auto shrink-0 rounded-full bg-bg-sunken px-2 py-0.5 text-xs text-text-muted",
+							children: [
+								e.accepted,
+								" of ",
+								e.attempted,
+								" accepted"
+							]
+						})
+					]
+				}), /* @__PURE__ */ w("div", {
+					className: "h-2.5 w-full overflow-hidden rounded-full bg-bg-sunken",
+					children: /* @__PURE__ */ w("div", {
+						className: n("h-full rounded-full transition-all duration-500", r ? "bg-status-warning-text" : "bg-accent-primary"),
+						style: { width: `${e.rate}%` }
+					})
+				})] }, e.topic);
+			}), t ? /* @__PURE__ */ T("p", {
+				className: "pt-1 text-xs text-text-muted",
+				children: [
+					"Lowest measured rate: ",
+					/* @__PURE__ */ w("span", {
+						className: "text-text-secondary",
+						children: t.topic
+					}),
+					" —",
+					" ",
+					t.accepted,
+					" of ",
+					t.attempted,
+					" attempts accepted in the loaded range."
+				]
+			}) : null]
+		})]
+	});
 }
 function ke(e) {
+	return e ? `${e}T00:00:00.000Z` : void 0;
+}
+function Ae(e) {
 	return e ? `${e}T23:59:59.999Z` : void 0;
 }
-function Ae({ start: e, end: t, onStart: n, onEnd: r, onPreset: i, onClear: a }) {
-	return /* @__PURE__ */ w(E, {
+function je({ start: e, end: t, onStart: n, onEnd: r, onPreset: i, onClear: a }) {
+	return /* @__PURE__ */ T(D, {
 		className: "mb-6 flex flex-col gap-3 p-4 lg:flex-row lg:items-end lg:justify-between",
-		children: [/* @__PURE__ */ w("div", {
+		children: [/* @__PURE__ */ T("div", {
 			className: "flex flex-wrap items-end gap-3",
 			children: [
-				/* @__PURE__ */ w("div", {
+				/* @__PURE__ */ T("div", {
 					className: "flex items-center gap-2 self-center text-sm font-medium text-text-secondary",
-					children: [/* @__PURE__ */ C(y, {
+					children: [/* @__PURE__ */ w(y, {
 						size: 16,
 						className: "text-accent-teal"
 					}), "Date range"]
 				}),
-				/* @__PURE__ */ w("div", { children: [/* @__PURE__ */ C("label", {
+				/* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w("label", {
 					className: "mb-1 block text-xs font-medium text-text-muted",
 					htmlFor: "tec-range-from",
 					children: "From"
-				}), /* @__PURE__ */ C(D, {
+				}), /* @__PURE__ */ w(O, {
 					id: "tec-range-from",
 					type: "date",
 					value: e,
@@ -153,11 +216,11 @@ function Ae({ start: e, end: t, onStart: n, onEnd: r, onPreset: i, onClear: a })
 					onChange: (e) => n(e.target.value),
 					className: "w-40"
 				})] }),
-				/* @__PURE__ */ w("div", { children: [/* @__PURE__ */ C("label", {
+				/* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w("label", {
 					className: "mb-1 block text-xs font-medium text-text-muted",
 					htmlFor: "tec-range-to",
 					children: "To"
-				}), /* @__PURE__ */ C(D, {
+				}), /* @__PURE__ */ w(O, {
 					id: "tec-range-to",
 					type: "date",
 					value: t,
@@ -165,29 +228,29 @@ function Ae({ start: e, end: t, onStart: n, onEnd: r, onPreset: i, onClear: a })
 					onChange: (e) => r(e.target.value),
 					className: "w-40"
 				})] }),
-				e || t ? /* @__PURE__ */ w(T, {
+				e || t ? /* @__PURE__ */ T(E, {
 					variant: "ghost",
 					size: "sm",
 					onClick: a,
-					children: [/* @__PURE__ */ C(S, { size: 14 }), " Clear"]
+					children: [/* @__PURE__ */ w(C, { size: 14 }), " Clear"]
 				}) : null
 			]
-		}), /* @__PURE__ */ w("div", {
+		}), /* @__PURE__ */ T("div", {
 			className: "flex flex-wrap gap-2",
 			children: [
-				/* @__PURE__ */ C(T, {
+				/* @__PURE__ */ w(E, {
 					variant: "outline",
 					size: "sm",
 					onClick: () => i(7),
 					children: "Last 7 days"
 				}),
-				/* @__PURE__ */ C(T, {
+				/* @__PURE__ */ w(E, {
 					variant: "outline",
 					size: "sm",
 					onClick: () => i(30),
 					children: "Last 30 days"
 				}),
-				/* @__PURE__ */ C(T, {
+				/* @__PURE__ */ w(E, {
 					variant: "outline",
 					size: "sm",
 					onClick: () => i(90),
@@ -197,12 +260,12 @@ function Ae({ start: e, end: t, onStart: n, onEnd: r, onPreset: i, onClear: a })
 		})]
 	});
 }
-function P() {
-	let n = t(), { currentUser: y } = e(), S = y?.id, [D, j] = g(""), [P, F] = g(""), I = Oe(D), L = ke(P), je = (e) => {
+function F() {
+	let n = t(), { currentUser: y } = e(), S = y?.id, [C, O] = g(""), [M, F] = g(""), I = ke(C), L = Ae(M), Me = (e) => {
 		let t = /* @__PURE__ */ new Date(), n = /* @__PURE__ */ new Date();
-		n.setDate(n.getDate() - e), j(n.toISOString().slice(0, 10)), F(t.toISOString().slice(0, 10));
-	}, Me = () => {
-		j(""), F("");
+		n.setDate(n.getDate() - e), O(n.toISOString().slice(0, 10)), F(t.toISOString().slice(0, 10));
+	}, Ne = () => {
+		O(""), F("");
 	}, R = I || L ? {
 		startDate: I,
 		endDate: L
@@ -212,7 +275,7 @@ function P() {
 	} : {}), B = le(S ? {
 		learnerId: S,
 		...R
-	} : {}), V = ce(S ? { menteeId: S } : {}), H = re(S ? { learnerId: S } : {}), Ne = ie({ status: "PUBLISHED" }), Pe = se({ status: "PUBLISHED" }), Fe = oe({}), U = h(() => z.data?.tecListEnrollments.items ?? [], [z.data]), W = h(() => B.data?.tecListSubmissions.items ?? [], [B.data]), G = V.data?.tecListSessions.items ?? [], K = H.data?.tecListCertificates ?? [], Ie = Ne.data?.tecListCourses.items.length ?? 0, Le = Pe.data?.tecListProblems.items.length ?? 0, Re = Fe.data?.tecListHackathons.items.length ?? 0, q = h(() => {
+	} : {}), V = ce(S ? { menteeId: S } : {}), H = re(S ? { learnerId: S } : {}), Pe = ie({ status: "PUBLISHED" }), Fe = se({ status: "PUBLISHED" }), Ie = oe({}), U = h(() => z.data?.tecListEnrollments.items ?? [], [z.data]), W = h(() => B.data?.tecListSubmissions.items ?? [], [B.data]), G = V.data?.tecListSessions.items ?? [], K = H.data?.tecListCertificates ?? [], Le = Pe.data?.tecListCourses.items.length ?? 0, Re = Fe.data?.tecListProblems.items.length ?? 0, ze = Ie.data?.tecListHackathons.items.length ?? 0, q = h(() => {
 		let e = U.filter((e) => e.status === "COMPLETED").length, t = U.length ? Math.round(U.reduce((e, t) => e + t.progressPct, 0) / U.length) : 0, n = W.filter((e) => e.verdict === "ACCEPTED");
 		return {
 			coursesCompleted: e,
@@ -228,7 +291,21 @@ function P() {
 		label: Te[e],
 		count: W.filter((t) => t.verdict === e).length,
 		color: Ee[e]
-	})).filter((e) => e.count > 0), [W]), X = h(() => {
+	})).filter((e) => e.count > 0), [W]), Be = h(() => {
+		let e = /* @__PURE__ */ new Map();
+		return W.forEach((t) => {
+			let n = t.problem?.topic?.trim() || "Untagged", r = e.get(n) ?? {
+				accepted: 0,
+				attempted: 0
+			};
+			r.attempted += 1, t.verdict === "ACCEPTED" && (r.accepted += 1), e.set(n, r);
+		}), [...e.entries()].map(([e, t]) => ({
+			topic: e,
+			accepted: t.accepted,
+			attempted: t.attempted,
+			rate: Math.round(t.accepted / t.attempted * 100)
+		})).sort((e, t) => t.rate - e.rate || t.attempted - e.attempted);
+	}, [W]), X = h(() => {
 		let e = /* @__PURE__ */ new Map(), t = (t, n) => {
 			let { key: r, label: i } = De(t), a = e.get(r) ?? {
 				label: i,
@@ -238,111 +315,111 @@ function P() {
 			a[n] += 1, e.set(r, a);
 		};
 		return W.forEach((e) => t(e.createdAt, "submissions")), U.forEach((e) => t(e.createdAt, "enrollments")), [...e.entries()].sort((e, t) => e[0] - t[0]).slice(-8).map(([, e]) => e);
-	}, [W, U]), Z = U.length > 0 || W.length > 0 || G.length > 0 || K.length > 0, ze = z.loading || B.loading || V.loading || H.loading, Q = z.error || B.error || V.error || H.error, Be = ze && !Z, $ = /* @__PURE__ */ w("div", { children: [
-		/* @__PURE__ */ C("h2", {
+	}, [W, U]), Z = U.length > 0 || W.length > 0 || G.length > 0 || K.length > 0, Ve = z.loading || B.loading || V.loading || H.loading, Q = z.error || B.error || V.error || H.error, He = Ve && !Z, $ = /* @__PURE__ */ T("div", { children: [
+		/* @__PURE__ */ w("h2", {
 			className: "mb-3 text-base font-semibold text-text-primary",
 			children: "Workspace overview"
 		}),
-		/* @__PURE__ */ C("p", {
+		/* @__PURE__ */ w("p", {
 			className: "mb-4 max-w-2xl text-sm text-text-secondary",
 			children: "Live content available across the TechnoSpam learning workspace right now."
 		}),
-		/* @__PURE__ */ w("div", {
+		/* @__PURE__ */ T("div", {
 			className: "grid grid-cols-1 gap-3 sm:grid-cols-3",
 			children: [
-				/* @__PURE__ */ C(i, {
+				/* @__PURE__ */ w(i, {
 					label: "Published courses",
-					value: Ie,
+					value: Le,
 					icon: _e,
 					tone: "blue"
 				}),
-				/* @__PURE__ */ C(i, {
+				/* @__PURE__ */ w(i, {
 					label: "Published problems",
-					value: Le,
+					value: Re,
 					icon: b,
 					tone: "indigo"
 				}),
-				/* @__PURE__ */ C(i, {
+				/* @__PURE__ */ w(i, {
 					label: "Hackathons",
-					value: Re,
+					value: ze,
 					icon: be,
 					tone: "purple"
 				})
 			]
 		})
 	] });
-	return /* @__PURE__ */ C(r, {
+	return /* @__PURE__ */ w(r, {
 		hero: !0,
 		title: "Analytics",
 		description: "Your real learning performance across courses, problems, mentoring and certificates.",
-		actions: /* @__PURE__ */ w(T, {
+		actions: /* @__PURE__ */ T(E, {
 			variant: "outline",
 			onClick: () => n("/courses/my-learning-page"),
-			children: [/* @__PURE__ */ C(x, { size: 16 }), " My Learning"]
+			children: [/* @__PURE__ */ w(x, { size: 16 }), " My Learning"]
 		}),
-		children: S ? Be ? /* @__PURE__ */ w("div", {
+		children: S ? He ? /* @__PURE__ */ T("div", {
 			className: "space-y-6",
-			children: [/* @__PURE__ */ C(te, {
+			children: [/* @__PURE__ */ w(te, {
 				count: 4,
 				height: "h-24"
-			}), /* @__PURE__ */ C(ne, {
+			}), /* @__PURE__ */ w(ne, {
 				count: 2,
 				height: "h-72"
 			})]
-		}) : Q && !Z ? /* @__PURE__ */ C(ee, {
+		}) : Q && !Z ? /* @__PURE__ */ w(ee, {
 			title: "Couldn't load your analytics",
 			error: Q
-		}) : /* @__PURE__ */ w("div", {
+		}) : /* @__PURE__ */ T("div", {
 			className: "space-y-8",
 			children: [
-				/* @__PURE__ */ C(Ae, {
-					start: D,
-					end: P,
-					onStart: j,
+				/* @__PURE__ */ w(je, {
+					start: C,
+					end: M,
+					onStart: O,
 					onEnd: F,
-					onPreset: je,
-					onClear: Me
+					onPreset: Me,
+					onClear: Ne
 				}),
-				/* @__PURE__ */ w("div", {
+				/* @__PURE__ */ T("div", {
 					className: "grid grid-cols-2 gap-3 sm:grid-cols-3 xl:grid-cols-4",
 					children: [
-						/* @__PURE__ */ C(i, {
+						/* @__PURE__ */ w(i, {
 							label: "Courses enrolled",
 							value: U.length,
 							icon: v,
 							tone: "blue"
 						}),
-						/* @__PURE__ */ C(i, {
+						/* @__PURE__ */ w(i, {
 							label: "Courses completed",
 							value: q.coursesCompleted,
 							icon: x,
 							tone: "green"
 						}),
-						/* @__PURE__ */ C(i, {
+						/* @__PURE__ */ w(i, {
 							label: "Avg progress",
 							value: `${q.avgProgress}%`,
 							icon: ye,
 							tone: "purple"
 						}),
-						/* @__PURE__ */ C(i, {
+						/* @__PURE__ */ w(i, {
 							label: "Problems solved",
 							value: q.problemsSolved,
 							icon: b,
 							tone: "indigo"
 						}),
-						/* @__PURE__ */ C(i, {
+						/* @__PURE__ */ w(i, {
 							label: "Acceptance rate",
 							value: `${q.acceptanceRate}%`,
 							icon: ve,
 							tone: "teal"
 						}),
-						/* @__PURE__ */ C(i, {
+						/* @__PURE__ */ w(i, {
 							label: "Mentor sessions",
 							value: G.length,
 							icon: xe,
 							tone: "blue"
 						}),
-						/* @__PURE__ */ C(i, {
+						/* @__PURE__ */ w(i, {
 							label: "Certificates",
 							value: K.length,
 							icon: he,
@@ -350,207 +427,211 @@ function P() {
 						})
 					]
 				}),
-				Z ? /* @__PURE__ */ w("div", {
+				Z ? /* @__PURE__ */ T("div", {
 					className: "space-y-4",
-					children: [/* @__PURE__ */ w("div", {
-						className: "grid grid-cols-1 gap-4 lg:grid-cols-2",
-						children: [/* @__PURE__ */ C(N, {
-							title: "Enrollments by status",
-							subtitle: "How your courses are progressing",
-							icon: v,
-							tone: "blue",
-							isEmpty: J.length === 0,
-							emptyLabel: "No enrollments yet",
-							children: /* @__PURE__ */ w(pe, { children: [
-								/* @__PURE__ */ C(ue, {
-									data: J,
-									dataKey: "value",
-									nameKey: "name",
-									innerRadius: 60,
-									outerRadius: 92,
-									paddingAngle: 2,
-									stroke: "var(--color-bg-surface)",
-									strokeWidth: 2,
-									children: J.map((e) => /* @__PURE__ */ C(u, { fill: e.color }, e.name))
-								}),
-								/* @__PURE__ */ C(c, {
-									contentStyle: O,
-									labelStyle: k
-								}),
-								/* @__PURE__ */ C(s, {
-									iconType: "circle",
-									wrapperStyle: { fontSize: 12 }
-								})
-							] })
-						}), /* @__PURE__ */ C(N, {
-							title: "Submissions by verdict",
-							subtitle: "Outcomes across your attempts",
-							icon: b,
-							tone: "purple",
-							isEmpty: Y.length === 0,
-							emptyLabel: "No submissions yet",
-							children: /* @__PURE__ */ w(fe, {
-								data: Y,
-								margin: {
-									top: 8,
-									right: 8,
-									left: -18,
-									bottom: 0
-								},
-								children: [
-									/* @__PURE__ */ C(d, {
-										strokeDasharray: "3 3",
-										stroke: "var(--color-border-seam)",
-										vertical: !1
-									}),
-									/* @__PURE__ */ C(p, {
-										dataKey: "label",
-										tick: A,
-										axisLine: { stroke: "var(--color-border-seam)" },
-										tickLine: !1
-									}),
-									/* @__PURE__ */ C(m, {
-										allowDecimals: !1,
-										tick: A,
-										axisLine: !1,
-										tickLine: !1
-									}),
-									/* @__PURE__ */ C(c, {
-										contentStyle: O,
-										labelStyle: k,
-										cursor: {
-											fill: "var(--color-accent-primary)",
-											fillOpacity: .08
-										}
-									}),
-									/* @__PURE__ */ C(de, {
-										dataKey: "count",
-										name: "Submissions",
-										radius: [
-											6,
-											6,
-											0,
-											0
-										],
-										maxBarSize: 56,
-										children: Y.map((e) => /* @__PURE__ */ C(u, { fill: e.color }, e.label))
-									})
-								]
-							})
-						})]
-					}), /* @__PURE__ */ w(E, {
-						className: "p-5 transition-shadow duration-200 hover:shadow-lg",
-						children: [/* @__PURE__ */ C(M, {
-							icon: _,
-							title: "Learning activity over time",
-							subtitle: "Submissions and enrollments per week",
-							tone: "teal"
-						}), X.length === 0 ? /* @__PURE__ */ C("div", {
-							className: "flex h-[240px] items-center justify-center text-sm text-text-muted",
-							children: "No dated activity yet"
-						}) : /* @__PURE__ */ C(l, {
-							width: "100%",
-							height: 280,
-							children: /* @__PURE__ */ w(me, {
-								data: X,
-								margin: {
-									top: 8,
-									right: 12,
-									left: -18,
-									bottom: 0
-								},
-								children: [
-									/* @__PURE__ */ w("defs", { children: [/* @__PURE__ */ w("linearGradient", {
-										id: "tec-grad-submissions",
-										x1: "0",
-										y1: "0",
-										x2: "0",
-										y2: "1",
-										children: [/* @__PURE__ */ C("stop", {
-											offset: "0%",
-											stopColor: "var(--color-accent-primary)",
-											stopOpacity: .35
-										}), /* @__PURE__ */ C("stop", {
-											offset: "100%",
-											stopColor: "var(--color-accent-primary)",
-											stopOpacity: 0
-										})]
-									}), /* @__PURE__ */ w("linearGradient", {
-										id: "tec-grad-enrollments",
-										x1: "0",
-										y1: "0",
-										x2: "0",
-										y2: "1",
-										children: [/* @__PURE__ */ C("stop", {
-											offset: "0%",
-											stopColor: "var(--color-accent-teal)",
-											stopOpacity: .35
-										}), /* @__PURE__ */ C("stop", {
-											offset: "100%",
-											stopColor: "var(--color-accent-teal)",
-											stopOpacity: 0
-										})]
-									})] }),
-									/* @__PURE__ */ C(d, {
-										strokeDasharray: "3 3",
-										stroke: "var(--color-border-seam)",
-										vertical: !1
-									}),
-									/* @__PURE__ */ C(p, {
-										dataKey: "label",
-										tick: A,
-										axisLine: { stroke: "var(--color-border-seam)" },
-										tickLine: !1
-									}),
-									/* @__PURE__ */ C(m, {
-										allowDecimals: !1,
-										tick: A,
-										axisLine: !1,
-										tickLine: !1
+					children: [
+						/* @__PURE__ */ T("div", {
+							className: "grid grid-cols-1 gap-4 lg:grid-cols-2",
+							children: [/* @__PURE__ */ w(P, {
+								title: "Enrollments by status",
+								subtitle: "How your courses are progressing",
+								icon: v,
+								tone: "blue",
+								isEmpty: J.length === 0,
+								emptyLabel: "No enrollments yet",
+								children: /* @__PURE__ */ T(pe, { children: [
+									/* @__PURE__ */ w(ue, {
+										data: J,
+										dataKey: "value",
+										nameKey: "name",
+										innerRadius: 60,
+										outerRadius: 92,
+										paddingAngle: 2,
+										stroke: "var(--color-bg-surface)",
+										strokeWidth: 2,
+										children: J.map((e) => /* @__PURE__ */ w(u, { fill: e.color }, e.name))
 									}),
-									/* @__PURE__ */ C(c, {
-										contentStyle: O,
-										labelStyle: k
+									/* @__PURE__ */ w(c, {
+										contentStyle: k,
+										labelStyle: A
 									}),
-									/* @__PURE__ */ C(s, {
+									/* @__PURE__ */ w(s, {
 										iconType: "circle",
 										wrapperStyle: { fontSize: 12 }
-									}),
-									/* @__PURE__ */ C(f, {
-										type: "monotone",
-										dataKey: "submissions",
-										name: "Submissions",
-										stroke: "var(--color-accent-primary)",
-										strokeWidth: 2,
-										fill: "url(#tec-grad-submissions)"
-									}),
-									/* @__PURE__ */ C(f, {
-										type: "monotone",
-										dataKey: "enrollments",
-										name: "Enrollments",
-										stroke: "var(--color-accent-teal)",
-										strokeWidth: 2,
-										fill: "url(#tec-grad-enrollments)"
 									})
-								]
-							})
-						})]
-					})]
-				}) : /* @__PURE__ */ C(o, {
-					icon: /* @__PURE__ */ C(_, { size: 26 }),
+								] })
+							}), /* @__PURE__ */ w(P, {
+								title: "Submissions by verdict",
+								subtitle: "Outcomes across your attempts",
+								icon: b,
+								tone: "purple",
+								isEmpty: Y.length === 0,
+								emptyLabel: "No submissions yet",
+								children: /* @__PURE__ */ T(fe, {
+									data: Y,
+									margin: {
+										top: 8,
+										right: 8,
+										left: -18,
+										bottom: 0
+									},
+									children: [
+										/* @__PURE__ */ w(d, {
+											strokeDasharray: "3 3",
+											stroke: "var(--color-border-seam)",
+											vertical: !1
+										}),
+										/* @__PURE__ */ w(p, {
+											dataKey: "label",
+											tick: j,
+											axisLine: { stroke: "var(--color-border-seam)" },
+											tickLine: !1
+										}),
+										/* @__PURE__ */ w(m, {
+											allowDecimals: !1,
+											tick: j,
+											axisLine: !1,
+											tickLine: !1
+										}),
+										/* @__PURE__ */ w(c, {
+											contentStyle: k,
+											labelStyle: A,
+											cursor: {
+												fill: "var(--color-accent-primary)",
+												fillOpacity: .08
+											}
+										}),
+										/* @__PURE__ */ w(de, {
+											dataKey: "count",
+											name: "Submissions",
+											radius: [
+												6,
+												6,
+												0,
+												0
+											],
+											maxBarSize: 56,
+											children: Y.map((e) => /* @__PURE__ */ w(u, { fill: e.color }, e.label))
+										})
+									]
+								})
+							})]
+						}),
+						/* @__PURE__ */ w(Oe, { data: Be }),
+						/* @__PURE__ */ T(D, {
+							className: "p-5 transition-shadow duration-200 hover:shadow-lg",
+							children: [/* @__PURE__ */ w(N, {
+								icon: _,
+								title: "Learning activity over time",
+								subtitle: "Submissions and enrollments per week",
+								tone: "teal"
+							}), X.length === 0 ? /* @__PURE__ */ w("div", {
+								className: "flex h-[240px] items-center justify-center text-sm text-text-muted",
+								children: "No dated activity yet"
+							}) : /* @__PURE__ */ w(l, {
+								width: "100%",
+								height: 280,
+								children: /* @__PURE__ */ T(me, {
+									data: X,
+									margin: {
+										top: 8,
+										right: 12,
+										left: -18,
+										bottom: 0
+									},
+									children: [
+										/* @__PURE__ */ T("defs", { children: [/* @__PURE__ */ T("linearGradient", {
+											id: "tec-grad-submissions",
+											x1: "0",
+											y1: "0",
+											x2: "0",
+											y2: "1",
+											children: [/* @__PURE__ */ w("stop", {
+												offset: "0%",
+												stopColor: "var(--color-accent-primary)",
+												stopOpacity: .35
+											}), /* @__PURE__ */ w("stop", {
+												offset: "100%",
+												stopColor: "var(--color-accent-primary)",
+												stopOpacity: 0
+											})]
+										}), /* @__PURE__ */ T("linearGradient", {
+											id: "tec-grad-enrollments",
+											x1: "0",
+											y1: "0",
+											x2: "0",
+											y2: "1",
+											children: [/* @__PURE__ */ w("stop", {
+												offset: "0%",
+												stopColor: "var(--color-accent-teal)",
+												stopOpacity: .35
+											}), /* @__PURE__ */ w("stop", {
+												offset: "100%",
+												stopColor: "var(--color-accent-teal)",
+												stopOpacity: 0
+											})]
+										})] }),
+										/* @__PURE__ */ w(d, {
+											strokeDasharray: "3 3",
+											stroke: "var(--color-border-seam)",
+											vertical: !1
+										}),
+										/* @__PURE__ */ w(p, {
+											dataKey: "label",
+											tick: j,
+											axisLine: { stroke: "var(--color-border-seam)" },
+											tickLine: !1
+										}),
+										/* @__PURE__ */ w(m, {
+											allowDecimals: !1,
+											tick: j,
+											axisLine: !1,
+											tickLine: !1
+										}),
+										/* @__PURE__ */ w(c, {
+											contentStyle: k,
+											labelStyle: A
+										}),
+										/* @__PURE__ */ w(s, {
+											iconType: "circle",
+											wrapperStyle: { fontSize: 12 }
+										}),
+										/* @__PURE__ */ w(f, {
+											type: "monotone",
+											dataKey: "submissions",
+											name: "Submissions",
+											stroke: "var(--color-accent-primary)",
+											strokeWidth: 2,
+											fill: "url(#tec-grad-submissions)"
+										}),
+										/* @__PURE__ */ w(f, {
+											type: "monotone",
+											dataKey: "enrollments",
+											name: "Enrollments",
+											stroke: "var(--color-accent-teal)",
+											strokeWidth: 2,
+											fill: "url(#tec-grad-enrollments)"
+										})
+									]
+								})
+							})]
+						})
+					]
+				}) : /* @__PURE__ */ w(o, {
+					icon: /* @__PURE__ */ w(_, { size: 26 }),
 					title: "No learning activity yet",
 					description: "Enroll in a course or solve a problem and your progress charts will build here. TechnoSpam is pre-launch — start learning to see your data.",
-					action: /* @__PURE__ */ C(T, {
+					action: /* @__PURE__ */ w(E, {
 						onClick: () => n("/courses/courses-page"),
 						children: "Browse courses"
 					})
 				}),
 				$
 			]
-		}) : /* @__PURE__ */ w("div", {
+		}) : /* @__PURE__ */ T("div", {
 			className: "space-y-8",
-			children: [/* @__PURE__ */ C(o, {
-				icon: /* @__PURE__ */ C(ge, { size: 26 }),
+			children: [/* @__PURE__ */ w(o, {
+				icon: /* @__PURE__ */ w(ge, { size: 26 }),
 				title: "Sign in to view your analytics",
 				description: "Your personal learning metrics appear here once you're signed in."
 			}), $]
@@ -558,6 +639,6 @@ function P() {
 	});
 }
 //#endregion
-export { P as AnalyticsAnalyticsPagePage };
+export { F as AnalyticsAnalyticsPagePage };
 
 //# sourceMappingURL=AnalyticsAnalyticsPagePage.js.map