@burdenoff/microfe-theculturepost 2026.704.2 → 2026.705.2

package/dist/theculturepost/pages/stories/StoryDetailPage.js

@@ -1,257 +1,575 @@
 import { useTheCulturePost as e } from "../../context/TheCulturePostContext.js";
-import { PageLayout as t } from "../../components/PageLayout.js";
-import { ErrorView as n, LoadingView as r, Section as i } from "../../components/StateViews.js";
+import { cn as t } from "../../utils/cn.js";
 import "../../context/index.js";
-import { FILE_FOLDERS as a } from "../../hooks/useFiles.js";
-import { CoverImage as o } from "../../components/CoverImage.js";
-import { formatEnumLabel as s, formatNumber as c } from "../../utils/formatters.js";
-import { StatusBadge as l } from "../../components/StatusBadge.js";
-import { AuthorLabel as u } from "../../components/AuthorLabel.js";
-import { DiscussionCard as d } from "../../components/DiscussionCard.js";
+import { FILE_FOLDERS as n } from "../../hooks/useFiles.js";
+import { PageHero as r } from "../../components/PageHero.js";
+import { ErrorView as i, LoadingView as a } from "../../components/StateViews.js";
+import { formatDate as o, formatEnumLabel as s, formatNumber as c, formatRelativeTime as l } from "../../utils/formatters.js";
+import { StatusBadge as u } from "../../components/StatusBadge.js";
+import { AuthorLabel as d } from "../../components/AuthorLabel.js";
 import { EmptyState as f } from "../../components/EmptyState.js";
-import { useTcpDiscussions as p, useTcpStory as m, useTcpTopics as h, useTcpTransitionStory as g, useTcpUpdateStory as _ } from "../../hooks/useTcpApi.js";
+import { useTcpCitations as p, useTcpDiscussions as m, useTcpStory as h, useTcpTopics as g, useTcpTransitionStory as _, useTcpUpdateStory as v, useTcpVerifyCitation as y } from "../../hooks/useTcpApi.js";
 import "../../hooks/index.js";
-import { describeError as v, notify as y } from "../../lib/toast.js";
-import { FileUploadField as b } from "../../components/FileUploadField.js";
-import { TagInput as x } from "../../components/TagInput.js";
-import { OpenDiscussionDialog as S } from "../../components/OpenDiscussionDialog.js";
-import { CitationList as C } from "../../components/CitationList.js";
-import { AddCitationDialog as w } from "../../components/AddCitationDialog.js";
-import { useMemo as T, useState as E } from "react";
-import { ArrowLeft as D, BookOpen as O, Clock as k, GitBranch as A, Languages as j, MessagesSquare as M, Pencil as N, Plus as P, Tag as F } from "lucide-react";
-import { useParams as I } from "react-router-dom";
-import { jsx as L, jsxs as R } from "react/jsx-runtime";
-import { Button as z, GlassCard as B, Input as V, Label as H, ResponsiveDialog as U, ResponsiveDialogContent as W, ResponsiveDialogDescription as G, ResponsiveDialogFooter as K, ResponsiveDialogHeader as q, ResponsiveDialogTitle as J, Select as Y, SelectContent as X, SelectItem as Z, SelectTrigger as Q, SelectValue as $, Textarea as ee } from "@burdenoff/fe-libs/ui";
+import { DecorativeDivider as b } from "../../components/DecorativeDivider.js";
+import { describeError as x, notify as S } from "../../lib/toast.js";
+import { Tabs as C } from "../../components/Tabs.js";
+import { TagInput as w } from "../../components/TagInput.js";
+import { OpenDiscussionDialog as T } from "../../components/OpenDiscussionDialog.js";
+import { LifecycleStepper as E } from "../../components/LifecycleStepper.js";
+import { FileUploadField as D } from "../../components/FileUploadField.js";
+import { CitationList as O, VERIFICATIONS as k, VERIFICATION_META as A, sourceTypeIcon as j } from "../../components/CitationList.js";
+import { AddCitationDialog as M } from "../../components/AddCitationDialog.js";
+import { Fragment as N, useMemo as P, useState as F } from "react";
+import { Archive as I, ArrowLeft as L, BookOpen as ee, ChevronDown as te, Clock as ne, GitBranch as R, Languages as re, Lightbulb as ie, Lock as ae, MessagesSquare as z, Pencil as oe, Plus as B, RotateCcw as se, Scroll as V, Send as H, ShieldCheck as U, Sparkles as ce, Tag as le } from "lucide-react";
+import { useParams as ue, useSearchParams as de } from "react-router-dom";
+import { Fragment as fe, jsx as W, jsxs as G } from "react/jsx-runtime";
+import { Button as K, DropdownMenu as pe, DropdownMenuContent as me, DropdownMenuItem as he, DropdownMenuTrigger as ge, GlassCard as q, Input as J, Label as Y, ResponsiveDialog as _e, ResponsiveDialogContent as ve, ResponsiveDialogDescription as ye, ResponsiveDialogFooter as be, ResponsiveDialogHeader as xe, ResponsiveDialogTitle as Se, ResponsiveTable as Ce, Select as X, SelectContent as Z, SelectItem as Q, SelectTrigger as $, SelectValue as we, Textarea as Te } from "@burdenoff/fe-libs/ui";
 //#region src/theculturepost/pages/stories/StoryDetailPage.tsx
-var te = {
+var Ee = {
 	IDEA: ["DRAFT"],
 	DRAFT: ["IN_REVIEW"],
 	IN_REVIEW: ["PUBLISHED", "DRAFT"],
 	PUBLISHED: ["ARCHIVED"],
 	ARCHIVED: ["PUBLISHED"]
-}, ne = {
-	IDEA: "Move to Idea",
-	DRAFT: "Move to Draft",
-	IN_REVIEW: "Send to Review",
-	PUBLISHED: "Publish",
-	ARCHIVED: "Archive"
+}, De = {
+	IDEA: {
+		label: "Move to Idea",
+		icon: ie
+	},
+	DRAFT: {
+		label: "Send back to Draft",
+		icon: se
+	},
+	IN_REVIEW: {
+		label: "Send to Review",
+		icon: H
+	},
+	PUBLISHED: {
+		label: "Publish",
+		icon: H,
+		primary: !0
+	},
+	ARCHIVED: {
+		label: "Archive",
+		icon: I
+	}
 };
-function re() {
-	let { id: a } = I(), { navigateTo: h } = e(), { data: _, isLoading: b, isError: x, refetch: T } = m(a), V = g(), [H, U] = E(!1), [W, G] = E(!1), [K, q] = E(!1), J = p({
-		storyId: a,
+function Oe(e) {
+	switch (A[e].accent) {
+		case "success": return "text-status-success-text";
+		case "warning": return "text-status-warning-text";
+		case "destructive": return "text-status-error-text";
+		default: return "text-text-tertiary";
+	}
+}
+function ke() {
+	let { id: t } = ue(), { navigateTo: n } = e(), [o, l] = de(), f = o.get("view") === "editorial" ? "editorial" : "reading", p = (e) => {
+		l((t) => {
+			let n = new URLSearchParams(t);
+			return e === "editorial" ? n.set("view", "editorial") : n.delete("view"), n;
+		}, { replace: !0 });
+	}, { data: g, isLoading: _, isError: v, refetch: y } = h(t), [b, x] = F(!1), [S, w] = F(!1), [E, D] = F(!1), O = m({
+		storyId: t,
 		pagination: { limit: 20 }
-	}), Y = J.data?.items ?? [], X = /* @__PURE__ */ R(z, {
-		variant: "ghost",
-		size: "sm",
-		onClick: () => h("stories"),
-		children: [/* @__PURE__ */ L(D, { className: "mr-1.5 h-4 w-4" }), " Back"]
-	});
-	if (b) return /* @__PURE__ */ L(t, {
-		title: "Story",
-		actions: X,
-		children: /* @__PURE__ */ L(r, { label: "Loading story…" })
+	}), k = O.data?.items ?? [];
+	if (_) return /* @__PURE__ */ G("div", {
+		className: "mx-auto max-w-6xl p-4 sm:p-6",
+		children: [/* @__PURE__ */ G(K, {
+			variant: "ghost",
+			size: "sm",
+			onClick: () => n("stories"),
+			children: [/* @__PURE__ */ W(L, { className: "mr-1.5 h-4 w-4" }), " Stories"]
+		}), /* @__PURE__ */ W(a, { label: "Loading story…" })]
 	});
-	if (x || !_) return /* @__PURE__ */ L(t, {
-		title: "Story",
-		actions: X,
-		children: /* @__PURE__ */ L(n, {
+	if (v || !g) return /* @__PURE__ */ G("div", {
+		className: "mx-auto max-w-6xl p-4 sm:p-6",
+		children: [/* @__PURE__ */ G(K, {
+			variant: "ghost",
+			size: "sm",
+			onClick: () => n("stories"),
+			children: [/* @__PURE__ */ W(L, { className: "mr-1.5 h-4 w-4" }), " Stories"]
+		}), /* @__PURE__ */ W(i, {
 			title: "Story not found",
 			message: "This story may have been archived, or you may not have access.",
-			onRetry: () => T()
-		})
+			onRetry: () => y()
+		})]
 	});
-	let Z = te[_.status] ?? [], Q = async (e) => {
-		try {
-			await V.mutateAsync({
-				id: _.id,
-				status: e
-			}), y.success("Story updated", `Moved to ${s(e)}`);
-		} catch (e) {
-			y.error("Could not update the story", v(e));
-		}
-	};
-	return /* @__PURE__ */ R(t, {
-		title: _.title,
-		actions: /* @__PURE__ */ R("div", {
-			className: "flex items-center gap-2",
-			children: [X, /* @__PURE__ */ R(z, {
-				variant: "outline",
-				onClick: () => q(!0),
-				children: [/* @__PURE__ */ L(N, { className: "mr-1.5 h-4 w-4" }), " Edit"]
-			})]
+	let A = /* @__PURE__ */ G(fe, { children: [
+		/* @__PURE__ */ W(u, { status: g.format }),
+		/* @__PURE__ */ W(u, { status: g.status }),
+		g.topic && /* @__PURE__ */ G("button", {
+			type: "button",
+			onClick: () => n(`topics/${g.topic.id}`),
+			className: "inline-flex items-center gap-1 rounded-full bg-bg-sunken px-2.5 py-0.5 text-xs font-medium text-text-secondary transition-colors hover:text-text-primary",
+			children: [
+				/* @__PURE__ */ W(le, {
+					className: "h-3 w-3",
+					"aria-hidden": "true"
+				}),
+				" ",
+				g.topic.name
+			]
 		}),
+		/* @__PURE__ */ W("span", {
+			className: "inline-flex items-center gap-1.5 text-xs text-text-tertiary",
+			children: /* @__PURE__ */ W(d, {
+				actorId: g.authorId,
+				prefix: "By",
+				withIcon: !0
+			})
+		}),
+		g.readingMins > 0 && /* @__PURE__ */ G("span", {
+			className: "inline-flex items-center gap-1 text-xs text-text-tertiary",
+			children: [
+				/* @__PURE__ */ W(ne, {
+					className: "h-3.5 w-3.5",
+					"aria-hidden": "true"
+				}),
+				" ",
+				c(g.readingMins),
+				" min read"
+			]
+		}),
+		g.languages.length > 0 && /* @__PURE__ */ G("span", {
+			className: "inline-flex items-center gap-1 text-xs text-text-tertiary",
+			children: [
+				/* @__PURE__ */ W(re, {
+					className: "h-3.5 w-3.5",
+					"aria-hidden": "true"
+				}),
+				" ",
+				g.languages.map(s).join(", ")
+			]
+		})
+	] }), j = [{
+		value: "reading",
+		label: "Reading",
+		icon: /* @__PURE__ */ W(ee, { className: "h-4 w-4" })
+	}, {
+		value: "editorial",
+		label: "Editorial",
+		icon: /* @__PURE__ */ W(R, { className: "h-4 w-4" }),
+		count: g.citations.length
+	}];
+	return /* @__PURE__ */ G("div", {
+		className: "mx-auto flex max-w-6xl flex-col gap-6 p-4 sm:p-6",
 		children: [
-			/* @__PURE__ */ R("article", {
-				className: "mx-auto flex max-w-3xl flex-col gap-6",
+			/* @__PURE__ */ W(r, {
+				eyebrow: "Story",
+				title: g.title,
+				description: g.summary ?? void 0,
+				coverFileId: g.cover?.id ?? void 0,
+				backAction: {
+					label: "Stories",
+					onClick: () => n("stories")
+				},
+				meta: A,
+				actions: /* @__PURE__ */ G(K, {
+					variant: "outline",
+					onClick: () => D(!0),
+					children: [/* @__PURE__ */ W(oe, { className: "mr-1.5 h-4 w-4" }), " Edit"]
+				})
+			}),
+			/* @__PURE__ */ W(C, {
+				items: j,
+				value: f,
+				onChange: p
+			}),
+			f === "reading" ? /* @__PURE__ */ W(Ae, {
+				story: g,
+				discussions: k,
+				discussionsLoading: O.isLoading,
+				onViewCitations: () => p("editorial"),
+				onOpenDiscussion: () => w(!0),
+				onViewAllDiscussions: () => n("discussions"),
+				onOpenDiscussionItem: (e) => n(`discussions/${e.id}`)
+			}) : /* @__PURE__ */ W(Pe, {
+				story: g,
+				onAddCitation: () => x(!0)
+			}),
+			/* @__PURE__ */ W(M, {
+				open: b,
+				onOpenChange: x,
+				storyId: g.id
+			}),
+			/* @__PURE__ */ W(T, {
+				open: S,
+				onOpenChange: w,
+				storyId: g.id,
+				onCreated: (e) => n(`discussions/${e.id}`)
+			}),
+			/* @__PURE__ */ W(Re, {
+				open: E,
+				onOpenChange: D,
+				story: g
+			})
+		]
+	});
+}
+function Ae({ story: e, discussions: t, discussionsLoading: n, onViewCitations: r, onOpenDiscussion: i, onViewAllDiscussions: o, onOpenDiscussionItem: s }) {
+	return /* @__PURE__ */ G("div", {
+		className: "grid grid-cols-1 gap-8 lg:grid-cols-[minmax(0,1fr)_360px]",
+		children: [/* @__PURE__ */ G("article", {
+			className: "min-w-0",
+			children: [/* @__PURE__ */ W(Me, { body: e.body }), e.tags.length > 0 && /* @__PURE__ */ W("div", {
+				className: "mt-8 flex flex-wrap gap-1.5 border-t border-border-seam pt-6",
+				children: e.tags.map((e) => /* @__PURE__ */ G("span", {
+					className: "rounded-full bg-bg-sunken px-2.5 py-0.5 text-xs font-medium text-text-secondary",
+					children: ["#", e]
+				}, e))
+			})]
+		}), /* @__PURE__ */ G("aside", {
+			className: "flex flex-col gap-6 lg:sticky lg:top-4 lg:self-start",
+			children: [/* @__PURE__ */ W(je, {
+				title: "Citations",
+				action: /* @__PURE__ */ W("button", {
+					type: "button",
+					onClick: r,
+					className: "text-xs font-medium text-accent hover:underline",
+					children: "View all"
+				}),
+				children: /* @__PURE__ */ W(O, {
+					storyId: e.id,
+					compact: !0
+				})
+			}), /* @__PURE__ */ W(je, {
+				title: "Linked discussions",
+				action: /* @__PURE__ */ W("button", {
+					type: "button",
+					onClick: o,
+					className: "text-xs font-medium text-accent hover:underline",
+					children: "View all"
+				}),
+				children: n ? /* @__PURE__ */ W(a, {
+					label: "Loading discussions…",
+					className: "min-h-[8rem]"
+				}) : t.length === 0 ? /* @__PURE__ */ W(f, {
+					icon: /* @__PURE__ */ W(z, { className: "h-8 w-8" }),
+					title: "No discussions yet",
+					description: "Open a discussion to invite perspectives on this story.",
+					action: /* @__PURE__ */ G(K, {
+						size: "sm",
+						variant: "outline",
+						onClick: i,
+						children: [/* @__PURE__ */ W(B, { className: "mr-1.5 h-4 w-4" }), " Open discussion"]
+					})
+				}) : /* @__PURE__ */ W("div", {
+					className: "flex flex-col gap-3",
+					children: t.slice(0, 5).map((e) => /* @__PURE__ */ W(Ne, {
+						discussion: e,
+						onOpen: () => s(e)
+					}, e.id))
+				})
+			})]
+		})]
+	});
+}
+function je({ title: e, action: t, children: n }) {
+	return /* @__PURE__ */ G("section", { children: [/* @__PURE__ */ G("div", {
+		className: "mb-3 flex items-center justify-between gap-2",
+		children: [/* @__PURE__ */ W("h2", {
+			className: "font-display text-lg font-semibold text-text-primary",
+			children: e
+		}), t]
+	}), n] });
+}
+function Me({ body: e }) {
+	let n = P(() => (e ?? "").split(/\n{2,}/).map((e) => e.trim()).filter(Boolean), [e]);
+	return n.length === 0 ? /* @__PURE__ */ W("p", {
+		className: "rounded-xl border border-dashed border-border-seam px-4 py-10 text-center text-sm text-text-tertiary",
+		children: "This story has no body yet. Use Edit to write it."
+	}) : /* @__PURE__ */ W("div", {
+		className: "max-w-prose",
+		children: n.map((e, n) => /* @__PURE__ */ G(N, { children: [n === 1 && /* @__PURE__ */ W(b, {}), /* @__PURE__ */ W("p", {
+			className: t("text-[1.05rem] leading-8 text-text-primary", n > 0 && n !== 1 && "mt-5", n === 0 && "first-letter:float-left first-letter:mr-3 first-letter:mt-1 first-letter:font-display first-letter:text-6xl first-letter:font-semibold first-letter:leading-[0.72] first-letter:text-accent"),
+			children: e
+		})] }, n))
+	});
+}
+function Ne({ discussion: e, onOpen: t }) {
+	return /* @__PURE__ */ W("button", {
+		type: "button",
+		onClick: t,
+		className: "w-full rounded-xl border border-border-seam bg-bg-surface p-3 text-left transition-colors hover:border-border-strong",
+		children: /* @__PURE__ */ G("div", {
+			className: "flex items-start gap-2.5",
+			children: [/* @__PURE__ */ W("span", {
+				className: "grid h-8 w-8 shrink-0 place-items-center rounded-lg bg-[var(--color-accent-soft)] text-text-primary",
+				"aria-hidden": "true",
+				children: /* @__PURE__ */ W(z, { className: "h-4 w-4" })
+			}), /* @__PURE__ */ G("div", {
+				className: "min-w-0 flex-1",
 				children: [
-					/* @__PURE__ */ L(o, {
-						fileId: _.cover?.id,
-						alt: _.title,
-						className: "aspect-[16/9] w-full",
-						icon: /* @__PURE__ */ L(O, { className: "h-10 w-10" })
+					/* @__PURE__ */ W("p", {
+						className: "truncate text-sm font-medium text-text-primary",
+						children: e.title
 					}),
-					/* @__PURE__ */ R("div", {
-						className: "flex flex-col gap-3",
-						children: [
-							/* @__PURE__ */ R("div", {
-								className: "flex flex-wrap items-center gap-1.5",
-								children: [
-									/* @__PURE__ */ L(l, { status: _.format }),
-									/* @__PURE__ */ L(l, { status: _.status }),
-									_.topic && /* @__PURE__ */ R("button", {
-										type: "button",
-										onClick: () => h(`topics/${_.topic.id}`),
-										className: "inline-flex items-center gap-1 rounded-full bg-bg-sunken px-2.5 py-0.5 text-xs font-medium text-text-secondary hover:text-text-primary",
-										children: [
-											/* @__PURE__ */ L(F, { className: "h-3 w-3" }),
-											" ",
-											_.topic.name
-										]
-									})
-								]
-							}),
-							_.summary && /* @__PURE__ */ L("p", {
-								className: "text-lg leading-relaxed text-text-secondary",
-								children: _.summary
-							}),
-							/* @__PURE__ */ R("div", {
-								className: "flex flex-wrap items-center gap-x-4 gap-y-1.5 text-sm text-text-tertiary",
-								children: [
-									/* @__PURE__ */ L(u, {
-										actorId: _.authorId,
-										prefix: "By",
-										withIcon: !0
-									}),
-									_.editorId && /* @__PURE__ */ L(u, {
-										actorId: _.editorId,
-										prefix: "Edited by"
-									}),
-									_.readingMins > 0 && /* @__PURE__ */ R("span", {
-										className: "inline-flex items-center gap-1",
-										children: [
-											/* @__PURE__ */ L(k, { className: "h-4 w-4" }),
-											" ",
-											c(_.readingMins),
-											" min read"
-										]
-									}),
-									_.languages.length > 0 && /* @__PURE__ */ R("span", {
-										className: "inline-flex items-center gap-1",
-										children: [
-											/* @__PURE__ */ L(j, { className: "h-4 w-4" }),
-											" ",
-											_.languages.map(s).join(", ")
-										]
-									})
-								]
-							}),
-							_.tags.length > 0 && /* @__PURE__ */ L("div", {
-								className: "flex flex-wrap gap-1.5",
-								children: _.tags.map((e) => /* @__PURE__ */ R("span", {
-									className: "rounded-full bg-bg-sunken px-2.5 py-0.5 text-xs font-medium text-text-secondary",
-									children: ["#", e]
-								}, e))
-							})
-						]
+					e.prompt && /* @__PURE__ */ W("p", {
+						className: "mt-0.5 line-clamp-2 text-xs text-text-tertiary",
+						children: e.prompt
 					}),
-					/* @__PURE__ */ R(B, {
-						treatment: "plain",
-						className: "p-5",
+					/* @__PURE__ */ G("div", {
+						className: "mt-1.5 flex flex-wrap items-center gap-x-2 gap-y-1 text-xs text-text-tertiary",
 						children: [
-							/* @__PURE__ */ R("div", {
-								className: "flex items-center gap-2",
-								children: [/* @__PURE__ */ L(A, { className: "h-4 w-4 text-text-tertiary" }), /* @__PURE__ */ L("h2", {
-									className: "text-sm font-semibold text-text-primary",
-									children: "Editorial lifecycle"
-								})]
+							/* @__PURE__ */ G("span", { children: [
+								c(e.replyCount),
+								" ",
+								e.replyCount === 1 ? "reply" : "replies"
+							] }),
+							/* @__PURE__ */ W("span", {
+								"aria-hidden": "true",
+								children: "·"
 							}),
-							/* @__PURE__ */ R("p", {
-								className: "mt-1 text-sm text-text-secondary",
-								children: [
-									"Current stage:",
-									" ",
-									/* @__PURE__ */ L("span", {
-										className: "font-medium text-text-primary",
-										children: s(_.status)
-									})
-								]
+							/* @__PURE__ */ W("span", { children: l(e.createdAt) }),
+							e.isInterfaith && /* @__PURE__ */ W(u, {
+								status: "Interfaith",
+								icon: /* @__PURE__ */ W(ce, { className: "h-3 w-3" }),
+								className: "ml-0.5"
 							}),
-							Z.length > 0 ? /* @__PURE__ */ L("div", {
-								className: "mt-3 flex flex-wrap gap-2",
-								children: Z.map((e) => /* @__PURE__ */ L(z, {
-									size: "sm",
-									variant: e === "PUBLISHED" ? "default" : "outline",
-									onClick: () => Q(e),
-									disabled: V.isPending,
-									children: ne[e]
-								}, e))
-							}) : /* @__PURE__ */ L("p", {
-								className: "mt-3 text-sm text-text-tertiary",
-								children: "This story is at the end of its lifecycle."
+							e.isLocked && /* @__PURE__ */ G("span", {
+								className: "inline-flex items-center gap-1 text-text-tertiary",
+								children: [/* @__PURE__ */ W(ae, {
+									className: "h-3 w-3",
+									"aria-hidden": "true"
+								}), " Locked"]
 							})
 						]
-					}),
-					_.body ? /* @__PURE__ */ L("div", {
-						className: "whitespace-pre-wrap text-base leading-relaxed text-text-primary",
-						children: _.body
-					}) : /* @__PURE__ */ L("p", {
-						className: "rounded-xl border border-dashed border-border-seam px-4 py-6 text-center text-sm text-text-tertiary",
-						children: "This story has no body yet. Use Edit to write it."
-					}),
-					/* @__PURE__ */ L(i, {
-						title: "Citations",
-						description: "Verifiable sources that ground this story.",
-						action: /* @__PURE__ */ R(z, {
-							size: "sm",
-							variant: "outline",
-							onClick: () => U(!0),
-							children: [/* @__PURE__ */ L(P, { className: "mr-1.5 h-4 w-4" }), " Add citation"]
-						}),
-						children: /* @__PURE__ */ L(C, { storyId: _.id })
-					}),
-					/* @__PURE__ */ L(i, {
-						title: "Discussions",
-						description: "Conversations anchored to this story.",
-						action: /* @__PURE__ */ R(z, {
-							size: "sm",
-							variant: "outline",
-							onClick: () => G(!0),
-							children: [/* @__PURE__ */ L(P, { className: "mr-1.5 h-4 w-4" }), " Open discussion"]
-						}),
-						children: J.isLoading ? /* @__PURE__ */ L(r, { label: "Loading discussions…" }) : Y.length === 0 ? /* @__PURE__ */ L(f, {
-							icon: /* @__PURE__ */ L(M, { className: "h-9 w-9" }),
-							title: "No discussions yet",
-							description: "Open a discussion to invite perspectives on this story."
-						}) : /* @__PURE__ */ L("div", {
-							className: "grid gap-4 md:grid-cols-2",
-							children: Y.map((e) => /* @__PURE__ */ L(d, {
-								discussion: e,
-								onOpen: () => h(`discussions/${e.id}`)
-							}, e.id))
-						})
 					})
 				]
-			}),
-			/* @__PURE__ */ L(w, {
-				open: H,
-				onOpenChange: U,
-				storyId: _.id
-			}),
-			/* @__PURE__ */ L(S, {
-				open: W,
-				onOpenChange: G,
-				storyId: _.id,
-				onCreated: (e) => h(`discussions/${e.id}`)
-			}),
-			/* @__PURE__ */ L(ae, {
-				open: K,
-				onOpenChange: q,
-				story: _
-			})
-		]
+			})]
+		})
+	});
+}
+function Pe({ story: e, onAddCitation: t }) {
+	let n = _(), r = Ee[e.status] ?? [], i = async (t) => {
+		try {
+			await n.mutateAsync({
+				id: e.id,
+				status: t
+			}), S.success("Story updated", `Moved to ${s(t)}`);
+		} catch (e) {
+			S.error("Could not update the story", x(e));
+		}
+	};
+	return /* @__PURE__ */ G("div", {
+		className: "flex flex-col gap-6",
+		children: [/* @__PURE__ */ G(q, {
+			treatment: "plain",
+			className: "p-5 sm:p-6",
+			children: [
+				/* @__PURE__ */ G("div", {
+					className: "flex items-center gap-2.5",
+					children: [/* @__PURE__ */ W("span", {
+						className: "grid h-9 w-9 shrink-0 place-items-center rounded-xl bg-[var(--color-accent-soft)] text-text-primary",
+						"aria-hidden": "true",
+						children: /* @__PURE__ */ W(R, { className: "h-5 w-5" })
+					}), /* @__PURE__ */ W("h2", {
+						className: "font-display text-xl font-semibold text-text-primary",
+						children: "Editorial lifecycle"
+					})]
+				}),
+				/* @__PURE__ */ W(E, {
+					status: e.status,
+					className: "mt-6"
+				}),
+				/* @__PURE__ */ G("div", {
+					className: "mt-6 flex flex-col gap-4 border-t border-border-seam pt-5 md:flex-row md:items-center md:justify-between",
+					children: [r.length > 0 ? /* @__PURE__ */ W("div", {
+						className: "flex flex-wrap gap-2",
+						children: r.map((e) => {
+							let t = De[e], r = t.icon;
+							return /* @__PURE__ */ G(K, {
+								variant: t.primary ? "default" : "outline",
+								onClick: () => i(e),
+								disabled: n.isPending,
+								children: [/* @__PURE__ */ W(r, {
+									className: "mr-1.5 h-4 w-4",
+									"aria-hidden": "true"
+								}), t.label]
+							}, e);
+						})
+					}) : /* @__PURE__ */ W("p", {
+						className: "text-sm text-text-tertiary",
+						children: "This story is at the end of its lifecycle."
+					}), /* @__PURE__ */ G("p", {
+						className: "flex items-center gap-2 text-sm text-text-secondary",
+						children: [/* @__PURE__ */ W(U, {
+							className: "h-4 w-4 shrink-0 text-text-tertiary",
+							"aria-hidden": "true"
+						}), "Reviewed with fact and sensitivity care before publishing."]
+					})]
+				})
+			]
+		}), /* @__PURE__ */ G(q, {
+			treatment: "plain",
+			className: "p-5 sm:p-6",
+			children: [
+				/* @__PURE__ */ G("div", {
+					className: "flex flex-wrap items-center justify-between gap-3",
+					children: [/* @__PURE__ */ G("div", {
+						className: "flex items-center gap-2.5",
+						children: [/* @__PURE__ */ W("span", {
+							className: "grid h-9 w-9 shrink-0 place-items-center rounded-xl bg-[var(--color-accent-soft)] text-text-primary",
+							"aria-hidden": "true",
+							children: /* @__PURE__ */ W(V, { className: "h-5 w-5" })
+						}), /* @__PURE__ */ G("div", { children: [/* @__PURE__ */ W("h2", {
+							className: "font-display text-xl font-semibold text-text-primary",
+							children: "Citations"
+						}), /* @__PURE__ */ W("p", {
+							className: "text-sm text-text-secondary",
+							children: "Verifiable sources that ground this story."
+						})] })]
+					}), /* @__PURE__ */ G(K, {
+						variant: "outline",
+						onClick: t,
+						children: [/* @__PURE__ */ W(B, { className: "mr-1.5 h-4 w-4" }), " Add citation"]
+					})]
+				}),
+				/* @__PURE__ */ W(Fe, {
+					storyId: e.id,
+					className: "mt-5"
+				}),
+				/* @__PURE__ */ G("p", {
+					className: "mt-4 flex items-center gap-2 border-t border-border-seam pt-4 text-xs text-text-tertiary",
+					children: [/* @__PURE__ */ W(U, {
+						className: "h-3.5 w-3.5 shrink-0",
+						"aria-hidden": "true"
+					}), "All sources are evaluated for accuracy, relevance, and cultural sensitivity."]
+				})
+			]
+		})]
+	});
+}
+function Fe({ storyId: e, className: n }) {
+	let { data: r, isLoading: s, isError: c, refetch: l } = p(e);
+	return s ? /* @__PURE__ */ W(a, {
+		label: "Loading citations…",
+		className: n
+	}) : c ? /* @__PURE__ */ W("div", {
+		className: n,
+		children: /* @__PURE__ */ W(i, {
+			message: "We couldn't load citations.",
+			onRetry: () => l()
+		})
+	}) : /* @__PURE__ */ W(Ce, {
+		className: n,
+		columns: [
+			{
+				key: "source",
+				header: "Source",
+				priority: "primary",
+				cell: (e) => {
+					let t = j(e.sourceType), n = [e.author, e.publisher].filter((e) => e && e.trim()).join(" · ");
+					return /* @__PURE__ */ G("div", {
+						className: "flex min-w-0 items-start gap-3",
+						children: [/* @__PURE__ */ W("span", {
+							className: "grid h-9 w-9 shrink-0 place-items-center rounded-lg bg-[var(--color-accent-soft)] text-text-primary",
+							"aria-hidden": "true",
+							children: /* @__PURE__ */ W(t, { className: "h-4 w-4" })
+						}), /* @__PURE__ */ G("div", {
+							className: "min-w-0",
+							children: [
+								/* @__PURE__ */ W("p", {
+									className: "font-medium text-text-primary",
+									children: e.title
+								}),
+								e.excerpt && /* @__PURE__ */ W("p", {
+									className: "mt-0.5 line-clamp-1 text-xs italic text-text-tertiary",
+									children: e.excerpt
+								}),
+								n && /* @__PURE__ */ W("p", {
+									className: "mt-0.5 text-xs text-text-tertiary",
+									children: n
+								})
+							]
+						})]
+					});
+				}
+			},
+			{
+				key: "type",
+				header: "Type",
+				cell: (e) => /* @__PURE__ */ W(u, {
+					status: e.sourceType,
+					icon: /* @__PURE__ */ W(j(e.sourceType), { className: "h-3 w-3" })
+				})
+			},
+			{
+				key: "added",
+				header: "Added on",
+				priority: "hidden-on-mobile",
+				cell: (e) => /* @__PURE__ */ W("span", {
+					className: "whitespace-nowrap text-sm text-text-secondary",
+					children: o(e.createdAt)
+				})
+			},
+			{
+				key: "verification",
+				header: "Status",
+				cell: (e) => {
+					let n = A[e.verification].icon;
+					return /* @__PURE__ */ W(u, {
+						status: e.verification,
+						icon: /* @__PURE__ */ W(n, { className: t("h-3 w-3", Oe(e.verification)) })
+					});
+				}
+			},
+			{
+				key: "actions",
+				header: "Actions",
+				headerClassName: "text-right",
+				cellClassName: "text-right",
+				cell: (e) => /* @__PURE__ */ W(Ie, { citation: e })
+			}
+		],
+		data: r ?? [],
+		rowKey: (e) => e.id,
+		emptyState: /* @__PURE__ */ W(f, {
+			icon: /* @__PURE__ */ W(V, { className: "h-9 w-9" }),
+			title: "No citations yet",
+			description: "Add verifiable sources to ground this story in the record."
+		})
 	});
 }
-var ie = [
+function Ie({ citation: e }) {
+	let n = y(), r = async (t) => {
+		if (t !== e.verification) try {
+			await n.mutateAsync({
+				id: e.id,
+				verification: t
+			}), S.success("Verification updated", s(t));
+		} catch (e) {
+			S.error("Could not update verification", x(e));
+		}
+	};
+	return /* @__PURE__ */ G(pe, { children: [/* @__PURE__ */ W(ge, {
+		asChild: !0,
+		children: /* @__PURE__ */ G(K, {
+			size: "sm",
+			variant: "outline",
+			disabled: n.isPending,
+			"aria-label": `Change verification for ${e.title}`,
+			children: ["Verify ", /* @__PURE__ */ W(te, {
+				className: "ml-1 h-4 w-4",
+				"aria-hidden": "true"
+			})]
+		})
+	}), /* @__PURE__ */ W(me, {
+		align: "end",
+		children: k.map((n) => {
+			let i = A[n], a = i.icon;
+			return /* @__PURE__ */ G(he, {
+				onSelect: () => r(n),
+				className: t("gap-2", n === e.verification && "font-semibold"),
+				children: [/* @__PURE__ */ W(a, {
+					className: t("h-4 w-4", Oe(n)),
+					"aria-hidden": "true"
+				}), i.label]
+			}, n);
+		})
+	})] });
+}
+var Le = [
 	"ARTICLE",
 	"ESSAY",
 	"EXPLAINER",
@@ -259,160 +577,160 @@ var ie = [
 	"PHOTO_STORY",
 	"TIMELINE"
 ];
-function ae({ open: e, onOpenChange: t, story: n }) {
-	let r = _(), i = h({ pagination: { limit: 100 } }), [o, c] = E(n.title), [l, u] = E(n.summary ?? ""), [d, f] = E(n.body ?? ""), [p, m] = E(n.format), [g, S] = E(n.topicId ?? ""), [C, w] = E(n.languages), [D, O] = E(n.tags), [k, A] = E(n.readingMins ? String(n.readingMins) : ""), [j, M] = E(n.cover?.id ?? null), [N, P] = E(null), F = T(() => `${n.id}:${n.updatedAt}`, [n.id, n.updatedAt]), [I, B] = E(F);
-	return I !== F && (B(F), c(n.title), u(n.summary ?? ""), f(n.body ?? ""), m(n.format), S(n.topicId ?? ""), w(n.languages), O(n.tags), A(n.readingMins ? String(n.readingMins) : ""), M(n.cover?.id ?? null), P(null)), /* @__PURE__ */ L(U, {
+function Re({ open: e, onOpenChange: t, story: r }) {
+	let i = v(), a = g({ pagination: { limit: 100 } }), [o, c] = F(r.title), [l, u] = F(r.summary ?? ""), [d, f] = F(r.body ?? ""), [p, m] = F(r.format), [h, _] = F(r.topicId ?? ""), [y, b] = F(r.languages), [C, T] = F(r.tags), [E, O] = F(r.readingMins ? String(r.readingMins) : ""), [k, A] = F(r.cover?.id ?? null), [j, M] = F(null), N = P(() => `${r.id}:${r.updatedAt}`, [r.id, r.updatedAt]), [I, L] = F(N);
+	return I !== N && (L(N), c(r.title), u(r.summary ?? ""), f(r.body ?? ""), m(r.format), _(r.topicId ?? ""), b(r.languages), T(r.tags), O(r.readingMins ? String(r.readingMins) : ""), A(r.cover?.id ?? null), M(null)), /* @__PURE__ */ W(_e, {
 		open: e,
 		onOpenChange: t,
-		children: /* @__PURE__ */ R(W, {
+		children: /* @__PURE__ */ G(ve, {
 			className: "sm:max-w-lg",
 			children: [
-				/* @__PURE__ */ R(q, { children: [/* @__PURE__ */ L(J, { children: "Edit story" }), /* @__PURE__ */ L(G, { children: "Refine the story. The URL slug is fixed once created." })] }),
-				/* @__PURE__ */ R("div", {
+				/* @__PURE__ */ G(xe, { children: [/* @__PURE__ */ W(Se, { children: "Edit story" }), /* @__PURE__ */ W(ye, { children: "Refine the story. The URL slug is fixed once created." })] }),
+				/* @__PURE__ */ G("div", {
 					className: "flex max-h-[62vh] flex-col gap-4 overflow-y-auto py-2",
 					children: [
-						/* @__PURE__ */ R("div", {
+						/* @__PURE__ */ G("div", {
 							className: "grid gap-1.5",
-							children: [/* @__PURE__ */ L(H, { children: "Cover image" }), /* @__PURE__ */ L(b, {
-								folder: a.covers,
+							children: [/* @__PURE__ */ W(Y, { children: "Cover image" }), /* @__PURE__ */ W(D, {
+								folder: n.covers,
 								accept: "image/*",
 								label: "Upload cover",
-								fileId: j,
-								onUploaded: M,
-								onCleared: () => M(null)
+								fileId: k,
+								onUploaded: A,
+								onCleared: () => A(null)
 							})]
 						}),
-						/* @__PURE__ */ R("div", {
+						/* @__PURE__ */ G("div", {
 							className: "grid gap-1.5",
-							children: [/* @__PURE__ */ L(H, {
+							children: [/* @__PURE__ */ W(Y, {
 								htmlFor: "edit-title",
 								children: "Title"
-							}), /* @__PURE__ */ L(V, {
+							}), /* @__PURE__ */ W(J, {
 								id: "edit-title",
 								value: o,
 								onChange: (e) => c(e.target.value)
 							})]
 						}),
-						/* @__PURE__ */ R("div", {
+						/* @__PURE__ */ G("div", {
 							className: "grid grid-cols-2 gap-3",
-							children: [/* @__PURE__ */ R("div", {
+							children: [/* @__PURE__ */ G("div", {
 								className: "grid gap-1.5",
-								children: [/* @__PURE__ */ L(H, { children: "Format" }), /* @__PURE__ */ R(Y, {
+								children: [/* @__PURE__ */ W(Y, { children: "Format" }), /* @__PURE__ */ G(X, {
 									value: p,
 									onValueChange: (e) => m(e),
-									children: [/* @__PURE__ */ L(Q, { children: /* @__PURE__ */ L($, {}) }), /* @__PURE__ */ L(X, { children: ie.map((e) => /* @__PURE__ */ L(Z, {
+									children: [/* @__PURE__ */ W($, { children: /* @__PURE__ */ W(we, {}) }), /* @__PURE__ */ W(Z, { children: Le.map((e) => /* @__PURE__ */ W(Q, {
 										value: e,
 										children: s(e)
 									}, e)) })]
 								})]
-							}), /* @__PURE__ */ R("div", {
+							}), /* @__PURE__ */ G("div", {
 								className: "grid gap-1.5",
-								children: [/* @__PURE__ */ L(H, {
+								children: [/* @__PURE__ */ W(Y, {
 									htmlFor: "edit-reading",
 									children: "Reading time (min)"
-								}), /* @__PURE__ */ L(V, {
+								}), /* @__PURE__ */ W(J, {
 									id: "edit-reading",
 									type: "number",
 									min: 0,
-									value: k,
-									onChange: (e) => A(e.target.value)
+									value: E,
+									onChange: (e) => O(e.target.value)
 								})]
 							})]
 						}),
-						/* @__PURE__ */ R("div", {
+						/* @__PURE__ */ G("div", {
 							className: "grid gap-1.5",
-							children: [/* @__PURE__ */ L(H, { children: "Topic" }), /* @__PURE__ */ R(Y, {
-								value: g,
-								onValueChange: S,
-								children: [/* @__PURE__ */ L(Q, { children: /* @__PURE__ */ L($, { placeholder: "Choose a topic (optional)" }) }), /* @__PURE__ */ L(X, { children: (i.data?.items ?? []).map((e) => /* @__PURE__ */ L(Z, {
+							children: [/* @__PURE__ */ W(Y, { children: "Topic" }), /* @__PURE__ */ G(X, {
+								value: h,
+								onValueChange: _,
+								children: [/* @__PURE__ */ W($, { children: /* @__PURE__ */ W(we, { placeholder: "Choose a topic (optional)" }) }), /* @__PURE__ */ W(Z, { children: (a.data?.items ?? []).map((e) => /* @__PURE__ */ W(Q, {
 									value: e.id,
 									children: e.name
 								}, e.id)) })]
 							})]
 						}),
-						/* @__PURE__ */ R("div", {
+						/* @__PURE__ */ G("div", {
 							className: "grid gap-1.5",
-							children: [/* @__PURE__ */ L(H, {
+							children: [/* @__PURE__ */ W(Y, {
 								htmlFor: "edit-summary",
 								children: "Summary"
-							}), /* @__PURE__ */ L(ee, {
+							}), /* @__PURE__ */ W(Te, {
 								id: "edit-summary",
 								value: l,
 								onChange: (e) => u(e.target.value),
 								rows: 2
 							})]
 						}),
-						/* @__PURE__ */ R("div", {
+						/* @__PURE__ */ G("div", {
 							className: "grid gap-1.5",
-							children: [/* @__PURE__ */ L(H, {
+							children: [/* @__PURE__ */ W(Y, {
 								htmlFor: "edit-body",
 								children: "Body"
-							}), /* @__PURE__ */ L(ee, {
+							}), /* @__PURE__ */ W(Te, {
 								id: "edit-body",
 								value: d,
 								onChange: (e) => f(e.target.value),
 								rows: 6
 							})]
 						}),
-						/* @__PURE__ */ R("div", {
+						/* @__PURE__ */ G("div", {
 							className: "grid gap-1.5",
-							children: [/* @__PURE__ */ L(H, {
+							children: [/* @__PURE__ */ W(Y, {
 								htmlFor: "edit-langs",
 								children: "Languages"
-							}), /* @__PURE__ */ L(x, {
+							}), /* @__PURE__ */ W(w, {
 								id: "edit-langs",
-								value: C,
-								onChange: w,
+								value: y,
+								onChange: b,
 								preserveCase: !0
 							})]
 						}),
-						/* @__PURE__ */ R("div", {
+						/* @__PURE__ */ G("div", {
 							className: "grid gap-1.5",
-							children: [/* @__PURE__ */ L(H, {
+							children: [/* @__PURE__ */ W(Y, {
 								htmlFor: "edit-tags",
 								children: "Tags"
-							}), /* @__PURE__ */ L(x, {
+							}), /* @__PURE__ */ W(w, {
 								id: "edit-tags",
-								value: D,
-								onChange: O
+								value: C,
+								onChange: T
 							})]
 						}),
-						N && /* @__PURE__ */ L("p", {
+						j && /* @__PURE__ */ W("p", {
 							className: "text-sm text-status-error-text",
-							children: N
+							children: j
 						})
 					]
 				}),
-				/* @__PURE__ */ R(K, { children: [/* @__PURE__ */ L(z, {
+				/* @__PURE__ */ G(be, { children: [/* @__PURE__ */ W(K, {
 					variant: "outline",
 					onClick: () => t(!1),
 					children: "Cancel"
-				}), /* @__PURE__ */ L(z, {
+				}), /* @__PURE__ */ W(K, {
 					onClick: async () => {
 						if (!o.trim()) {
-							P("A title is required.");
+							M("A title is required.");
 							return;
 						}
 						try {
-							await r.mutateAsync({
-								id: n.id,
+							await i.mutateAsync({
+								id: r.id,
 								input: {
 									title: o.trim(),
 									summary: l.trim() || null,
 									body: d.trim() || null,
 									format: p,
-									topicId: g || null,
-									languages: C,
-									tags: D,
-									readingMins: k ? Number(k) : null,
-									coverFileId: j
+									topicId: h || null,
+									languages: y,
+									tags: C,
+									readingMins: E ? Number(E) : null,
+									coverFileId: k
 								}
-							}), y.success("Story updated", o.trim()), t(!1);
+							}), S.success("Story updated", o.trim()), t(!1);
 						} catch (e) {
-							P(v(e));
+							M(x(e));
 						}
 					},
-					disabled: r.isPending,
+					disabled: i.isPending,
 					children: "Save changes"
 				})] })
 			]
@@ -420,6 +738,6 @@ function ae({ open: e, onOpenChange: t, story: n }) {
 	});
 }
 //#endregion
-export { re as StoryDetailPage };
+export { ke as StoryDetailPage };
 
 //# sourceMappingURL=StoryDetailPage.js.map