npm - @burdenoff/microfe-technospam - Versions diffs - 2026.1101.4 → 2026.1102.1 - Mend

@burdenoff/microfe-technospam 2026.1101.4 → 2026.1102.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (56) hide show

package/dist/technospam/pages/CoursesMyLearningPagePage.js CHANGED Viewed

@@ -7,190 +7,198 @@ import { formatDate as o, relativeTime as s } from "../utils/format.js";
 import { StatusBadge as c } from "../components/StatusBadge.js";
 import { EmptyView as l, ErrorView as u, LoadingRows as d } from "../components/StateViews.js";
 import { useMyCertificatesQuery as f, useMyEnrollmentsQuery as p } from "../api/technospamApi.js";
+import { CertificateVerifyLink as m } from "../components/CertificateVerifyLink.js";
 import "../components/index.js";
-import { FOCUS_PARAMS as m } from "../utils/pageContext.js";
-import { resumePath as h } from "../utils/lessonPath.js";
-import { focusableCardProps as g, useFocusedRecordParam as _ } from "../hooks/useFocusedRecordParam.js";
-import { createElement as v } from "react";
-import { Award as y, BookOpen as b, GraduationCap as x, PlayCircle as S, ShieldCheck as C } from "lucide-react";
-import { jsx as w, jsxs as T } from "react/jsx-runtime";
-import { Button as E, GlassCard as D } from "@burdenoff/fe-libs/ui";
+import { FOCUS_PARAMS as h } from "../utils/pageContext.js";
+import { resumePath as g } from "../utils/lessonPath.js";
+import { focusableCardProps as _, useFocusedRecordParam as v } from "../hooks/useFocusedRecordParam.js";
+import { createElement as y } from "react";
+import { Award as b, BookOpen as x, GraduationCap as S, PlayCircle as C, ShieldCheck as w } from "lucide-react";
+import { jsx as T, jsxs as E } from "react/jsx-runtime";
+import { Button as D, GlassCard as O } from "@burdenoff/fe-libs/ui";
 //#region src/technospam/pages/CoursesMyLearningPagePage.tsx
-function O({ e, onOpen: n, focused: r, onToggle: o }) {
+function k({ e, onOpen: n, focused: r, onToggle: o }) {
 	let l = `${e.course?.topic ?? ""} ${e.course?.title ?? "Course"}`;
-	return /* @__PURE__ */ T(D, {
+	return /* @__PURE__ */ E(O, {
 		className: t("group flex cursor-pointer flex-col gap-3 p-4 transition-all duration-200 hover:-translate-y-0.5 hover:shadow-md sm:flex-row sm:items-center sm:gap-4", r && "ring-2 ring-accent-primary"),
-		...g(r, o),
+		..._(r, o),
 		children: [
-			/* @__PURE__ */ w("span", {
+			/* @__PURE__ */ T("span", {
 				className: t("flex h-12 w-12 shrink-0 items-center justify-center rounded-xl bg-gradient-to-br text-white shadow-sm transition-transform duration-200 group-hover:scale-105", i(l)),
-				children: v(a(l), { size: 20 })
+				children: y(a(l), { size: 20 })
 			}),
-			/* @__PURE__ */ T("div", {
+			/* @__PURE__ */ E("div", {
 				className: "min-w-0 flex-1",
 				children: [
-					/* @__PURE__ */ T("div", {
+					/* @__PURE__ */ E("div", {
 						className: "flex flex-wrap items-center gap-2",
-						children: [/* @__PURE__ */ w("button", {
+						children: [/* @__PURE__ */ T("button", {
 							type: "button",
 							"aria-pressed": r,
 							onClick: o,
 							className: "truncate text-left text-sm font-semibold text-text-primary group-hover:text-accent-primary",
 							children: e.course?.title ?? "Course"
-						}), /* @__PURE__ */ w(c, { status: e.status })]
+						}), /* @__PURE__ */ T(c, { status: e.status })]
 					}),
-					/* @__PURE__ */ T("div", {
+					/* @__PURE__ */ E("div", {
 						className: "mt-1 flex flex-wrap items-center gap-2 text-xs text-text-muted",
 						children: [
-							/* @__PURE__ */ T("span", { children: [e.lessonsCompleted, " lessons done"] }),
-							/* @__PURE__ */ w("span", {
+							/* @__PURE__ */ E("span", { children: [e.lessonsCompleted, " lessons done"] }),
+							/* @__PURE__ */ T("span", {
 								"aria-hidden": !0,
 								children: "·"
 							}),
-							/* @__PURE__ */ T("span", { children: ["Active ", s(e.lastActiveAt ?? e.startedAt)] })
+							/* @__PURE__ */ E("span", { children: ["Active ", s(e.lastActiveAt ?? e.startedAt)] })
 						]
 					}),
-					/* @__PURE__ */ w("div", {
+					/* @__PURE__ */ T("div", {
 						className: "mt-2 h-1.5 w-full overflow-hidden rounded-full bg-bg-sunken",
-						children: /* @__PURE__ */ w("div", {
+						children: /* @__PURE__ */ T("div", {
 							className: "h-full rounded-full bg-gradient-to-r from-accent-primary via-accent-indigo to-accent-purple transition-all duration-500",
 							style: { width: `${e.progressPct}%` }
 						})
 					})
 				]
 			}),
-			/* @__PURE__ */ T("div", {
+			/* @__PURE__ */ E("div", {
 				className: "flex items-center justify-between gap-3 sm:flex-col sm:items-end sm:justify-center",
-				children: [/* @__PURE__ */ T("div", {
+				children: [/* @__PURE__ */ E("div", {
 					className: "text-lg font-semibold tabular-nums text-text-primary",
 					children: [e.progressPct, "%"]
-				}), /* @__PURE__ */ T(E, {
+				}), /* @__PURE__ */ E(D, {
 					variant: "ghost",
 					size: "sm",
 					onClick: n,
 					"data-testid": `resume-${e.courseId}`,
-					children: [/* @__PURE__ */ w(S, { size: 15 }), " Resume"]
+					children: [/* @__PURE__ */ T(C, { size: 15 }), " Resume"]
 				})]
 			})
 		]
 	});
 }
-var k = [m.certificate], A = [m.enrollment];
-function j() {
-	let i = e(), { enrollments: a, loading: s, error: v } = p(), { certificates: j } = f(), [M, N] = _(m.enrollment, k), [P, F] = _(m.certificate, A), I = a.filter((e) => e.status === "COMPLETED").length, L = a.filter((e) => e.status === "IN_PROGRESS" || e.status === "ENROLLED").length;
-	return /* @__PURE__ */ T(n, {
+var A = [h.certificate], j = [h.enrollment];
+function M() {
+	let i = e(), { enrollments: a, loading: s, error: y } = p(), { certificates: M } = f(), [N, P] = v(h.enrollment, A), [F, I] = v(h.certificate, j), L = a.filter((e) => e.status === "COMPLETED").length, R = a.filter((e) => e.status === "IN_PROGRESS" || e.status === "ENROLLED").length;
+	return /* @__PURE__ */ E(n, {
 		hero: !0,
 		title: "My Learning",
 		description: "Track your enrolled courses, progress, and earned certificates.",
-		actions: /* @__PURE__ */ T(E, {
+		actions: /* @__PURE__ */ E(D, {
 			variant: "outline",
 			onClick: () => i("/courses/courses-page"),
-			children: [/* @__PURE__ */ w(b, { size: 16 }), " Browse catalog"]
+			children: [/* @__PURE__ */ T(x, { size: 16 }), " Browse catalog"]
 		}),
 		children: [
-			/* @__PURE__ */ T("div", {
+			/* @__PURE__ */ E("div", {
 				className: "mb-6 grid grid-cols-2 gap-3 sm:grid-cols-4",
 				children: [
-					/* @__PURE__ */ w(r, {
+					/* @__PURE__ */ T(r, {
 						label: "Enrolled",
 						value: a.length,
 						hint: "Courses you've enrolled in",
-						icon: b,
+						icon: x,
 						tone: "blue"
 					}),
-					/* @__PURE__ */ w(r, {
+					/* @__PURE__ */ T(r, {
 						label: "In progress",
-						value: L,
+						value: R,
 						hint: "Courses in progress",
-						icon: S,
+						icon: C,
 						tone: "indigo"
 					}),
-					/* @__PURE__ */ w(r, {
+					/* @__PURE__ */ T(r, {
 						label: "Completed",
-						value: I,
+						value: L,
 						hint: "Courses completed",
-						icon: x,
+						icon: S,
 						tone: "green"
 					}),
-					/* @__PURE__ */ w(r, {
+					/* @__PURE__ */ T(r, {
 						label: "Certificates",
-						value: j.length,
+						value: M.length,
 						hint: "Certificates earned",
-						icon: y,
+						icon: b,
 						tone: "purple"
 					})
 				]
 			}),
-			s && !a.length ? /* @__PURE__ */ w(d, {
+			s && !a.length ? /* @__PURE__ */ T(d, {
 				count: 3,
 				height: "h-24"
-			}) : v ? /* @__PURE__ */ w(u, {
+			}) : y ? /* @__PURE__ */ T(u, {
 				title: "Couldn't load your learning",
-				error: v
-			}) : a.length === 0 ? /* @__PURE__ */ w(l, {
-				icon: /* @__PURE__ */ w(b, { size: 26 }),
+				error: y
+			}) : a.length === 0 ? /* @__PURE__ */ T(l, {
+				icon: /* @__PURE__ */ T(x, { size: 26 }),
 				title: "You haven't enrolled yet",
 				description: "Browse the catalog and enroll in a course to start building skill by doing.",
-				action: /* @__PURE__ */ w(E, {
+				action: /* @__PURE__ */ T(D, {
 					onClick: () => i("/courses/courses-page"),
 					children: "Browse courses"
 				})
-			}) : /* @__PURE__ */ w("div", {
+			}) : /* @__PURE__ */ T("div", {
 				className: "space-y-3",
-				children: a.map((e) => /* @__PURE__ */ w(O, {
+				children: a.map((e) => /* @__PURE__ */ T(k, {
 					e,
-					onOpen: () => i(h(e.courseId, e.nextLessonId)),
-					focused: M === e.id,
-					onToggle: () => N(M === e.id ? null : e.id)
+					onOpen: () => i(g(e.courseId, e.nextLessonId)),
+					focused: N === e.id,
+					onToggle: () => P(N === e.id ? null : e.id)
 				}, e.id))
 			}),
-			j.length > 0 ? /* @__PURE__ */ T("div", {
+			M.length > 0 ? /* @__PURE__ */ E("div", {
 				className: "mt-8",
-				children: [/* @__PURE__ */ T("h2", {
+				children: [/* @__PURE__ */ E("h2", {
 					className: "mb-3 flex items-center gap-2 text-base font-semibold text-text-primary",
-					children: [/* @__PURE__ */ w(y, {
+					children: [/* @__PURE__ */ T(b, {
 						size: 18,
 						className: "text-accent-teal"
 					}), " Certificates"]
-				}), /* @__PURE__ */ w("div", {
+				}), /* @__PURE__ */ T("div", {
 					className: "grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-3",
-					children: j.map((e) => /* @__PURE__ */ T(D, {
-						className: t("group flex cursor-pointer flex-col gap-3 p-4 transition-all duration-200 hover:-translate-y-1 hover:shadow-lg", P === e.id && "ring-2 ring-accent-primary"),
-						...g(P === e.id, () => F(P === e.id ? null : e.id)),
-						children: [/* @__PURE__ */ T("div", {
-							className: "flex items-center gap-3",
-							children: [/* @__PURE__ */ w("span", {
-								className: "flex h-11 w-11 shrink-0 items-center justify-center rounded-xl bg-status-warning-bg-subtle text-status-warning-text ring-1 ring-status-warning-border/30 transition-transform duration-200 group-hover:scale-105",
-								children: /* @__PURE__ */ w(y, { size: 22 })
-							}), /* @__PURE__ */ T("div", {
-								className: "min-w-0",
-								children: [/* @__PURE__ */ w("button", {
-									type: "button",
-									"aria-pressed": P === e.id,
-									onClick: () => F(P === e.id ? null : e.id),
-									className: "block max-w-full truncate text-left text-sm font-medium text-text-primary",
-									children: e.course?.title ?? "Certificate"
-								}), /* @__PURE__ */ T("div", {
-									className: "truncate text-xs text-text-muted",
-									children: ["Serial ", e.serial]
+					children: M.map((e) => /* @__PURE__ */ E(O, {
+						className: t("group flex cursor-pointer flex-col gap-3 p-4 transition-all duration-200 hover:-translate-y-1 hover:shadow-lg", F === e.id && "ring-2 ring-accent-primary"),
+						..._(F === e.id, () => I(F === e.id ? null : e.id)),
+						children: [
+							/* @__PURE__ */ E("div", {
+								className: "flex items-center gap-3",
+								children: [/* @__PURE__ */ T("span", {
+									className: "flex h-11 w-11 shrink-0 items-center justify-center rounded-xl bg-status-warning-bg-subtle text-status-warning-text ring-1 ring-status-warning-border/30 transition-transform duration-200 group-hover:scale-105",
+									children: /* @__PURE__ */ T(b, { size: 22 })
+								}), /* @__PURE__ */ E("div", {
+									className: "min-w-0",
+									children: [/* @__PURE__ */ T("button", {
+										type: "button",
+										"aria-pressed": F === e.id,
+										onClick: () => I(F === e.id ? null : e.id),
+										className: "block max-w-full truncate text-left text-sm font-medium text-text-primary",
+										children: e.course?.title ?? "Certificate"
+									}), /* @__PURE__ */ E("div", {
+										className: "truncate text-xs text-text-muted",
+										children: ["Serial ", e.serial]
+									})]
 								})]
-							})]
-						}), /* @__PURE__ */ T("div", {
-							className: "mt-auto flex items-center justify-between border-t border-border-seam pt-3 text-xs text-text-muted",
-							children: [/* @__PURE__ */ T("span", { children: [
-								"Score ",
-								/* @__PURE__ */ w("span", {
-									className: "font-semibold text-text-primary",
-									children: e.score
-								}),
-								" ·",
-								" ",
-								o(e.issuedAt)
-							] }), e.status === "ISSUED" ? /* @__PURE__ */ T("span", {
-								className: "inline-flex items-center gap-1 rounded-full border border-status-success-border bg-status-success-bg-subtle px-2 py-0.5 font-medium text-status-success-text",
-								children: [/* @__PURE__ */ w(C, { size: 12 }), " Verified"]
-							}) : /* @__PURE__ */ w(c, { status: e.status })]
-						})]
+							}),
+							/* @__PURE__ */ E("div", {
+								className: "mt-auto flex items-center justify-between border-t border-border-seam pt-3 text-xs text-text-muted",
+								children: [/* @__PURE__ */ E("span", { children: [
+									"Score ",
+									/* @__PURE__ */ T("span", {
+										className: "font-semibold text-text-primary",
+										children: e.score
+									}),
+									" ·",
+									" ",
+									o(e.issuedAt)
+								] }), e.status === "ISSUED" ? /* @__PURE__ */ E("span", {
+									className: "inline-flex items-center gap-1 rounded-full border border-status-success-border bg-status-success-bg-subtle px-2 py-0.5 font-medium text-status-success-text",
+									children: [/* @__PURE__ */ T(w, { size: 12 }), " Verified"]
+								}) : /* @__PURE__ */ T(c, { status: e.status })]
+							}),
+							/* @__PURE__ */ T(m, {
+								serial: e.serial,
+								compact: !0
+							})
+						]
 					}, e.id))
 				})]
 			}) : null
@@ -198,6 +206,6 @@ function j() {
 	});
 }
 //#endregion
-export { j as CoursesMyLearningPagePage };
+export { M as CoursesMyLearningPagePage };
 //# sourceMappingURL=CoursesMyLearningPagePage.js.map

package/dist/technospam/pages/CoursesMyLearningPagePage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CoursesMyLearningPagePage.js","names":[],"sources":["../../../src/technospam/pages/CoursesMyLearningPagePage.tsx"],"sourcesContent":["import { createElement } from 'react';\nimport { Award, BookOpen, GraduationCap, PlayCircle, ShieldCheck } from 'lucide-react';\nimport { Button, GlassCard } from '@burdenoff/fe-libs/ui';\nimport {\n EmptyView,\n ErrorView,\n LoadingRows,\n PageLayout,\n StatCard,\n StatusBadge,\n coverGradient,\n topicIcon,\n} from '../components';\nimport { useTechnoSpamNavigate } from '../providers/TechnoSpamProvider';\nimport {\n useMyCertificatesQuery,\n useMyEnrollmentsQuery,\n type TecEnrollment,\n} from '../api/technospamApi';\nimport { formatDate, relativeTime } from '../utils/format';\nimport { cn } from '../utils/cn';\nimport {\n FOCUSED_CARD_CLASS,\n focusableCardProps,\n useFocusedRecordParam,\n} from '../hooks/useFocusedRecordParam';\nimport { FOCUS_PARAMS } from '../utils/pageContext';\nimport { resumePath } from '../utils/lessonPath';\n\nfunction EnrollmentRow({\n e,\n onOpen,\n focused,\n onToggle,\n}: {\n e: TecEnrollment;\n onOpen: () => void;\n /** The focused enrollment (`?enrollmentId=`) is the one the assistant acts on. */\n focused: boolean;\n onToggle: () => void;\n}) {\n const seed = `${e.course?.topic ?? ''} ${e.course?.title ?? 'Course'}`;\n return (\n <GlassCard\n className={cn(\n 'group flex cursor-pointer flex-col gap-3 p-4 transition-all duration-200 hover:-translate-y-0.5 hover:shadow-md sm:flex-row sm:items-center sm:gap-4',\n focused && FOCUSED_CARD_CLASS\n )}\n {...focusableCardProps(focused, onToggle)}\n >\n <span\n className={cn(\n 'flex h-12 w-12 shrink-0 items-center justify-center rounded-xl bg-gradient-to-br text-white shadow-sm transition-transform duration-200 group-hover:scale-105',\n coverGradient(seed)\n )}\n >\n {createElement(topicIcon(seed), { size: 20 })}\n </span>\n <div className=\"min-w-0 flex-1\">\n <div className=\"flex flex-wrap items-center gap-2\">\n <button\n type=\"button\"\n aria-pressed={focused}\n onClick={onToggle}\n className=\"truncate text-left text-sm font-semibold text-text-primary group-hover:text-accent-primary\"\n >\n {e.course?.title ?? 'Course'}\n </button>\n <StatusBadge status={e.status} />\n </div>\n <div className=\"mt-1 flex flex-wrap items-center gap-2 text-xs text-text-muted\">\n <span>{e.lessonsCompleted} lessons done</span>\n <span aria-hidden>·</span>\n <span>Active {relativeTime(e.lastActiveAt ?? e.startedAt)}</span>\n </div>\n <div className=\"mt-2 h-1.5 w-full overflow-hidden rounded-full bg-bg-sunken\">\n <div\n className=\"h-full rounded-full bg-gradient-to-r from-accent-primary via-accent-indigo to-accent-purple transition-all duration-500\"\n style={{ width: `${e.progressPct}%` }}\n />\n </div>\n </div>\n <div className=\"flex items-center justify-between gap-3 sm:flex-col sm:items-end sm:justify-center\">\n <div className=\"text-lg font-semibold tabular-nums text-text-primary\">{e.progressPct}%</div>\n <Button variant=\"ghost\" size=\"sm\" onClick={onOpen} data-testid={`resume-${e.courseId}`}>\n <PlayCircle size={15} /> Resume\n </Button>\n </div>\n </GlassCard>\n );\n}\n\n// Stable sibling lists: focusing an enrollment clears a focused certificate and vice versa.\nconst CERTIFICATE_SIBLING = [FOCUS_PARAMS.certificate] as const;\nconst ENROLLMENT_SIBLING = [FOCUS_PARAMS.enrollment] as const;\n\nexport function CoursesMyLearningPagePage() {\n const navigate = useTechnoSpamNavigate();\n\n // BOFF-10481: the learner's own enrollments and certificates come from the\n // canonical, self-scoped Buildmyiq fields. The previous cross-learner\n // `tecListEnrollments` / list-all reads needed an instructor permission a\n // plain learner does not hold. Each enrollment carries its next lesson, so\n // \"Resume\" (BOFF-4107) deep-links into the next incomplete lesson.\n const { enrollments, loading, error } = useMyEnrollmentsQuery();\n const { certificates } = useMyCertificatesQuery();\n // The focused enrollment / certificate live in the URL so the assistant's\n // page context names them (\"how far am I in this course?\").\n const [focusedEnrollmentId, setFocusedEnrollmentId] = useFocusedRecordParam(\n FOCUS_PARAMS.enrollment,\n CERTIFICATE_SIBLING\n );\n const [focusedCertificateId, setFocusedCertificateId] = useFocusedRecordParam(\n FOCUS_PARAMS.certificate,\n ENROLLMENT_SIBLING\n );\n\n const completed = enrollments.filter((e) => e.status === 'COMPLETED').length;\n const inProgress = enrollments.filter(\n (e) => e.status === 'IN_PROGRESS' \|\| e.status === 'ENROLLED'\n ).length;\n\n return (\n <PageLayout\n hero\n title=\"My Learning\"\n description=\"Track your enrolled courses, progress, and earned certificates.\"\n actions={\n <Button variant=\"outline\" onClick={() => navigate('/courses/courses-page')}>\n <BookOpen size={16} /> Browse catalog\n </Button>\n }\n >\n <div className=\"mb-6 grid grid-cols-2 gap-3 sm:grid-cols-4\">\n <StatCard\n label=\"Enrolled\"\n value={enrollments.length}\n hint=\"Courses you've enrolled in\"\n icon={BookOpen}\n tone=\"blue\"\n />\n <StatCard\n label=\"In progress\"\n value={inProgress}\n hint=\"Courses in progress\"\n icon={PlayCircle}\n tone=\"indigo\"\n />\n <StatCard\n label=\"Completed\"\n value={completed}\n hint=\"Courses completed\"\n icon={GraduationCap}\n tone=\"green\"\n />\n <StatCard\n label=\"Certificates\"\n value={certificates.length}\n hint=\"Certificates earned\"\n icon={Award}\n tone=\"purple\"\n />\n </div>\n\n {loading && !enrollments.length ? (\n <LoadingRows count={3} height=\"h-24\" />\n ) : error ? (\n <ErrorView title=\"Couldn't load your learning\" error={error} />\n ) : enrollments.length === 0 ? (\n <EmptyView\n icon={<BookOpen size={26} />}\n title=\"You haven't enrolled yet\"\n description=\"Browse the catalog and enroll in a course to start building skill by doing.\"\n action={<Button onClick={() => navigate('/courses/courses-page')}>Browse courses</Button>}\n />\n ) : (\n <div className=\"space-y-3\">\n {enrollments.map((e) => (\n <EnrollmentRow\n key={e.id}\n e={e}\n onOpen={() => navigate(resumePath(e.courseId, e.nextLessonId))}\n focused={focusedEnrollmentId === e.id}\n onToggle={() => setFocusedEnrollmentId(focusedEnrollmentId === e.id ? null : e.id)}\n />\n ))}\n </div>\n )}\n\n {certificates.length > 0 ? (\n <div className=\"mt-8\">\n <h2 className=\"mb-3 flex items-center gap-2 text-base font-semibold text-text-primary\">\n <Award size={18} className=\"text-accent-teal\" /> Certificates\n </h2>\n <div className=\"grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-3\">\n {certificates.map((c) => (\n <GlassCard\n key={c.id}\n className={cn(\n 'group flex cursor-pointer flex-col gap-3 p-4 transition-all duration-200 hover:-translate-y-1 hover:shadow-lg',\n focusedCertificateId === c.id && FOCUSED_CARD_CLASS\n )}\n {...focusableCardProps(focusedCertificateId === c.id, () =>\n setFocusedCertificateId(focusedCertificateId === c.id ? null : c.id)\n )}\n >\n <div className=\"flex items-center gap-3\">\n <span className=\"flex h-11 w-11 shrink-0 items-center justify-center rounded-xl bg-status-warning-bg-subtle text-status-warning-text ring-1 ring-status-warning-border/30 transition-transform duration-200 group-hover:scale-105\">\n <Award size={22} />\n </span>\n <div className=\"min-w-0\">\n <button\n type=\"button\"\n aria-pressed={focusedCertificateId === c.id}\n onClick={() =>\n setFocusedCertificateId(focusedCertificateId === c.id ? null : c.id)\n }\n className=\"block max-w-full truncate text-left text-sm font-medium text-text-primary\"\n >\n {c.course?.title ?? 'Certificate'}\n </button>\n <div className=\"truncate text-xs text-text-muted\">Serial {c.serial}</div>\n </div>\n </div>\n <div className=\"mt-auto flex items-center justify-between border-t border-border-seam pt-3 text-xs text-text-muted\">\n <span>\n Score <span className=\"font-semibold text-text-primary\">{c.score}</span> ·{' '}\n {formatDate(c.issuedAt)}\n </span>\n {c.status === 'ISSUED' ? (\n <span className=\"inline-flex items-center gap-1 rounded-full border border-status-success-border bg-status-success-bg-subtle px-2 py-0.5 font-medium text-status-success-text\">\n <ShieldCheck size={12} /> Verified\n </span>\n ) : (\n <StatusBadge status={c.status} />\n )}\n </div>\n </GlassCard>\n ))}\n </div>\n </div>\n ) : null}\n </PageLayout>\n );\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"CoursesMyLearningPagePage.js","names":[],"sources":["../../../src/technospam/pages/CoursesMyLearningPagePage.tsx"],"sourcesContent":["import { createElement } from 'react';\nimport { Award, BookOpen, GraduationCap, PlayCircle, ShieldCheck } from 'lucide-react';\nimport { Button, GlassCard } from '@burdenoff/fe-libs/ui';\nimport {\n CertificateVerifyLink,\n EmptyView,\n ErrorView,\n LoadingRows,\n PageLayout,\n StatCard,\n StatusBadge,\n coverGradient,\n topicIcon,\n} from '../components';\nimport { useTechnoSpamNavigate } from '../providers/TechnoSpamProvider';\nimport {\n useMyCertificatesQuery,\n useMyEnrollmentsQuery,\n type TecEnrollment,\n} from '../api/technospamApi';\nimport { formatDate, relativeTime } from '../utils/format';\nimport { cn } from '../utils/cn';\nimport {\n FOCUSED_CARD_CLASS,\n focusableCardProps,\n useFocusedRecordParam,\n} from '../hooks/useFocusedRecordParam';\nimport { FOCUS_PARAMS } from '../utils/pageContext';\nimport { resumePath } from '../utils/lessonPath';\n\nfunction EnrollmentRow({\n e,\n onOpen,\n focused,\n onToggle,\n}: {\n e: TecEnrollment;\n onOpen: () => void;\n /** The focused enrollment (`?enrollmentId=`) is the one the assistant acts on. */\n focused: boolean;\n onToggle: () => void;\n}) {\n const seed = `${e.course?.topic ?? ''} ${e.course?.title ?? 'Course'}`;\n return (\n <GlassCard\n className={cn(\n 'group flex cursor-pointer flex-col gap-3 p-4 transition-all duration-200 hover:-translate-y-0.5 hover:shadow-md sm:flex-row sm:items-center sm:gap-4',\n focused && FOCUSED_CARD_CLASS\n )}\n {...focusableCardProps(focused, onToggle)}\n >\n <span\n className={cn(\n 'flex h-12 w-12 shrink-0 items-center justify-center rounded-xl bg-gradient-to-br text-white shadow-sm transition-transform duration-200 group-hover:scale-105',\n coverGradient(seed)\n )}\n >\n {createElement(topicIcon(seed), { size: 20 })}\n </span>\n <div className=\"min-w-0 flex-1\">\n <div className=\"flex flex-wrap items-center gap-2\">\n <button\n type=\"button\"\n aria-pressed={focused}\n onClick={onToggle}\n className=\"truncate text-left text-sm font-semibold text-text-primary group-hover:text-accent-primary\"\n >\n {e.course?.title ?? 'Course'}\n </button>\n <StatusBadge status={e.status} />\n </div>\n <div className=\"mt-1 flex flex-wrap items-center gap-2 text-xs text-text-muted\">\n <span>{e.lessonsCompleted} lessons done</span>\n <span aria-hidden>·</span>\n <span>Active {relativeTime(e.lastActiveAt ?? e.startedAt)}</span>\n </div>\n <div className=\"mt-2 h-1.5 w-full overflow-hidden rounded-full bg-bg-sunken\">\n <div\n className=\"h-full rounded-full bg-gradient-to-r from-accent-primary via-accent-indigo to-accent-purple transition-all duration-500\"\n style={{ width: `${e.progressPct}%` }}\n />\n </div>\n </div>\n <div className=\"flex items-center justify-between gap-3 sm:flex-col sm:items-end sm:justify-center\">\n <div className=\"text-lg font-semibold tabular-nums text-text-primary\">{e.progressPct}%</div>\n <Button variant=\"ghost\" size=\"sm\" onClick={onOpen} data-testid={`resume-${e.courseId}`}>\n <PlayCircle size={15} /> Resume\n </Button>\n </div>\n </GlassCard>\n );\n}\n\n// Stable sibling lists: focusing an enrollment clears a focused certificate and vice versa.\nconst CERTIFICATE_SIBLING = [FOCUS_PARAMS.certificate] as const;\nconst ENROLLMENT_SIBLING = [FOCUS_PARAMS.enrollment] as const;\n\nexport function CoursesMyLearningPagePage() {\n const navigate = useTechnoSpamNavigate();\n\n // BOFF-10481: the learner's own enrollments and certificates come from the\n // canonical, self-scoped Buildmyiq fields. The previous cross-learner\n // `tecListEnrollments` / list-all reads needed an instructor permission a\n // plain learner does not hold. Each enrollment carries its next lesson, so\n // \"Resume\" (BOFF-4107) deep-links into the next incomplete lesson.\n const { enrollments, loading, error } = useMyEnrollmentsQuery();\n const { certificates } = useMyCertificatesQuery();\n // The focused enrollment / certificate live in the URL so the assistant's\n // page context names them (\"how far am I in this course?\").\n const [focusedEnrollmentId, setFocusedEnrollmentId] = useFocusedRecordParam(\n FOCUS_PARAMS.enrollment,\n CERTIFICATE_SIBLING\n );\n const [focusedCertificateId, setFocusedCertificateId] = useFocusedRecordParam(\n FOCUS_PARAMS.certificate,\n ENROLLMENT_SIBLING\n );\n\n const completed = enrollments.filter((e) => e.status === 'COMPLETED').length;\n const inProgress = enrollments.filter(\n (e) => e.status === 'IN_PROGRESS' \|\| e.status === 'ENROLLED'\n ).length;\n\n return (\n <PageLayout\n hero\n title=\"My Learning\"\n description=\"Track your enrolled courses, progress, and earned certificates.\"\n actions={\n <Button variant=\"outline\" onClick={() => navigate('/courses/courses-page')}>\n <BookOpen size={16} /> Browse catalog\n </Button>\n }\n >\n <div className=\"mb-6 grid grid-cols-2 gap-3 sm:grid-cols-4\">\n <StatCard\n label=\"Enrolled\"\n value={enrollments.length}\n hint=\"Courses you've enrolled in\"\n icon={BookOpen}\n tone=\"blue\"\n />\n <StatCard\n label=\"In progress\"\n value={inProgress}\n hint=\"Courses in progress\"\n icon={PlayCircle}\n tone=\"indigo\"\n />\n <StatCard\n label=\"Completed\"\n value={completed}\n hint=\"Courses completed\"\n icon={GraduationCap}\n tone=\"green\"\n />\n <StatCard\n label=\"Certificates\"\n value={certificates.length}\n hint=\"Certificates earned\"\n icon={Award}\n tone=\"purple\"\n />\n </div>\n\n {loading && !enrollments.length ? (\n <LoadingRows count={3} height=\"h-24\" />\n ) : error ? (\n <ErrorView title=\"Couldn't load your learning\" error={error} />\n ) : enrollments.length === 0 ? (\n <EmptyView\n icon={<BookOpen size={26} />}\n title=\"You haven't enrolled yet\"\n description=\"Browse the catalog and enroll in a course to start building skill by doing.\"\n action={<Button onClick={() => navigate('/courses/courses-page')}>Browse courses</Button>}\n />\n ) : (\n <div className=\"space-y-3\">\n {enrollments.map((e) => (\n <EnrollmentRow\n key={e.id}\n e={e}\n onOpen={() => navigate(resumePath(e.courseId, e.nextLessonId))}\n focused={focusedEnrollmentId === e.id}\n onToggle={() => setFocusedEnrollmentId(focusedEnrollmentId === e.id ? null : e.id)}\n />\n ))}\n </div>\n )}\n\n {certificates.length > 0 ? (\n <div className=\"mt-8\">\n <h2 className=\"mb-3 flex items-center gap-2 text-base font-semibold text-text-primary\">\n <Award size={18} className=\"text-accent-teal\" /> Certificates\n </h2>\n <div className=\"grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-3\">\n {certificates.map((c) => (\n <GlassCard\n key={c.id}\n className={cn(\n 'group flex cursor-pointer flex-col gap-3 p-4 transition-all duration-200 hover:-translate-y-1 hover:shadow-lg',\n focusedCertificateId === c.id && FOCUSED_CARD_CLASS\n )}\n {...focusableCardProps(focusedCertificateId === c.id, () =>\n setFocusedCertificateId(focusedCertificateId === c.id ? null : c.id)\n )}\n >\n <div className=\"flex items-center gap-3\">\n <span className=\"flex h-11 w-11 shrink-0 items-center justify-center rounded-xl bg-status-warning-bg-subtle text-status-warning-text ring-1 ring-status-warning-border/30 transition-transform duration-200 group-hover:scale-105\">\n <Award size={22} />\n </span>\n <div className=\"min-w-0\">\n <button\n type=\"button\"\n aria-pressed={focusedCertificateId === c.id}\n onClick={() =>\n setFocusedCertificateId(focusedCertificateId === c.id ? null : c.id)\n }\n className=\"block max-w-full truncate text-left text-sm font-medium text-text-primary\"\n >\n {c.course?.title ?? 'Certificate'}\n </button>\n <div className=\"truncate text-xs text-text-muted\">Serial {c.serial}</div>\n </div>\n </div>\n <div className=\"mt-auto flex items-center justify-between border-t border-border-seam pt-3 text-xs text-text-muted\">\n <span>\n Score <span className=\"font-semibold text-text-primary\">{c.score}</span> ·{' '}\n {formatDate(c.issuedAt)}\n </span>\n {c.status === 'ISSUED' ? (\n <span className=\"inline-flex items-center gap-1 rounded-full border border-status-success-border bg-status-success-bg-subtle px-2 py-0.5 font-medium text-status-success-text\">\n <ShieldCheck size={12} /> Verified\n </span>\n ) : (\n <StatusBadge status={c.status} />\n )}\n </div>\n <CertificateVerifyLink serial={c.serial} compact />\n </GlassCard>\n ))}\n </div>\n </div>\n ) : null}\n </PageLayout>\n );\n}\n"],"mappings":"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"}

package/dist/technospam/pages/public/CertificateVerifyPage.d.ts ADDED Viewed

@@ -0,0 +1,4 @@
+export declare function CertificateVerifyPage({ apiGatewayUrl }?: {
+    apiGatewayUrl?: string;
+}): import("react").JSX.Element;
+//# sourceMappingURL=CertificateVerifyPage.d.ts.map

package/dist/technospam/pages/public/CertificateVerifyPage.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"CertificateVerifyPage.d.ts","sourceRoot":"","sources":["../../../../src/technospam/pages/public/CertificateVerifyPage.tsx"],"names":[],"mappings":"AA2IA,wBAAgB,qBAAqB,CAAC,EAAE,aAAa,EAAE,GAAE;IAAE,aAAa,CAAC,EAAE,MAAM,CAAA;CAAO,+BAiBvF"}

package/dist/technospam/pages/public/CertificateVerifyPage.js ADDED Viewed

@@ -0,0 +1,257 @@
+import { formatDate as e, formatDateTime as t, humanizeEnum as n } from "../../utils/format.js";
+import { certificateVerifyPath as r, fetchCertificateVerification as i, isPlausibleSerial as a, normalizeSerial as o } from "../../lib/certificateVerify.js";
+import { useState as s } from "react";
+import { Award as c, ShieldAlert as l, ShieldCheck as u, ShieldQuestion as d } from "lucide-react";
+import { useNavigate as f, useParams as p } from "react-router";
+import { QueryClient as m, QueryClientProvider as h, useQuery as g } from "@tanstack/react-query";
+import { Fragment as _, jsx as v, jsxs as y } from "react/jsx-runtime";
+import { Button as b, GlassCard as x, Input as S, Label as C, Skeleton as w } from "@burdenoff/fe-libs/ui";
+//#region src/technospam/pages/public/CertificateVerifyPage.tsx
+function T({ verification: t }) {
+	return t.status === "VALID" ? /* @__PURE__ */ y("div", {
+		className: "flex items-start gap-3 rounded-xl border border-status-success-border bg-status-success-bg-subtle p-4 text-status-success-text",
+		"data-testid": "tec-verify-status",
+		"data-status": "VALID",
+		children: [/* @__PURE__ */ v(u, {
+			size: 22,
+			className: "mt-0.5 shrink-0"
+		}), /* @__PURE__ */ y("div", { children: [/* @__PURE__ */ v("div", {
+			className: "text-base font-semibold",
+			children: "Valid certificate"
+		}), /* @__PURE__ */ y("p", {
+			className: "text-sm",
+			children: [
+				"This serial belongs to a certificate issued by ",
+				t.issuer,
+				" that has not been revoked."
+			]
+		})] })]
+	}) : t.status === "REVOKED" ? /* @__PURE__ */ y("div", {
+		className: "flex items-start gap-3 rounded-xl border border-status-error-border bg-status-error-bg-subtle p-4 text-status-error-text",
+		"data-testid": "tec-verify-status",
+		"data-status": "REVOKED",
+		children: [/* @__PURE__ */ v(l, {
+			size: 22,
+			className: "mt-0.5 shrink-0"
+		}), /* @__PURE__ */ y("div", { children: [/* @__PURE__ */ v("div", {
+			className: "text-base font-semibold",
+			children: "Revoked certificate"
+		}), /* @__PURE__ */ y("p", {
+			className: "text-sm",
+			children: [
+				"This certificate was issued by ",
+				t.issuer,
+				" but has since been revoked",
+				t.revokedAt ? ` (on ${e(t.revokedAt)})` : "",
+				". It should not be relied on."
+			]
+		})] })]
+	}) : /* @__PURE__ */ y("div", {
+		className: "flex items-start gap-3 rounded-xl border border-status-warning-border bg-status-warning-bg-subtle p-4 text-status-warning-text",
+		"data-testid": "tec-verify-status",
+		"data-status": "NOT_FOUND",
+		children: [/* @__PURE__ */ v(d, {
+			size: 22,
+			className: "mt-0.5 shrink-0"
+		}), /* @__PURE__ */ y("div", { children: [/* @__PURE__ */ v("div", {
+			className: "text-base font-semibold",
+			children: "No certificate found"
+		}), /* @__PURE__ */ y("p", {
+			className: "text-sm",
+			children: [
+				"No ",
+				t.issuer,
+				" certificate carries this serial. Check that it was copied exactly as printed on the certificate."
+			]
+		})] })]
+	});
+}
+function E({ label: e, value: t, testId: n }) {
+	return /* @__PURE__ */ y("div", {
+		className: "min-w-0",
+		children: [/* @__PURE__ */ v("dt", {
+			className: "text-[11px] font-medium uppercase tracking-wide text-text-muted",
+			children: e
+		}), /* @__PURE__ */ v("dd", {
+			className: "truncate text-sm text-text-primary",
+			"data-testid": n,
+			children: t
+		})]
+	});
+}
+function D({ verification: r }) {
+	let i = r.status !== "NOT_FOUND";
+	return /* @__PURE__ */ y("div", {
+		className: "space-y-4",
+		"data-testid": "tec-verify-result",
+		children: [
+			/* @__PURE__ */ v(T, { verification: r }),
+			/* @__PURE__ */ y("dl", {
+				className: "grid grid-cols-1 gap-4 sm:grid-cols-2",
+				children: [
+					/* @__PURE__ */ v(E, {
+						label: "Serial number",
+						value: r.serial,
+						testId: "tec-verify-serial"
+					}),
+					i ? /* @__PURE__ */ y(_, { children: [
+						/* @__PURE__ */ v(E, {
+							label: "Course",
+							value: r.courseTitle ?? "—",
+							testId: "tec-verify-course"
+						}),
+						/* @__PURE__ */ v(E, {
+							label: "Level",
+							value: r.courseLevel ? n(r.courseLevel) : "—",
+							testId: "tec-verify-level"
+						}),
+						/* @__PURE__ */ v(E, {
+							label: "Final score",
+							value: r.score === null ? "—" : `${r.score} / 100`,
+							testId: "tec-verify-score"
+						}),
+						/* @__PURE__ */ v(E, {
+							label: "Issued on",
+							value: r.issuedAt ? e(r.issuedAt) : "—",
+							testId: "tec-verify-issued"
+						})
+					] }) : null,
+					/* @__PURE__ */ v(E, {
+						label: "Checked at",
+						value: t(r.verifiedAt),
+						testId: "tec-verify-checked"
+					})
+				]
+			}),
+			/* @__PURE__ */ v("p", {
+				className: "text-xs text-text-muted",
+				children: "For privacy, verification confirms the course, score, dates and status only. It never shows the learner's name or contact details; compare them against the certificate the candidate shared with you."
+			})
+		]
+	});
+}
+function O({ apiGatewayUrl: e } = {}) {
+	let { serial: t } = p(), n = o(t), [r] = s(() => new m({ defaultOptions: { queries: {
+		retry: !1,
+		refetchOnWindowFocus: !1
+	} } }));
+	return /* @__PURE__ */ v(h, {
+		client: r,
+		children: /* @__PURE__ */ v(k, {
+			serial: n,
+			apiGatewayUrl: e
+		}, n)
+	});
+}
+function k({ serial: e, apiGatewayUrl: t }) {
+	let n = f(), [l, u] = s(e), d = g({
+		queryKey: [
+			"tecVerifyCertificate",
+			t ?? "",
+			e
+		],
+		queryFn: () => i(t, e),
+		enabled: e.length > 0,
+		staleTime: 0,
+		gcTime: 0
+	}), p = d.data, m = e.length > 0 && (d.isPending || d.isFetching), h = d.isError || p?.kind === "error", _ = o(l), T = a(_);
+	return /* @__PURE__ */ y("main", {
+		className: "mx-auto flex w-full max-w-2xl flex-col gap-6 px-4 py-10 sm:py-16",
+		children: [/* @__PURE__ */ y("header", {
+			className: "space-y-2 text-center",
+			children: [
+				/* @__PURE__ */ y("div", {
+					className: "inline-flex items-center gap-2 text-xs font-semibold uppercase tracking-[0.2em] text-text-muted",
+					children: [/* @__PURE__ */ v(c, {
+						size: 14,
+						className: "text-status-warning-text"
+					}), " TechnoSpam"]
+				}),
+				/* @__PURE__ */ v("h1", {
+					className: "text-2xl font-bold text-text-primary sm:text-3xl",
+					children: "Verify a certificate"
+				}),
+				/* @__PURE__ */ v("p", {
+					className: "text-sm text-text-secondary",
+					children: "Confirm that a TechnoSpam certificate is genuine and still valid. No account is needed."
+				})
+			]
+		}), /* @__PURE__ */ y(x, {
+			className: "space-y-6 p-5 sm:p-6",
+			children: [
+				/* @__PURE__ */ y("form", {
+					className: "flex flex-col gap-2",
+					onSubmit: (t) => {
+						if (t.preventDefault(), T) {
+							if (_ === e) {
+								d.refetch();
+								return;
+							}
+							n(r(_));
+						}
+					},
+					role: "search",
+					children: [
+						/* @__PURE__ */ v(C, {
+							htmlFor: "tec-verify-input",
+							children: "Certificate serial number"
+						}),
+						/* @__PURE__ */ y("div", {
+							className: "flex flex-col gap-2 sm:flex-row",
+							children: [/* @__PURE__ */ v(S, {
+								id: "tec-verify-input",
+								"data-testid": "tec-verify-input",
+								value: l,
+								onChange: (e) => u(e.target.value),
+								placeholder: "TEC-XXXXXXXX-XXXXXXXX",
+								autoComplete: "off",
+								spellCheck: !1,
+								className: "font-mono"
+							}), /* @__PURE__ */ v(b, {
+								type: "submit",
+								disabled: !T,
+								"data-testid": "tec-verify-submit",
+								children: "Verify"
+							})]
+						}),
+						l.trim() && !T ? /* @__PURE__ */ v("p", {
+							className: "text-xs text-status-error-text",
+							children: "A serial uses only letters, digits, dots, underscores and hyphens."
+						}) : null
+					]
+				}),
+				m ? /* @__PURE__ */ y("div", {
+					className: "space-y-3",
+					"aria-busy": "true",
+					"aria-live": "polite",
+					children: [/* @__PURE__ */ v(w, { className: "h-16 w-full" }), /* @__PURE__ */ v(w, { className: "h-24 w-full" })]
+				}) : null,
+				!m && p?.kind === "result" ? /* @__PURE__ */ v(D, { verification: p.verification }) : null,
+				!m && p?.kind === "invalid" ? /* @__PURE__ */ v("p", {
+					className: "text-sm text-status-error-text",
+					"data-testid": "tec-verify-invalid",
+					children: "That does not look like a certificate serial. Check it against the certificate."
+				}) : null,
+				!m && h ? /* @__PURE__ */ y("div", {
+					className: "flex flex-col items-start gap-2",
+					"data-testid": "tec-verify-error",
+					children: [/* @__PURE__ */ v("p", {
+						className: "text-sm text-status-error-text",
+						children: "The verification service could not be reached. Please try again."
+					}), /* @__PURE__ */ v(b, {
+						size: "sm",
+						variant: "outline",
+						onClick: () => {
+							d.refetch();
+						},
+						children: "Try again"
+					})]
+				}) : null
+			]
+		})]
+	});
+}
+//#endregion
+export { O as CertificateVerifyPage };
+//# sourceMappingURL=CertificateVerifyPage.js.map