@burdenoff/microfe-technospam 2026.1101.4 → 2026.1101.5

package/dist/technospam/pages/CoursesCourseDetailsPagePage.js

@@ -4,135 +4,139 @@ import { cn as r } from "../utils/cn.js";
 import { PageLayout as i } from "../components/PageLayout.js";
 import { StatCard as a } from "../components/StatCard.js";
 import { MediaCover as o, topicIcon as s } from "../components/MediaCover.js";
-import { formatDate as c, formatDuration as l, humanizeEnum as u } from "../utils/format.js";
-import { PremiumBadge as d, UpgradeGate as f } from "../components/UpgradeGate.js";
-import { EmptyView as ee, ErrorView as te } from "../components/StateViews.js";
-import { TagStrip as ne } from "../components/TagStrip.js";
-import { notify as p } from "../lib/toast.js";
-import { useCourseQuery as re, useEnroll as ie, useIssueCertificate as ae, useMyCertificatesQuery as oe } from "../api/technospamApi.js";
+import { formatDate as c, formatDuration as ee, humanizeEnum as l } from "../utils/format.js";
+import { PremiumBadge as u, UpgradeGate as d } from "../components/UpgradeGate.js";
+import { EmptyView as te, ErrorView as ne } from "../components/StateViews.js";
+import { TagStrip as re } from "../components/TagStrip.js";
+import { notify as f } from "../lib/toast.js";
+import { useCourseQuery as ie, useEnroll as ae, useIssueCertificate as oe, useMyCertificatesQuery as se } from "../api/technospamApi.js";
 import "../components/index.js";
-import { FOCUS_PARAMS as se } from "../utils/pageContext.js";
-import { lessonPlayerPath as ce } from "../utils/lessonPath.js";
-import { useFocusedRecordParam as m } from "../hooks/useFocusedRecordParam.js";
-import { useEffect as le } from "react";
-import { ArrowRight as h, Award as g, BookOpen as _, CheckCircle2 as v, ChevronDown as y, Clock as b, Eye as x, FileText as S, Layers as C, Lock as w, PlayCircle as T, ShieldCheck as E, Sparkles as D, TrendingUp as O, Trophy as k, Users as A } from "lucide-react";
-import { useSearchParams as ue } from "react-router";
-import { jsx as j, jsxs as M } from "react/jsx-runtime";
-import { Button as N, GlassCard as P, Skeleton as F } from "@burdenoff/fe-libs/ui";
+import { offlineScope as ce, readSavedCourseOutline as le } from "../lib/offlineLessons.js";
+import { useOnlineStatus as ue, usePurgeOtherUsersLessons as de } from "../hooks/useOfflineLessons.js";
+import { FOCUS_PARAMS as fe } from "../utils/pageContext.js";
+import { lessonPlayerPath as p } from "../utils/lessonPath.js";
+import { useFocusedRecordParam as pe } from "../hooks/useFocusedRecordParam.js";
+import { SaveCourseOffline as me } from "../components/lesson/SaveCourseOffline.js";
+import { SavedCourseOutline as he } from "../components/lesson/SavedCourseOutline.js";
+import { useEffect as m, useMemo as ge, useRef as _e } from "react";
+import { ArrowRight as ve, Award as h, BookOpen as g, CheckCircle2 as _, ChevronDown as v, Clock as y, Eye as b, FileText as x, Layers as S, Lock as C, PlayCircle as w, ShieldCheck as T, Sparkles as E, TrendingUp as D, Trophy as O, Users as ye } from "lucide-react";
+import { useSearchParams as be } from "react-router";
+import { jsx as k, jsxs as A } from "react/jsx-runtime";
+import { Button as j, GlassCard as M, Skeleton as N } from "@burdenoff/fe-libs/ui";
 //#region src/technospam/pages/CoursesCourseDetailsPagePage.tsx
-var I = {
+var P = {
 	VIDEO: {
-		icon: T,
+		icon: w,
 		chip: "bg-accent-primary/15 text-accent-primary",
 		badge: "border-accent-primary/25 bg-accent-primary/6 text-accent-primary"
 	},
 	ARTICLE: {
-		icon: S,
+		icon: x,
 		chip: "bg-accent-indigo/15 text-accent-indigo",
 		badge: "border-accent-indigo/25 bg-accent-indigo/10 text-accent-indigo"
 	},
 	INTERACTIVE: {
-		icon: D,
+		icon: E,
 		chip: "bg-accent-teal/15 text-accent-teal",
 		badge: "border-accent-teal/25 bg-accent-teal/10 text-accent-teal"
 	},
 	QUIZ: {
-		icon: v,
+		icon: _,
 		chip: "bg-accent-purple/15 text-accent-purple",
 		badge: "border-accent-purple/25 bg-accent-purple/10 text-accent-purple"
 	},
 	PROJECT: {
-		icon: C,
+		icon: S,
 		chip: "bg-status-warning-bg-subtle text-status-warning-text",
 		badge: "border-status-warning-border bg-status-warning-bg-subtle text-status-warning-text"
 	}
 };
-function L({ icon: e, children: t }) {
-	return /* @__PURE__ */ M("span", {
+function F({ icon: e, children: t }) {
+	return /* @__PURE__ */ A("span", {
 		className: "inline-flex items-center gap-1 rounded-full bg-white/15 px-2.5 py-1 text-xs font-medium text-white ring-1 ring-white/25 backdrop-blur-sm",
-		children: [e ? /* @__PURE__ */ j(e, { size: 12 }) : null, t]
+		children: [e ? /* @__PURE__ */ k(e, { size: 12 }) : null, t]
 	});
 }
-function de({ lesson: e, index: t, done: n, open: i, onToggle: a, onStart: o }) {
-	let s = I[e.kind] ?? I.ARTICLE, c = s.icon, d = `tec-lesson-body-${e.id}`;
-	return /* @__PURE__ */ M("div", {
+function xe({ lesson: e, index: t, done: n, open: i, onToggle: a, onStart: o }) {
+	let s = P[e.kind] ?? P.ARTICLE, c = s.icon, u = `tec-lesson-body-${e.id}`;
+	return /* @__PURE__ */ A("div", {
 		className: "border-b border-border-seam last:border-b-0",
-		children: [/* @__PURE__ */ M("button", {
+		children: [/* @__PURE__ */ A("button", {
 			type: "button",
 			onClick: a,
 			"aria-expanded": i,
-			"aria-controls": d,
+			"aria-controls": u,
 			className: "group flex w-full items-center gap-3 rounded-xl px-2 py-3 text-left transition-colors hover:bg-bg-sunken/60",
 			children: [
-				/* @__PURE__ */ j("span", {
+				/* @__PURE__ */ k("span", {
 					className: "hidden w-6 shrink-0 text-center text-sm font-medium tabular-nums text-text-muted sm:block",
 					children: t + 1
 				}),
-				/* @__PURE__ */ j("span", {
+				/* @__PURE__ */ k("span", {
 					className: r("flex h-9 w-9 shrink-0 items-center justify-center rounded-lg", n ? "bg-status-success-bg-subtle text-status-success-text" : s.chip),
-					children: j(n ? v : c, { size: 17 })
+					children: k(n ? _ : c, { size: 17 })
 				}),
-				/* @__PURE__ */ M("div", {
+				/* @__PURE__ */ A("div", {
 					className: "min-w-0 flex-1",
-					children: [/* @__PURE__ */ j("span", {
+					children: [/* @__PURE__ */ k("span", {
 						className: "block truncate text-sm font-medium text-text-primary",
 						children: e.title
-					}), /* @__PURE__ */ M("div", {
+					}), /* @__PURE__ */ A("div", {
 						className: "mt-1 flex flex-wrap items-center gap-2",
-						children: [/* @__PURE__ */ j("span", {
+						children: [/* @__PURE__ */ k("span", {
 							className: r("inline-flex items-center rounded-full border px-2 py-0.5 text-[11px] font-medium", s.badge),
-							children: u(e.kind)
-						}), /* @__PURE__ */ M("span", {
+							children: l(e.kind)
+						}), /* @__PURE__ */ A("span", {
 							className: "inline-flex items-center gap-1 text-xs text-text-muted",
 							children: [
-								/* @__PURE__ */ j(b, { size: 12 }),
+								/* @__PURE__ */ k(y, { size: 12 }),
 								" ",
-								l(e.estimatedMinutes)
+								ee(e.estimatedMinutes)
 							]
 						})]
 					})]
 				}),
-				/* @__PURE__ */ M("div", {
+				/* @__PURE__ */ A("div", {
 					className: "flex shrink-0 items-center gap-2",
-					children: [n ? /* @__PURE__ */ j(v, {
+					children: [n ? /* @__PURE__ */ k(_, {
 						size: 18,
 						className: "text-status-success-text"
-					}) : e.isPreview ? /* @__PURE__ */ M("span", {
+					}) : e.isPreview ? /* @__PURE__ */ A("span", {
 						className: "inline-flex items-center gap-1 rounded-full border border-accent-primary/30 bg-accent-primary/6 px-2 py-0.5 text-[11px] font-medium text-accent-primary",
-						children: [/* @__PURE__ */ j(x, { size: 12 }), " Preview"]
-					}) : e.isLocked ? /* @__PURE__ */ M("span", {
+						children: [/* @__PURE__ */ k(b, { size: 12 }), " Preview"]
+					}) : e.isLocked ? /* @__PURE__ */ A("span", {
 						className: "inline-flex items-center gap-1 rounded-full border border-status-warning-border/60 bg-status-warning-bg-subtle px-2 py-0.5 text-[11px] font-medium text-status-warning-text",
-						children: [/* @__PURE__ */ j(w, { size: 12 }), " Upgrade to unlock"]
-					}) : /* @__PURE__ */ j(w, {
+						children: [/* @__PURE__ */ k(C, { size: 12 }), " Upgrade to unlock"]
+					}) : /* @__PURE__ */ k(C, {
 						size: 15,
 						className: "text-text-muted"
-					}), /* @__PURE__ */ j(y, {
+					}), /* @__PURE__ */ k(v, {
 						size: 16,
 						"aria-hidden": !0,
 						className: r("text-text-muted transition-transform duration-200", i ? "rotate-180" : "")
 					})]
 				})
 			]
-		}), i ? /* @__PURE__ */ j("div", {
-			id: d,
+		}), i ? /* @__PURE__ */ k("div", {
+			id: u,
 			className: "px-2 pb-4 sm:pl-11",
-			children: e.isLocked ? /* @__PURE__ */ j(f, {
+			children: e.isLocked ? /* @__PURE__ */ k(d, {
 				compact: !0,
 				description: "This lesson is part of a paid TechnoSpam plan — its content unlocks once your workspace upgrades."
-			}) : /* @__PURE__ */ M("div", {
+			}) : /* @__PURE__ */ A("div", {
 				className: "space-y-3",
-				children: [e.content ? /* @__PURE__ */ j("div", {
+				children: [e.content ? /* @__PURE__ */ k("div", {
 					className: "rounded-xl border border-border-seam bg-bg-sunken p-4",
-					children: /* @__PURE__ */ j("p", {
+					children: /* @__PURE__ */ k("p", {
 						className: "line-clamp-6 whitespace-pre-wrap text-sm leading-relaxed text-text-secondary",
 						children: e.content
 					})
-				}) : null, /* @__PURE__ */ M(N, {
+				}) : null, /* @__PURE__ */ A(j, {
 					size: "sm",
 					onClick: o,
 					"data-testid": `open-lesson-${e.id}`,
 					children: [
-						/* @__PURE__ */ j(T, { size: 15 }),
+						/* @__PURE__ */ k(w, { size: 15 }),
 						" ",
 						n ? "Review lesson" : "Start lesson"
 					]
@@ -141,184 +145,207 @@ function de({ lesson: e, index: t, done: n, open: i, onToggle: a, onStart: o })
 		}) : null]
 	});
 }
-function fe({ certificate: e, learnerName: t, courseTitle: n }) {
+function Se({ certificate: e, learnerName: t, courseTitle: n }) {
 	let r = e.status === "REVOKED";
-	return /* @__PURE__ */ M(P, {
+	return /* @__PURE__ */ A(M, {
 		className: "overflow-hidden p-0",
-		children: [/* @__PURE__ */ j("div", {
+		children: [/* @__PURE__ */ k("div", {
 			className: "border-b border-border-seam px-5 py-3",
-			children: /* @__PURE__ */ j("span", {
+			children: /* @__PURE__ */ k("span", {
 				className: "text-xs font-semibold uppercase tracking-wide text-text-muted",
 				children: "Certificate preview"
 			})
-		}), /* @__PURE__ */ M("div", {
+		}), /* @__PURE__ */ A("div", {
 			className: "space-y-4 bg-bg-sunken/50 px-5 py-6 text-center",
 			children: [
-				/* @__PURE__ */ M("div", {
+				/* @__PURE__ */ A("div", {
 					className: "flex items-center justify-center gap-2 text-xs font-semibold uppercase tracking-[0.2em] text-text-muted",
-					children: [/* @__PURE__ */ j(g, {
+					children: [/* @__PURE__ */ k(h, {
 						size: 14,
 						className: "text-status-warning-text"
 					}), " Certificate of completion"]
 				}),
-				/* @__PURE__ */ j("h3", {
+				/* @__PURE__ */ k("h3", {
 					className: "text-lg font-bold text-text-primary",
 					children: n
 				}),
-				t ? /* @__PURE__ */ M("p", {
+				t ? /* @__PURE__ */ A("p", {
 					className: "text-sm text-text-secondary",
-					children: ["Awarded to ", /* @__PURE__ */ j("span", {
+					children: ["Awarded to ", /* @__PURE__ */ k("span", {
 						className: "font-semibold text-text-primary",
 						children: t
 					})]
 				}) : null,
-				/* @__PURE__ */ M("div", {
+				/* @__PURE__ */ A("div", {
 					className: "grid grid-cols-1 gap-3 border-t border-border-seam pt-4 text-left sm:grid-cols-3",
 					children: [
-						/* @__PURE__ */ M("div", { children: [/* @__PURE__ */ j("div", {
+						/* @__PURE__ */ A("div", { children: [/* @__PURE__ */ k("div", {
 							className: "text-[11px] font-medium uppercase tracking-wide text-text-muted",
 							children: "Serial number"
-						}), /* @__PURE__ */ j("div", {
+						}), /* @__PURE__ */ k("div", {
 							className: "truncate font-mono text-sm text-text-primary",
 							children: e.serial
 						})] }),
-						/* @__PURE__ */ M("div", { children: [/* @__PURE__ */ j("div", {
+						/* @__PURE__ */ A("div", { children: [/* @__PURE__ */ k("div", {
 							className: "text-[11px] font-medium uppercase tracking-wide text-text-muted",
 							children: "Score"
-						}), /* @__PURE__ */ j("div", {
+						}), /* @__PURE__ */ k("div", {
 							className: "text-sm font-semibold text-text-primary",
 							children: e.score
 						})] }),
-						/* @__PURE__ */ M("div", { children: [/* @__PURE__ */ j("div", {
+						/* @__PURE__ */ A("div", { children: [/* @__PURE__ */ k("div", {
 							className: "text-[11px] font-medium uppercase tracking-wide text-text-muted",
 							children: "Issued on"
-						}), /* @__PURE__ */ j("div", {
+						}), /* @__PURE__ */ k("div", {
 							className: "text-sm text-text-primary",
 							children: c(e.issuedAt)
 						})] })
 					]
 				}),
-				r ? /* @__PURE__ */ M("div", {
+				r ? /* @__PURE__ */ A("div", {
 					className: "rounded-lg border border-status-error-border bg-status-error-bg-subtle px-3 py-2 text-left text-xs text-status-error-text",
 					children: [
 						"This certificate was revoked",
 						e.revokedAt ? ` on ${c(e.revokedAt)}` : "",
 						e.revokeReason ? ` — ${e.revokeReason}` : "."
 					]
-				}) : /* @__PURE__ */ M("span", {
+				}) : /* @__PURE__ */ A("span", {
 					className: "inline-flex items-center gap-1 rounded-full border border-status-success-border bg-status-success-bg-subtle px-2.5 py-1 text-xs font-medium text-status-success-text",
-					children: [/* @__PURE__ */ j(E, { size: 13 }), " Verified"]
+					children: [/* @__PURE__ */ k(T, { size: 13 }), " Verified"]
 				})
 			]
 		})]
 	});
 }
-function R() {
-	let [c] = ue(), y = c.get("id") ?? "", [x, T] = m(se.lesson), { currentUser: E, workspaceId: D } = e(), I = t(), { emit: R } = n(), { data: z, loading: B, error: V, refetch: pe } = re(y);
-	le(() => {
-		y && R("technospam.course.viewed", {
-			workspaceId: D,
-			entityId: y,
+function I() {
+	let [c] = be(), v = c.get("id") ?? "", [b, w] = pe(fe.lesson), { currentUser: T, workspaceId: E } = e(), P = t();
+	de(T?.id);
+	let { emit: I } = n(), { data: Ce, loading: L, error: R, refetch: z } = ie(v), B = ue(), V = ce(E, T?.id);
+	m(() => {
+		v && I("technospam.course.viewed", {
+			workspaceId: E,
+			entityId: v,
 			entityType: "TEC_COURSE"
 		});
 	}, [
-		y,
-		D,
-		R
+		v,
+		E,
+		I
 	]);
-	let [me, { loading: H }] = ie(), U = z?.tecCourse ?? null, { certificates: W, refetch: he } = oe({
+	let [we, { loading: H }] = ae(), U = Ce?.tecCourse ?? null, { certificates: W, refetch: Te } = se({
 		buiCourseId: U?.buiCourseId,
-		technospamCourseId: y,
-		skip: !y
-	}), [ge, { loading: G }] = ae(), K = [...U?.lessons ?? []].sort((e, t) => e.position - t.position), q = (U?.enrollments ?? []).find((e) => e.learnerId === E?.id), J = W.find((e) => e.status === "ISSUED") ?? W[0], _e = !!q && q.progressPct >= 100, ve = async () => {
-		!y || !E?.id || (R("technospam.course.certificate_claimed", {
-			workspaceId: D,
-			entityId: y,
+		technospamCourseId: v,
+		skip: !v
+	}), [Ee, { loading: G }] = oe(), K = [...U?.lessons ?? []].sort((e, t) => e.position - t.position), q = (U?.enrollments ?? []).find((e) => e.learnerId === T?.id), J = W.find((e) => e.status === "ISSUED") ?? W[0], De = !!q && q.progressPct >= 100, Oe = async () => {
+		!v || !T?.id || (I("technospam.course.certificate_claimed", {
+			workspaceId: E,
+			entityId: v,
 			entityType: "TEC_COURSE"
-		}), (await ge({ variables: {
-			courseId: y,
-			learnerId: E.id,
+		}), (await Ee({ variables: {
+			courseId: v,
+			learnerId: T.id,
 			score: 100
-		} })).data?.tecIssueCertificate && (p.success("Certificate issued", "Your verifiable certificate is ready in My Learning."), await he()));
-	}, ye = async () => {
-		y && (R("technospam.course.enroll_clicked", {
-			workspaceId: D,
-			entityId: y,
+		} })).data?.tecIssueCertificate && (f.success("Certificate issued", "Your verifiable certificate is ready in My Learning."), await Te()));
+	}, ke = async () => {
+		v && (I("technospam.course.enroll_clicked", {
+			workspaceId: E,
+			entityId: v,
 			entityType: "TEC_COURSE"
-		}), (await me({ variables: { input: { courseId: y } } })).data?.tecEnroll && (R("technospam.course.enrolled", {
-			workspaceId: D,
-			entityId: y,
+		}), (await we({ variables: { input: { courseId: v } } })).data?.tecEnroll && (I("technospam.course.enrolled", {
+			workspaceId: E,
+			entityId: v,
 			entityType: "TEC_COURSE"
-		}), p.success("Enrolled", `You're enrolled in "${U?.title}".`), await pe()));
-	};
-	if (B && !U) return /* @__PURE__ */ M(i, {
+		}), f.success("Enrolled", `You're enrolled in "${U?.title}".`), await z()));
+	}, Y = ge(() => U || L ? null : le(V, v), [
+		U,
+		L,
+		V,
+		v
+	]), X = _e(B);
+	if (m(() => {
+		let e = B && !X.current;
+		X.current = B, e && !U && z();
+	}, [
+		B,
+		U,
+		z
+	]), L && !U) return /* @__PURE__ */ A(i, {
 		title: "Course",
 		backPath: "/courses/courses-page",
-		children: [/* @__PURE__ */ j(F, { className: "mb-4 h-40 w-full rounded-2xl" }), /* @__PURE__ */ j(F, { className: "h-64 w-full rounded-xl" })]
+		children: [/* @__PURE__ */ k(N, { className: "mb-4 h-40 w-full rounded-2xl" }), /* @__PURE__ */ k(N, { className: "h-64 w-full rounded-xl" })]
+	});
+	if (!U && Y) return /* @__PURE__ */ k(i, {
+		title: Y.course.title,
+		backPath: "/courses/courses-page",
+		children: /* @__PURE__ */ k(he, {
+			outline: Y,
+			online: B,
+			onOpenLesson: (e) => P(p(v, e))
+		})
 	});
-	if (V || !U) return /* @__PURE__ */ j(i, {
+	if (R || !U) return /* @__PURE__ */ k(i, {
 		title: "Course",
 		backPath: "/courses/courses-page",
-		children: V ? /* @__PURE__ */ j(te, {
+		children: R ? /* @__PURE__ */ k(ne, {
 			title: "Couldn't load course",
-			error: V
-		}) : /* @__PURE__ */ j(ee, {
+			error: R
+		}) : /* @__PURE__ */ k(te, {
 			title: "Course not found",
 			description: "This course may have been unpublished."
 		})
 	});
-	let Y = q?.lessonsCompleted ?? 0, X = K.find((e) => !e.completedByMe) ?? K[0], Z = K.length > 0 && K.every((e) => e.completedByMe), Q = (e) => I(ce(y, e)), $ = Math.max(0, K.length - Y), be = q && q.progressPct >= 100 ? "Course complete — claim your certificate below." : $ === 1 ? "1 lesson to go — almost there!" : `${$} lessons to go — keep it up!`, xe = `${U.topic ?? ""} ${U.title}`;
-	return /* @__PURE__ */ M(i, {
+	let Z = q?.lessonsCompleted ?? 0, Q = K.find((e) => !e.completedByMe) ?? K[0], $ = K.length > 0 && K.every((e) => e.completedByMe), Ae = (e) => P(p(v, e)), je = Math.max(0, K.length - Z), Me = q && q.progressPct >= 100 ? "Course complete — claim your certificate below." : je === 1 ? "1 lesson to go — almost there!" : `${je} lessons to go — keep it up!`, Ne = `${U.topic ?? ""} ${U.title}`;
+	return /* @__PURE__ */ A(i, {
 		backPath: "/courses/courses-page",
 		title: U.title,
 		description: U.summary ?? void 0,
-		actions: q ? X ? /* @__PURE__ */ M(N, {
-			onClick: () => Q(X.id),
+		actions: q ? Q ? /* @__PURE__ */ A(j, {
+			onClick: () => Ae(Q.id),
 			"data-testid": "continue-learning",
-			children: [j(Z ? v : h, { size: 16 }), Z ? "Review course" : Y > 0 ? "Continue learning" : "Start course"]
-		}) : null : /* @__PURE__ */ M(N, {
-			onClick: ye,
+			children: [k($ ? _ : ve, { size: 16 }), $ ? "Review course" : Z > 0 ? "Continue learning" : "Start course"]
+		}) : null : /* @__PURE__ */ A(j, {
+			onClick: ke,
 			disabled: H,
 			children: [
-				/* @__PURE__ */ j(_, { size: 16 }),
+				/* @__PURE__ */ k(g, { size: 16 }),
 				" ",
 				H ? "Enrolling…" : "Enroll"
 			]
 		}),
 		children: [
-			/* @__PURE__ */ j(o, {
+			/* @__PURE__ */ k(o, {
 				height: "h-40",
-				seed: xe,
+				seed: Ne,
 				icon: s(U.topic ?? U.title),
 				className: "mb-5 rounded-2xl",
-				children: /* @__PURE__ */ M("div", {
+				children: /* @__PURE__ */ A("div", {
 					className: "flex w-full flex-col gap-2",
 					children: [
-						/* @__PURE__ */ j("span", {
+						/* @__PURE__ */ k("span", {
 							className: "text-xs font-medium uppercase tracking-wide text-white/80",
 							children: U.topic ?? "Course"
 						}),
-						/* @__PURE__ */ j("h2", {
+						/* @__PURE__ */ k("h2", {
 							className: "text-2xl font-bold leading-tight text-white drop-shadow-sm sm:text-3xl",
 							children: U.title
 						}),
-						/* @__PURE__ */ M("div", {
+						/* @__PURE__ */ A("div", {
 							className: "flex flex-wrap items-center gap-2",
 							children: [
-								/* @__PURE__ */ j(L, {
-									icon: O,
-									children: u(U.level)
+								/* @__PURE__ */ k(F, {
+									icon: D,
+									children: l(U.level)
 								}),
-								/* @__PURE__ */ j(L, {
-									icon: v,
-									children: u(U.status)
+								/* @__PURE__ */ k(F, {
+									icon: _,
+									children: l(U.status)
 								}),
-								U.topic ? /* @__PURE__ */ j(L, {
-									icon: C,
+								U.topic ? /* @__PURE__ */ k(F, {
+									icon: S,
 									children: U.topic
 								}) : null,
-								U.isPremiumOnly ? /* @__PURE__ */ j(L, {
-									icon: w,
+								U.isPremiumOnly ? /* @__PURE__ */ k(F, {
+									icon: C,
 									children: "Premium"
 								}) : null
 							]
@@ -326,57 +353,57 @@ function R() {
 					]
 				})
 			}),
-			/* @__PURE__ */ j(ne, {
+			/* @__PURE__ */ k(re, {
 				tags: U.tags,
 				className: "mb-5"
 			}),
-			/* @__PURE__ */ M("div", {
+			/* @__PURE__ */ A("div", {
 				className: "mb-6 grid grid-cols-2 gap-3 sm:grid-cols-4",
 				children: [
-					/* @__PURE__ */ j(a, {
+					/* @__PURE__ */ k(a, {
 						label: "Lessons",
 						value: K.length,
-						icon: S,
+						icon: x,
 						tone: "blue"
 					}),
-					/* @__PURE__ */ j(a, {
+					/* @__PURE__ */ k(a, {
 						label: "Duration",
-						value: l(U.estimatedMinutes),
-						icon: b,
+						value: ee(U.estimatedMinutes),
+						icon: y,
 						tone: "teal"
 					}),
-					/* @__PURE__ */ j(a, {
+					/* @__PURE__ */ k(a, {
 						label: "Enrolled",
 						value: U.enrollments?.length ?? 0,
-						icon: A,
+						icon: ye,
 						tone: "indigo"
 					}),
-					/* @__PURE__ */ j(a, {
+					/* @__PURE__ */ k(a, {
 						label: "Your progress",
 						value: q ? `${q.progressPct}%` : "Not started",
-						icon: O,
+						icon: D,
 						tone: "purple"
 					})
 				]
 			}),
-			q ? /* @__PURE__ */ M(P, {
+			q ? /* @__PURE__ */ A(M, {
 				className: "mb-6 p-5",
 				children: [
-					/* @__PURE__ */ M("div", {
+					/* @__PURE__ */ A("div", {
 						className: "mb-3 flex items-center gap-2",
 						children: [
-							/* @__PURE__ */ j("span", {
+							/* @__PURE__ */ k("span", {
 								className: "flex h-8 w-8 items-center justify-center rounded-lg bg-accent-primary/15 text-accent-primary",
-								children: /* @__PURE__ */ j(O, { size: 16 })
+								children: /* @__PURE__ */ k(D, { size: 16 })
 							}),
-							/* @__PURE__ */ j("span", {
+							/* @__PURE__ */ k("span", {
 								className: "text-sm font-semibold text-text-primary",
 								children: "Your progress"
 							}),
-							/* @__PURE__ */ M("span", {
+							/* @__PURE__ */ A("span", {
 								className: "ml-auto text-sm text-text-secondary",
 								children: [
-									Y,
+									Z,
 									"/",
 									K.length,
 									" lessons · ",
@@ -386,109 +413,120 @@ function R() {
 							})
 						]
 					}),
-					/* @__PURE__ */ j("div", {
+					/* @__PURE__ */ k("div", {
 						className: "h-2.5 w-full overflow-hidden rounded-full bg-bg-sunken",
-						children: /* @__PURE__ */ j("div", {
+						children: /* @__PURE__ */ k("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: `${q.progressPct}%` }
 						})
 					}),
-					/* @__PURE__ */ j("p", {
+					/* @__PURE__ */ k("p", {
 						className: "mt-2 text-xs text-text-muted",
-						children: be
+						children: Me
 					})
 				]
 			}) : null,
-			J ? /* @__PURE__ */ M("div", {
+			J ? /* @__PURE__ */ A("div", {
 				className: "mb-6 grid grid-cols-1 gap-4 lg:grid-cols-2",
-				children: [/* @__PURE__ */ M(P, {
+				children: [/* @__PURE__ */ A(M, {
 					className: r("flex items-center gap-4 border p-5", J.status === "REVOKED" ? "border-status-error-border/60 bg-status-error-bg-subtle/20" : "border-status-success-border/60 bg-status-success-bg-subtle/30"),
-					children: [/* @__PURE__ */ j("span", {
+					children: [/* @__PURE__ */ k("span", {
 						className: "flex h-14 w-14 shrink-0 items-center justify-center rounded-2xl bg-status-warning-bg-subtle text-status-warning-text ring-1 ring-status-warning-border/40",
-						children: /* @__PURE__ */ j(k, { size: 26 })
-					}), /* @__PURE__ */ M("div", {
+						children: /* @__PURE__ */ k(O, { size: 26 })
+					}), /* @__PURE__ */ A("div", {
 						className: "min-w-0",
-						children: [/* @__PURE__ */ j("div", {
+						children: [/* @__PURE__ */ k("div", {
 							className: "text-base font-semibold text-text-primary",
 							children: J.status === "REVOKED" ? "Your certificate was revoked" : "You finished this course"
-						}), /* @__PURE__ */ j("div", {
+						}), /* @__PURE__ */ k("div", {
 							className: "text-sm text-text-muted",
 							children: J.status === "REVOKED" ? "Contact a workspace admin if you believe this was a mistake." : "Your verifiable certificate of completion is issued — it also appears in My Learning."
 						})]
 					})]
-				}), /* @__PURE__ */ j(fe, {
+				}), /* @__PURE__ */ k(Se, {
 					certificate: J,
-					learnerName: E?.name ?? void 0,
+					learnerName: T?.name ?? void 0,
 					courseTitle: J.course?.title ?? U.title
 				})]
-			}) : _e ? /* @__PURE__ */ M(P, {
+			}) : De ? /* @__PURE__ */ A(M, {
 				className: "mb-6 flex flex-col items-start gap-4 border border-status-success-border/60 bg-status-success-bg-subtle/40 p-5 sm:flex-row sm:items-center sm:justify-between",
-				children: [/* @__PURE__ */ M("div", {
+				children: [/* @__PURE__ */ A("div", {
 					className: "flex items-center gap-4",
-					children: [/* @__PURE__ */ j("span", {
+					children: [/* @__PURE__ */ k("span", {
 						className: "flex h-14 w-14 shrink-0 items-center justify-center rounded-2xl bg-status-warning-bg-subtle text-status-warning-text ring-1 ring-status-warning-border/40",
-						children: /* @__PURE__ */ j(k, { size: 26 })
-					}), /* @__PURE__ */ M("div", { children: [/* @__PURE__ */ j("div", {
+						children: /* @__PURE__ */ k(O, { size: 26 })
+					}), /* @__PURE__ */ A("div", { children: [/* @__PURE__ */ k("div", {
 						className: "text-base font-semibold text-text-primary",
 						children: "You finished this course"
-					}), /* @__PURE__ */ j("div", {
+					}), /* @__PURE__ */ k("div", {
 						className: "text-sm text-text-muted",
 						children: "Claim your verifiable certificate of completion."
 					})] })]
-				}), /* @__PURE__ */ M(N, {
-					onClick: ve,
+				}), /* @__PURE__ */ A(j, {
+					onClick: Oe,
 					disabled: G,
 					children: [
-						/* @__PURE__ */ j(g, { size: 16 }),
+						/* @__PURE__ */ k(h, { size: 16 }),
 						" ",
 						G ? "Issuing…" : "Claim certificate"
 					]
 				})]
 			}) : null,
-			/* @__PURE__ */ M(P, {
+			/* @__PURE__ */ A(M, {
 				className: "p-5",
 				children: [
-					/* @__PURE__ */ M("div", {
+					/* @__PURE__ */ A("div", {
 						className: "mb-3 flex items-center justify-between gap-2",
-						children: [/* @__PURE__ */ M("h2", {
+						children: [/* @__PURE__ */ A("h2", {
 							className: "flex items-center gap-2 text-base font-semibold text-text-primary",
 							children: [
-								/* @__PURE__ */ j(_, {
+								/* @__PURE__ */ k(g, {
 									size: 18,
 									className: "text-accent-primary"
 								}),
 								" Curriculum",
-								U.isPremiumOnly ? /* @__PURE__ */ j(d, { locked: U.isLocked }) : null
+								U.isPremiumOnly ? /* @__PURE__ */ k(u, { locked: U.isLocked }) : null
 							]
-						}), K.length ? /* @__PURE__ */ M("span", {
-							className: "rounded-full bg-status-success-bg-subtle px-2.5 py-1 text-xs font-medium text-status-success-text",
-							children: [
-								Y,
-								"/",
-								K.length,
-								" completed"
-							]
-						}) : null]
+						}), /* @__PURE__ */ A("div", {
+							className: "flex flex-wrap items-center justify-end gap-2",
+							children: [q ? /* @__PURE__ */ k(me, {
+								scope: V,
+								courseId: U.id,
+								lessons: K,
+								enrollment: {
+									id: q.id,
+									progressPct: q.progressPct
+								}
+							}) : null, K.length ? /* @__PURE__ */ A("span", {
+								className: "rounded-full bg-status-success-bg-subtle px-2.5 py-1 text-xs font-medium text-status-success-text",
+								children: [
+									Z,
+									"/",
+									K.length,
+									" completed"
+								]
+							}) : null]
+						})]
 					}),
-					U.isLocked ? /* @__PURE__ */ j("div", {
+					U.isLocked ? /* @__PURE__ */ k("div", {
 						className: "mb-4",
-						children: /* @__PURE__ */ j(f, {
+						children: /* @__PURE__ */ k(d, {
 							compact: !0,
 							description: "This course is on a paid TechnoSpam plan. Preview lessons below stay free — the rest unlock once your workspace upgrades."
 						})
 					}) : null,
-					K.length === 0 ? /* @__PURE__ */ j("p", {
+					K.length === 0 ? /* @__PURE__ */ k("p", {
 						className: "py-6 text-center text-sm text-text-muted",
 						children: "Lessons for this course are being prepared."
-					}) : /* @__PURE__ */ j("div", {
+					}) : /* @__PURE__ */ k("div", {
 						className: "flex flex-col",
-						children: K.map((e, t) => /* @__PURE__ */ j(de, {
+						children: K.map((e, t) => /* @__PURE__ */ k(xe, {
 							lesson: e,
 							index: t,
 							done: !!e.completedByMe,
-							open: x === e.id,
-							onToggle: () => T(x === e.id ? null : e.id),
-							onStart: () => Q(e.id)
+							open: b === e.id,
+							onToggle: () => w(b === e.id ? null : e.id),
+							onStart: () => Ae(e.id)
 						}, e.id))
 					})
 				]
@@ -497,6 +535,6 @@ function R() {
 	});
 }
 //#endregion
-export { R as CoursesCourseDetailsPagePage };
+export { I as CoursesCourseDetailsPagePage };
 
 //# sourceMappingURL=CoursesCourseDetailsPagePage.js.map