@burdenoff/microfe-atheletebridge 2026.629.1 → 2026.705.2

package/dist/atheletebridge/pages/programs/ProgramDetailPage.js

@@ -3,16 +3,17 @@ import { PageLayout as t } from "../../components/PageLayout.js";
 import { StatusBadge as n } from "../../components/StatusBadge.js";
 import { PROGRAM_LEVEL_LABELS as r, SPORT_LABELS as i } from "../../components/domain.js";
 import { EmptyState as a } from "../../components/EmptyState.js";
-import { ErrorState as ee, LoadingState as te } from "../../components/LoadingState.js";
-import { useAddDrill as o, useArchiveProgram as s, useProgram as c, useRemoveDrill as l, useTransitionProgram as u } from "../../hooks/useAthleteBridgeApi.js";
-import { FormField as d, fieldInputClass as f } from "../../components/form.js";
+import { ErrorState as o, LoadingState as ee } from "../../components/LoadingState.js";
+import { useAddDrill as te, useArchiveProgram as ne, useProgram as re, useRemoveDrill as s, useTransitionProgram as c, useUploadFile as l } from "../../hooks/useAthleteBridgeApi.js";
+import { FormField as u, fieldInputClass as d } from "../../components/form.js";
+import { DrillVideoLink as f } from "../../components/DrillVideoLink.js";
 import { useMemo as p, useState as m } from "react";
-import { Archive as h, ArrowLeft as g, Copy as _, Edit as v, Loader2 as y, Plus as b, Send as x, Trash2 as S, Undo2 as C } from "lucide-react";
-import { useParams as w } from "react-router-dom";
-import { Fragment as T, jsx as E, jsxs as D } from "react/jsx-runtime";
-import { EmphasisPanel as O, GlassCard as k, ResponsiveDialog as A, ResponsiveDialogContent as j, ResponsiveDialogFooter as M, ResponsiveDialogHeader as N, ResponsiveDialogTitle as P } from "@burdenoff/fe-libs/ui";
+import { Archive as h, ArrowLeft as g, Copy as _, Edit as v, FileVideo as y, Loader2 as b, Plus as x, Send as ie, Trash2 as ae, Undo2 as oe } from "lucide-react";
+import { useParams as se } from "react-router-dom";
+import { Fragment as ce, jsx as S, jsxs as C } from "react/jsx-runtime";
+import { EmphasisPanel as w, GlassCard as T, ResponsiveDialog as E, ResponsiveDialogContent as D, ResponsiveDialogFooter as O, ResponsiveDialogHeader as k, ResponsiveDialogTitle as A } from "@burdenoff/fe-libs/ui";
 //#region src/atheletebridge/pages/programs/ProgramDetailPage.tsx
-var F = {
+var j = {
 	name: "",
 	description: "",
 	weekNumber: "1",
@@ -20,15 +21,15 @@ var F = {
 	reps: "",
 	durationSec: "",
 	restSec: ""
-}, I = (e) => {
+}, M = (e) => {
 	let t = e.trim();
 	if (!t) return;
 	let n = Number.parseInt(t, 10);
 	return Number.isNaN(n) ? void 0 : n;
 };
-function L() {
-	let { id: L } = w(), { navigateTo: R } = e(), z = c(L), B = u(), V = s(), H = o(), U = l(L), [W, G] = m(!1), [K, q] = m(F), [J, Y] = m(null), X = p(() => {
-		let e = z.data?.drills ?? [], t = /* @__PURE__ */ new Map();
+function N() {
+	let { id: N } = se(), { navigateTo: P } = e(), F = re(N), I = c(), L = ne(), R = te(), z = s(N), B = l(), [V, H] = m(!1), [U, W] = m(j), [G, K] = m(null), [q, J] = m(!1), [Y, X] = m(null), le = p(() => {
+		let e = F.data?.drills ?? [], t = /* @__PURE__ */ new Map();
 		for (let n of e) {
 			let e = t.get(n.weekNumber) ?? [];
 			e.push(n), t.set(n.weekNumber, e);
@@ -37,52 +38,52 @@ function L() {
 			week: e,
 			drills: [...t].sort((e, t) => e.orderIndex - t.orderIndex)
 		}));
-	}, [z.data]);
-	if (z.isLoading) return /* @__PURE__ */ E(t, {
+	}, [F.data]);
+	if (F.isLoading) return /* @__PURE__ */ S(t, {
 		title: "Program",
-		children: /* @__PURE__ */ E(te, { label: "Loading program…" })
+		children: /* @__PURE__ */ S(ee, { label: "Loading program…" })
 	});
-	if (z.isError || !z.data) return /* @__PURE__ */ E(t, {
+	if (F.isError || !F.data) return /* @__PURE__ */ S(t, {
 		title: "Program",
-		children: /* @__PURE__ */ E(ee, {
+		children: /* @__PURE__ */ S(o, {
 			title: "Program not found",
 			message: "This program does not exist or you do not have access to it.",
-			onRetry: () => R("/programs")
+			onRetry: () => P("/programs")
 		})
 	});
-	let Z = z.data, Q = Z.drills?.length ?? 0, $ = (e) => {
-		L && B.mutate({
-			id: L,
+	let Z = F.data, Q = Z.drills?.length ?? 0, $ = (e) => {
+		N && I.mutate({
+			id: N,
 			status: e
 		});
 	};
-	return /* @__PURE__ */ D(t, {
+	return /* @__PURE__ */ C(t, {
 		title: Z.name,
 		description: `${i[Z.sport]} · ${r[Z.level]} · ${Z.weeks} ${Z.weeks === 1 ? "week" : "weeks"}`,
-		actions: /* @__PURE__ */ D("div", {
+		actions: /* @__PURE__ */ C("div", {
 			className: "flex flex-wrap items-center gap-2",
 			children: [
-				/* @__PURE__ */ D("button", {
+				/* @__PURE__ */ C("button", {
 					type: "button",
-					onClick: () => R("/programs"),
+					onClick: () => P("/programs"),
 					className: "inline-flex items-center gap-1.5 rounded-lg border border-border-seam px-3 py-2 text-sm font-medium text-text-primary transition-colors hover:bg-bg-sunken",
-					children: [/* @__PURE__ */ E(g, { className: "h-4 w-4" }), " Back"]
+					children: [/* @__PURE__ */ S(g, { className: "h-4 w-4" }), " Back"]
 				}),
-				/* @__PURE__ */ D("button", {
+				/* @__PURE__ */ C("button", {
 					type: "button",
-					onClick: () => R(`/programs/${Z.id}/edit`),
+					onClick: () => P(`/programs/${Z.id}/edit`),
 					className: "inline-flex items-center gap-1.5 rounded-lg border border-border-seam px-3 py-2 text-sm font-medium text-text-primary transition-colors hover:bg-bg-sunken",
-					children: [/* @__PURE__ */ E(v, { className: "h-4 w-4" }), " Edit"]
+					children: [/* @__PURE__ */ S(v, { className: "h-4 w-4" }), " Edit"]
 				}),
-				Z.status !== "ARCHIVED" && /* @__PURE__ */ D("button", {
+				Z.status !== "ARCHIVED" && /* @__PURE__ */ C("button", {
 					type: "button",
 					onClick: async () => {
-						L && (await V.mutateAsync(L), R("/programs"));
+						N && (await L.mutateAsync(N), P("/programs"));
 					},
-					disabled: V.isPending,
+					disabled: L.isPending,
 					className: "inline-flex items-center gap-1.5 rounded-lg border border-border-seam px-3 py-2 text-sm font-medium text-status-error-text transition-colors hover:bg-status-error-bg-subtle disabled:opacity-60",
 					children: [
-						V.isPending ? /* @__PURE__ */ E(y, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ E(h, { className: "h-4 w-4" }),
+						L.isPending ? /* @__PURE__ */ S(b, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ S(h, { className: "h-4 w-4" }),
 						" ",
 						"Archive"
 					]
@@ -90,226 +91,238 @@ function L() {
 			]
 		}),
 		children: [
-			/* @__PURE__ */ D(k, {
+			/* @__PURE__ */ C(T, {
 				treatment: "insight",
 				className: "mb-8 p-6",
 				children: [
-					/* @__PURE__ */ D("div", {
+					/* @__PURE__ */ C("div", {
 						className: "flex flex-wrap items-center gap-3",
-						children: [/* @__PURE__ */ E(n, { status: Z.status }), Z.isTemplate && /* @__PURE__ */ D("span", {
+						children: [/* @__PURE__ */ S(n, { status: Z.status }), Z.isTemplate && /* @__PURE__ */ C("span", {
 							className: "inline-flex items-center gap-1 text-sm text-text-secondary",
-							children: [/* @__PURE__ */ E(_, { className: "h-3.5 w-3.5" }), " Template"]
+							children: [/* @__PURE__ */ S(_, { className: "h-3.5 w-3.5" }), " Template"]
 						})]
 					}),
-					Z.summary && /* @__PURE__ */ E("p", {
+					Z.summary && /* @__PURE__ */ S("p", {
 						className: "mt-4 text-sm text-text-secondary",
 						children: Z.summary
 					}),
-					Z.tags.length > 0 && /* @__PURE__ */ E("div", {
+					Z.tags.length > 0 && /* @__PURE__ */ S("div", {
 						className: "mt-4 flex flex-wrap gap-1.5",
-						children: Z.tags.map((e) => /* @__PURE__ */ E("span", {
+						children: Z.tags.map((e) => /* @__PURE__ */ S("span", {
 							className: "inline-flex items-center rounded-full bg-bg-sunken px-2 py-0.5 text-xs text-text-secondary",
 							children: e
 						}, e))
 					}),
-					/* @__PURE__ */ D("div", {
+					/* @__PURE__ */ C("div", {
 						className: "mt-5 flex flex-wrap items-center gap-2 border-t border-border-seam pt-5",
 						children: [
-							/* @__PURE__ */ E("span", {
+							/* @__PURE__ */ S("span", {
 								className: "text-sm font-medium text-text-primary",
 								children: "Publish lifecycle:"
 							}),
-							Z.status === "DRAFT" && /* @__PURE__ */ D("button", {
+							Z.status === "DRAFT" && /* @__PURE__ */ C("button", {
 								type: "button",
 								onClick: () => $("PUBLISHED"),
-								disabled: B.isPending,
+								disabled: I.isPending,
 								className: "inline-flex items-center gap-1.5 rounded-lg bg-action-primary-bg px-3 py-1.5 text-sm font-medium text-action-primary-text transition-colors hover:bg-action-primary-bg/90 disabled:opacity-60",
-								children: [/* @__PURE__ */ E(x, { className: "h-4 w-4" }), " Publish"]
+								children: [/* @__PURE__ */ S(ie, { className: "h-4 w-4" }), " Publish"]
 							}),
-							Z.status === "PUBLISHED" && /* @__PURE__ */ D(T, { children: [/* @__PURE__ */ D("button", {
+							Z.status === "PUBLISHED" && /* @__PURE__ */ C(ce, { children: [/* @__PURE__ */ C("button", {
 								type: "button",
 								onClick: () => $("DRAFT"),
-								disabled: B.isPending,
+								disabled: I.isPending,
 								className: "inline-flex items-center gap-1.5 rounded-lg border border-border-seam px-3 py-1.5 text-sm font-medium text-text-primary transition-colors hover:bg-bg-sunken disabled:opacity-60",
-								children: [/* @__PURE__ */ E(C, { className: "h-4 w-4" }), " Pull back to draft"]
-							}), /* @__PURE__ */ D("button", {
+								children: [/* @__PURE__ */ S(oe, { className: "h-4 w-4" }), " Pull back to draft"]
+							}), /* @__PURE__ */ C("button", {
 								type: "button",
 								onClick: () => $("ARCHIVED"),
-								disabled: B.isPending,
+								disabled: I.isPending,
 								className: "inline-flex items-center gap-1.5 rounded-lg border border-border-seam px-3 py-1.5 text-sm font-medium text-text-primary transition-colors hover:bg-bg-sunken disabled:opacity-60",
-								children: [/* @__PURE__ */ E(h, { className: "h-4 w-4" }), " Archive"]
+								children: [/* @__PURE__ */ S(h, { className: "h-4 w-4" }), " Archive"]
 							})] }),
-							Z.status === "ARCHIVED" && /* @__PURE__ */ E("span", {
+							Z.status === "ARCHIVED" && /* @__PURE__ */ S("span", {
 								className: "text-sm text-text-secondary",
 								children: "This program is archived."
 							}),
-							B.isPending && /* @__PURE__ */ E(y, { className: "h-4 w-4 animate-spin text-text-secondary" })
+							I.isPending && /* @__PURE__ */ S(b, { className: "h-4 w-4 animate-spin text-text-secondary" })
 						]
 					})
 				]
 			}),
-			/* @__PURE__ */ D("section", { children: [/* @__PURE__ */ D("div", {
+			/* @__PURE__ */ C("section", { children: [/* @__PURE__ */ C("div", {
 				className: "mb-4 flex items-center justify-between",
-				children: [/* @__PURE__ */ D("h2", {
+				children: [/* @__PURE__ */ C("h2", {
 					className: "text-lg font-semibold text-text-primary",
 					children: [
 						"Drills (",
 						Q,
 						")"
 					]
-				}), /* @__PURE__ */ D("button", {
+				}), /* @__PURE__ */ C("button", {
 					type: "button",
 					onClick: () => {
-						Y(null), G(!0);
+						X(null), H(!0);
 					},
 					className: "inline-flex items-center gap-1.5 rounded-lg bg-action-primary-bg px-3 py-1.5 text-sm font-medium text-action-primary-text transition-colors hover:bg-action-primary-bg/90",
-					children: [/* @__PURE__ */ E(b, { className: "h-4 w-4" }), " Add drill"]
+					children: [/* @__PURE__ */ S(x, { className: "h-4 w-4" }), " Add drill"]
 				})]
-			}), Q === 0 ? /* @__PURE__ */ E(a, {
+			}), Q === 0 ? /* @__PURE__ */ S(a, {
 				illustration: "empty-data",
-				icon: /* @__PURE__ */ E(b, { className: "h-10 w-10" }),
+				icon: /* @__PURE__ */ S(x, { className: "h-10 w-10" }),
 				title: "No drills yet",
 				description: "Add drills with sets, reps and durations, organized by week."
-			}) : /* @__PURE__ */ E("div", {
+			}) : /* @__PURE__ */ S("div", {
 				className: "space-y-6",
-				children: X.map(({ week: e, drills: t }) => /* @__PURE__ */ D("div", { children: [/* @__PURE__ */ D("h3", {
+				children: le.map(({ week: e, drills: t }) => /* @__PURE__ */ C("div", { children: [/* @__PURE__ */ C("h3", {
 					className: "mb-3 text-sm font-semibold uppercase tracking-wide text-text-secondary",
 					children: ["Week ", e]
-				}), /* @__PURE__ */ E(O, { children: /* @__PURE__ */ E("div", {
+				}), /* @__PURE__ */ S(w, { children: /* @__PURE__ */ S("div", {
 					className: "divide-y divide-border-seam",
-					children: t.map((e) => /* @__PURE__ */ D("div", {
+					children: t.map((e) => /* @__PURE__ */ C("div", {
 						className: "flex items-start gap-4 py-3",
-						children: [/* @__PURE__ */ D("div", {
+						children: [/* @__PURE__ */ C("div", {
 							className: "min-w-0 flex-1",
 							children: [
-								/* @__PURE__ */ E("p", {
+								/* @__PURE__ */ S("p", {
 									className: "text-sm font-medium text-text-primary",
 									children: e.name
 								}),
-								e.description && /* @__PURE__ */ E("p", {
+								e.description && /* @__PURE__ */ S("p", {
 									className: "mt-0.5 text-xs text-text-secondary",
 									children: e.description
 								}),
-								/* @__PURE__ */ D("div", {
+								/* @__PURE__ */ C("div", {
 									className: "mt-1.5 flex flex-wrap gap-x-3 gap-y-1 text-xs text-text-secondary",
 									children: [
-										e.sets !== null && /* @__PURE__ */ D("span", { children: [e.sets, " sets"] }),
-										e.reps !== null && /* @__PURE__ */ D("span", { children: [e.reps, " reps"] }),
-										e.durationSec !== null && /* @__PURE__ */ D("span", { children: [e.durationSec, "s work"] }),
-										e.restSec !== null && /* @__PURE__ */ D("span", { children: [e.restSec, "s rest"] })
+										e.sets !== null && /* @__PURE__ */ C("span", { children: [e.sets, " sets"] }),
+										e.reps !== null && /* @__PURE__ */ C("span", { children: [e.reps, " reps"] }),
+										e.durationSec !== null && /* @__PURE__ */ C("span", { children: [e.durationSec, "s work"] }),
+										e.restSec !== null && /* @__PURE__ */ C("span", { children: [e.restSec, "s rest"] })
 									]
-								})
+								}),
+								e.video?.id && /* @__PURE__ */ S("div", { children: /* @__PURE__ */ S(f, { fileId: e.video.id }) })
 							]
-						}), /* @__PURE__ */ E("button", {
+						}), /* @__PURE__ */ S("button", {
 							type: "button",
-							onClick: () => void U.mutate(e.id),
-							disabled: U.isPending,
+							onClick: () => void z.mutate(e.id),
+							disabled: z.isPending,
 							"aria-label": `Remove ${e.name}`,
 							className: "rounded-lg p-2 text-text-secondary transition-colors hover:bg-status-error-bg-subtle hover:text-status-error-text disabled:opacity-60",
-							children: /* @__PURE__ */ E(S, { className: "h-4 w-4" })
+							children: /* @__PURE__ */ S(ae, { className: "h-4 w-4" })
 						})]
 					}, e.id))
 				}) })] }, e))
 			})] }),
-			/* @__PURE__ */ E(A, {
-				open: W,
-				onOpenChange: G,
-				children: /* @__PURE__ */ D(j, { children: [/* @__PURE__ */ E(N, { children: /* @__PURE__ */ E(P, { children: "Add drill" }) }), /* @__PURE__ */ D("form", {
+			/* @__PURE__ */ S(E, {
+				open: V,
+				onOpenChange: H,
+				children: /* @__PURE__ */ C(D, { children: [/* @__PURE__ */ S(k, { children: /* @__PURE__ */ S(A, { children: "Add drill" }) }), /* @__PURE__ */ C("form", {
 					onSubmit: async (e) => {
-						if (e.preventDefault(), Y(null), !L) return;
-						if (!K.name.trim()) {
-							Y("Drill name is required.");
+						if (e.preventDefault(), X(null), !N) return;
+						if (!U.name.trim()) {
+							X("Drill name is required.");
 							return;
 						}
-						let t = I(K.weekNumber) ?? 1;
+						let t = M(U.weekNumber) ?? 1, n;
+						if (G) {
+							J(!0);
+							try {
+								n = await B(G);
+							} catch (e) {
+								X(e instanceof Error ? e.message : "Failed to upload the demo video."), J(!1);
+								return;
+							}
+							J(!1);
+						}
 						try {
-							await H.mutateAsync({
-								programId: L,
-								name: K.name.trim(),
-								description: K.description.trim() || void 0,
+							await R.mutateAsync({
+								programId: N,
+								name: U.name.trim(),
+								description: U.description.trim() || void 0,
 								weekNumber: t,
-								orderIndex: z.data?.drills?.filter((e) => e.weekNumber === t).length ?? 0,
-								sets: I(K.sets),
-								reps: I(K.reps),
-								durationSec: I(K.durationSec),
-								restSec: I(K.restSec)
-							}), q(F), G(!1);
+								orderIndex: F.data?.drills?.filter((e) => e.weekNumber === t).length ?? 0,
+								sets: M(U.sets),
+								reps: M(U.reps),
+								durationSec: M(U.durationSec),
+								restSec: M(U.restSec),
+								videoFileId: n
+							}), W(j), K(null), H(!1);
 						} catch (e) {
-							Y(e instanceof Error ? e.message : "Failed to add drill.");
+							X(e instanceof Error ? e.message : "Failed to add drill.");
 						}
 					},
 					className: "space-y-4 px-1",
 					children: [
-						/* @__PURE__ */ E(d, {
+						/* @__PURE__ */ S(u, {
 							label: "Name",
 							htmlFor: "drillName",
 							required: !0,
-							children: /* @__PURE__ */ E("input", {
+							children: /* @__PURE__ */ S("input", {
 								id: "drillName",
-								className: f,
-								value: K.name,
-								onChange: (e) => q((t) => ({
+								className: d,
+								value: U.name,
+								onChange: (e) => W((t) => ({
 									...t,
 									name: e.target.value
 								})),
 								placeholder: "e.g. Box jumps"
 							})
 						}),
-						/* @__PURE__ */ E(d, {
+						/* @__PURE__ */ S(u, {
 							label: "Description",
 							htmlFor: "drillDesc",
-							children: /* @__PURE__ */ E("textarea", {
+							children: /* @__PURE__ */ S("textarea", {
 								id: "drillDesc",
-								className: f,
+								className: d,
 								rows: 2,
-								value: K.description,
-								onChange: (e) => q((t) => ({
+								value: U.description,
+								onChange: (e) => W((t) => ({
 									...t,
 									description: e.target.value
 								})),
 								placeholder: "How to perform the drill."
 							})
 						}),
-						/* @__PURE__ */ D("div", {
-							className: "grid grid-cols-3 gap-4",
+						/* @__PURE__ */ C("div", {
+							className: "grid grid-cols-1 gap-4 sm:grid-cols-3",
 							children: [
-								/* @__PURE__ */ E(d, {
+								/* @__PURE__ */ S(u, {
 									label: "Week",
 									htmlFor: "drillWeek",
-									children: /* @__PURE__ */ E("input", {
+									children: /* @__PURE__ */ S("input", {
 										id: "drillWeek",
 										inputMode: "numeric",
-										className: f,
-										value: K.weekNumber,
-										onChange: (e) => q((t) => ({
+										className: d,
+										value: U.weekNumber,
+										onChange: (e) => W((t) => ({
 											...t,
 											weekNumber: e.target.value
 										}))
 									})
 								}),
-								/* @__PURE__ */ E(d, {
+								/* @__PURE__ */ S(u, {
 									label: "Sets",
 									htmlFor: "drillSets",
-									children: /* @__PURE__ */ E("input", {
+									children: /* @__PURE__ */ S("input", {
 										id: "drillSets",
 										inputMode: "numeric",
-										className: f,
-										value: K.sets,
-										onChange: (e) => q((t) => ({
+										className: d,
+										value: U.sets,
+										onChange: (e) => W((t) => ({
 											...t,
 											sets: e.target.value
 										}))
 									})
 								}),
-								/* @__PURE__ */ E(d, {
+								/* @__PURE__ */ S(u, {
 									label: "Reps",
 									htmlFor: "drillReps",
-									children: /* @__PURE__ */ E("input", {
+									children: /* @__PURE__ */ S("input", {
 										id: "drillReps",
 										inputMode: "numeric",
-										className: f,
-										value: K.reps,
-										onChange: (e) => q((t) => ({
+										className: d,
+										value: U.reps,
+										onChange: (e) => W((t) => ({
 											...t,
 											reps: e.target.value
 										}))
@@ -317,50 +330,71 @@ function L() {
 								})
 							]
 						}),
-						/* @__PURE__ */ D("div", {
+						/* @__PURE__ */ C("div", {
 							className: "grid grid-cols-2 gap-4",
-							children: [/* @__PURE__ */ E(d, {
+							children: [/* @__PURE__ */ S(u, {
 								label: "Work (sec)",
 								htmlFor: "drillDuration",
-								children: /* @__PURE__ */ E("input", {
+								children: /* @__PURE__ */ S("input", {
 									id: "drillDuration",
 									inputMode: "numeric",
-									className: f,
-									value: K.durationSec,
-									onChange: (e) => q((t) => ({
+									className: d,
+									value: U.durationSec,
+									onChange: (e) => W((t) => ({
 										...t,
 										durationSec: e.target.value
 									}))
 								})
-							}), /* @__PURE__ */ E(d, {
+							}), /* @__PURE__ */ S(u, {
 								label: "Rest (sec)",
 								htmlFor: "drillRest",
-								children: /* @__PURE__ */ E("input", {
+								children: /* @__PURE__ */ S("input", {
 									id: "drillRest",
 									inputMode: "numeric",
-									className: f,
-									value: K.restSec,
-									onChange: (e) => q((t) => ({
+									className: d,
+									value: U.restSec,
+									onChange: (e) => W((t) => ({
 										...t,
 										restSec: e.target.value
 									}))
 								})
 							})]
 						}),
-						J && /* @__PURE__ */ E("p", {
+						/* @__PURE__ */ C(u, {
+							label: "Demo video",
+							htmlFor: "drillVideo",
+							hint: "Optional — attach a short demo clip; it's stored in workspace files.",
+							children: [/* @__PURE__ */ S("input", {
+								id: "drillVideo",
+								type: "file",
+								accept: "video/*",
+								className: d,
+								onChange: (e) => K(e.target.files?.[0] ?? null)
+							}), G && /* @__PURE__ */ C("p", {
+								className: "mt-1 inline-flex items-center gap-1 text-xs text-text-secondary",
+								children: [
+									/* @__PURE__ */ S(y, { className: "h-3.5 w-3.5" }),
+									" ",
+									G.name
+								]
+							})]
+						}),
+						Y && /* @__PURE__ */ S("p", {
 							className: "text-sm text-status-error-text",
-							children: J
+							children: Y
 						}),
-						/* @__PURE__ */ D(M, { children: [/* @__PURE__ */ E("button", {
+						/* @__PURE__ */ C(O, { children: [/* @__PURE__ */ S("button", {
 							type: "button",
-							onClick: () => G(!1),
+							onClick: () => {
+								H(!1), K(null);
+							},
 							className: "rounded-lg border border-border-seam px-4 py-2 text-sm font-medium text-text-primary transition-colors hover:bg-bg-sunken",
 							children: "Cancel"
-						}), /* @__PURE__ */ D("button", {
+						}), /* @__PURE__ */ C("button", {
 							type: "submit",
-							disabled: H.isPending,
+							disabled: R.isPending || q,
 							className: "inline-flex items-center gap-1.5 rounded-lg bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text transition-colors hover:bg-action-primary-bg/90 disabled:opacity-60",
-							children: [H.isPending && /* @__PURE__ */ E(y, { className: "h-4 w-4 animate-spin" }), "Add drill"]
+							children: [(R.isPending || q) && /* @__PURE__ */ S(b, { className: "h-4 w-4 animate-spin" }), q ? "Uploading video…" : "Add drill"]
 						})] })
 					]
 				})] })
@@ -369,6 +403,6 @@ function L() {
 	});
 }
 //#endregion
-export { L as ProgramDetailPage };
+export { N as ProgramDetailPage };
 
 //# sourceMappingURL=ProgramDetailPage.js.map