@anthusai/papyrus 1.4.0-next.4 → 1.4.0-next.6

package/components/news-desk-taxonomy-client.ts

@@ -2,7 +2,7 @@
 
 import { isEditorialWorkAssignment } from "../lib/newsroom-assignments";
 import { isLocalPreviewEnabled } from "../lib/local-preview";
-import { createLocalPreviewAssignments, createLocalPreviewContentItemVersions, createLocalPreviewReferences } from "../lib/local-preview-seed";
+import { createLocalPreviewRealPublishedVersions, createLocalPreviewAssignments, createLocalPreviewContentItemVersions, createLocalPreviewReferences } from "../lib/local-preview-seed";
 import { generateClient } from "aws-amplify/data";
 import { testEditorOverrideAllowed } from "../lib/test-editor-override";
 import { downloadData, getUrl } from "aws-amplify/storage";
@@ -691,16 +691,11 @@ type NewsroomSemanticRelationPageOptions = NewsroomPageOptions & {
 
 export type ForumThreadWithMessages = MessageThreadRecord & {
   messages: MessageRecord[];
-  scope: "edition" | "section" | "insight";
+  scope: "edition" | "section";
   sectionKey?: string | null;
   sectionTitle?: string | null;
 };
 
-export type InsightForumThreadsPage = {
-  threads: ForumThreadWithMessages[];
-  nextToken: string | null;
-};
-
 export type EditionForumThreadsResult = {
   editionId: string;
   editionThreads: ForumThreadWithMessages[];
@@ -1098,6 +1093,27 @@ export async function loadEditorProcedureData(): Promise<{
   };
 }
 
+const UPDATE_ASSIGNMENT_DESK_MUTATION = `
+  mutation UpdateAssignmentDesk($input: UpdateAssignmentInput!) {
+    updateAssignment(input: $input) { id sectionId sectionKey }
+  }
+`;
+
+/** Puts an assignment on a desk's board, or takes it off every desk when `deskId` is null. */
+export async function saveNewsroomAssignmentDesk(assignmentId: string, deskId: string | null): Promise<void> {
+  if (isLocalPreviewEnabled()) return;
+  const dataClient = generateClient<Schema>();
+  const graphClient = dataClient as unknown as {
+    graphql: (options: Record<string, unknown>) => Promise<{ data?: Record<string, unknown> | null; errors?: unknown[] | null }>;
+  };
+  const response = await graphClient.graphql({
+    query: UPDATE_ASSIGNMENT_DESK_MUTATION,
+    variables: { input: { id: assignmentId, sectionId: deskId, sectionKey: deskId } },
+    authMode: USER_POOL_AUTH_MODE,
+  });
+  assertNoGraphQLErrors(response.errors);
+}
+
 export async function saveProcedureDefinitionRecord(input: Record<string, unknown>) {
   const dataClient = generateClient<Schema>();
   const graphClient = dataClient as unknown as {
@@ -1278,148 +1294,6 @@ export async function loadEditionForumThreads(options: {
   };
 }
 
-export async function loadInsightForumThreads(options: {
-  domain?: string;
-  limit?: number;
-  nextToken?: string | null;
-  includeMessages?: boolean;
-} = {}): Promise<InsightForumThreadsPage> {
-  const testMock = getTestEditorNewsroomMock();
-  if (testMock?.insightForumThreads) {
-    const domain = String(options.domain || "").trim();
-    let threads = testMock.insightForumThreads;
-    if (domain) threads = threads.filter((thread) => thread.sectionKey === domain);
-    return { threads, nextToken: null };
-  }
-
-  const limit = Math.max(1, Math.min(options.limit ?? NEWSROOM_PAGE_LIMIT, 100));
-  const domain = String(options.domain || "").trim();
-  const includeMessages = options.includeMessages !== false;
-  type KindConnectionResponse = {
-    listMessagesByKindAndCreatedAt?: {
-      items?: Array<MessageRecord | null> | null;
-      nextToken?: string | null;
-    } | null;
-  };
-  const response: KindConnectionResponse = await runGraphql<KindConnectionResponse>(
-    LIST_MESSAGES_BY_KIND_AND_CREATED_AT_QUERY,
-    {
-      messageKind: "insight",
-      sortDirection: "DESC",
-      limit,
-      nextToken: options.nextToken ?? null,
-    },
-  );
-  const connection = response.listMessagesByKindAndCreatedAt;
-  const roots = (connection?.items ?? [])
-    .filter(Boolean)
-    .map((item) => normalizeMessageRecord(item as MessageRecord))
-    .filter(isInsightThreadRootMessage)
-    .filter((message) => !domain || message.messageDomain === domain);
-
-  const threads = await Promise.all(roots.map(async (root) => {
-    const messages = includeMessages
-      ? await loadInsightThreadMessages(root.id, root)
-      : [root];
-    return buildInsightForumThread(root, messages);
-  }));
-
-  return {
-    threads,
-    nextToken: connection?.nextToken ?? null,
-  };
-}
-
-export async function loadInsightForumThreadById(
-  threadId: string,
-  options: { includeMessages?: boolean } = {},
-): Promise<ForumThreadWithMessages | null> {
-  const normalized = String(threadId || "").trim();
-  if (!normalized) return null;
-  const testMock = getTestEditorNewsroomMock();
-  if (testMock?.insightForumThreads) {
-    return testMock.insightForumThreads.find((thread) => thread.id === normalized) ?? null;
-  }
-  const root = await getMessageRecordById(normalized);
-  if (!root || !isInsightThreadRootMessage(root)) return null;
-  const includeMessages = options.includeMessages !== false;
-  const messages = includeMessages
-    ? await loadInsightThreadMessages(normalized, root)
-    : [root];
-  return buildInsightForumThread(root, messages);
-}
-
-export async function appendInsightThreadReplyRecord(input: {
-  threadId: string;
-  summary: string;
-  content: string;
-  role?: string;
-  authorLabel?: string;
-  parentMessageId?: string | null;
-  metadata?: Record<string, unknown>;
-}): Promise<MessageRecord> {
-  const threadId = String(input.threadId || "").trim();
-  const summary = String(input.summary || "").trim();
-  const content = String(input.content || "").trim();
-  if (!threadId) throw new Error("threadId is required");
-  if (!summary) throw new Error("summary is required");
-  if (!content) throw new Error("content is required");
-  const root = await getMessageRecordById(threadId);
-  if (!root || !isInsightThreadRootMessage(root)) throw new Error(`Insight thread not found: ${threadId}`);
-  const existing = await listMessagesByThreadId(threadId, 1000);
-  const nextSequence = Math.max(1, ...existing.map((message) => Number(message.sequenceNumber || 0))) + 1;
-  const now = new Date().toISOString();
-  const message: MessageRecord = {
-    id: `message-insight-reply-${safeForumId(threadId)}-${String(nextSequence).padStart(4, "0")}`,
-    messageKind: "insight_reply",
-    messageDomain: root.messageDomain ?? "knowledge",
-    status: "active",
-    summary,
-    source: "newsroom.insights",
-    authorLabel: input.authorLabel?.trim() || "editor",
-    threadId,
-    parentMessageId: input.parentMessageId?.trim() || null,
-    sequenceNumber: nextSequence,
-    role: input.role || "human",
-    messageType: "insight_forum_reply",
-    content,
-    metadata: input.metadata ?? {},
-    createdAt: now,
-    updatedAt: now,
-    newsroomFeedKey: "messages",
-  };
-  const created = await runGraphql<{ createMessage?: MessageRecord | null }>(
-    CREATE_MESSAGE_MUTATION,
-    { input: message },
-  );
-  return normalizeMessageRecord(created.createMessage ?? message);
-}
-
-export async function deleteInsightThreadMessageRecord(input: {
-  threadId: string;
-  messageId: string;
-}): Promise<MessageRecord> {
-  const threadId = String(input.threadId || "").trim();
-  const messageId = String(input.messageId || "").trim();
-  if (!threadId) throw new Error("threadId is required");
-  if (!messageId) throw new Error("messageId is required");
-  const existing = await listMessagesByThreadId(threadId, 1000);
-  const target = existing.find((message) => message.id === messageId);
-  if (!target) throw new Error(`Message not found in thread: ${messageId}`);
-  const now = new Date().toISOString();
-  const updatedMessage = await runGraphql<{ updateMessage?: MessageRecord | null }>(
-    UPDATE_MESSAGE_MUTATION,
-    {
-      input: {
-        id: target.id,
-        status: "deleted",
-        updatedAt: now,
-      },
-    },
-  );
-  return normalizeMessageRecord(updatedMessage.updateMessage ?? { ...target, status: "deleted", updatedAt: now });
-}
-
 export async function ensureEditionForumThreadRecord(input: {
   editionId: string;
   title?: string;
@@ -1683,14 +1557,6 @@ async function listMessagesByThreadId(threadId: string, limit = 400): Promise<Me
   return records;
 }
 
-function isInsightThreadRootMessage(message: MessageRecord): boolean {
-  if (String(message.messageKind || "") !== "insight") return false;
-  const threadId = String(message.threadId || "").trim();
-  const sequenceNumber = Number(message.sequenceNumber || 0);
-  if (threadId && threadId !== message.id && sequenceNumber > 1) return false;
-  return true;
-}
-
 async function getMessageRecordById(messageId: string): Promise<MessageRecord | null> {
   const normalized = String(messageId || "").trim();
   if (!normalized) return null;
@@ -1702,66 +1568,6 @@ async function getMessageRecordById(messageId: string): Promise<MessageRecord |
   return message ? normalizeMessageRecord(message) : null;
 }
 
-async function loadInsightThreadMessages(threadId: string, root: MessageRecord): Promise<MessageRecord[]> {
-  const threadMessages = await listMessagesByThreadId(threadId, 500);
-  const byId = new Map<string, MessageRecord>();
-  byId.set(root.id, root);
-  for (const message of threadMessages) byId.set(message.id, message);
-  const merged = [...byId.values()].sort(
-    (left, right) => Number(left.sequenceNumber ?? 0) - Number(right.sequenceNumber ?? 0),
-  );
-  return hydrateMessageRecordsContent(merged);
-}
-
-function insightForumThreadTitle(root: MessageRecord): string {
-  const metadata = normalizeJsonValue(root.metadata);
-  if (metadata && typeof metadata === "object" && !Array.isArray(metadata)) {
-    const explicit = String((metadata as Record<string, unknown>).insightTitle || "").trim();
-    if (explicit) return explicit;
-  }
-  const summary = String(root.summary || "").trim();
-  return summary || "Insight";
-}
-
-function buildInsightForumThread(root: MessageRecord, messages: MessageRecord[]): ForumThreadWithMessages {
-  const activeMessages = messages.filter((message) => String(message.status || "active") === "active");
-  const sorted = [...activeMessages].sort(
-    (left, right) => Number(left.sequenceNumber ?? 0) - Number(right.sequenceNumber ?? 0),
-  );
-  const lastMessage = sorted.at(-1) ?? root;
-  const activityAt = lastMessage.updatedAt ?? lastMessage.createdAt ?? root.updatedAt ?? root.createdAt;
-  return {
-    id: root.id,
-    threadKind: "insight_forum",
-    status: "active",
-    title: insightForumThreadTitle(root),
-    summary: formatInsightForumDomainLabel(root.messageDomain),
-    primaryAnchorKind: "message",
-    primaryAnchorId: root.id,
-    primaryAnchorLineageId: root.id,
-    primaryAnchorKey: `message#${root.id}`,
-    createdByLabel: root.authorLabel ?? null,
-    messageCount: sorted.length,
-    lastMessageId: lastMessage.id,
-    lastMessageAt: activityAt,
-    metadata: normalizeJsonValue(root.metadata) as Record<string, unknown>,
-    createdAt: root.createdAt,
-    updatedAt: activityAt,
-    newsroomFeedKey: "messages",
-    messages: sorted.length ? sorted : [root],
-    scope: "insight",
-    sectionKey: root.messageDomain ?? null,
-  };
-}
-
-function formatInsightForumDomainLabel(domain: string | null | undefined): string {
-  const value = String(domain || "").trim();
-  if (value === "assignment_work") return "Assignment research";
-  if (value === "knowledge") return "Reference knowledge";
-  if (!value) return "Insight";
-  return value.replace(/_/g, " ");
-}
-
 async function hydrateMessageRecordsContent(messages: MessageRecord[]): Promise<MessageRecord[]> {
   return Promise.all(messages.map(async (message) => {
     try {
@@ -2167,7 +1973,7 @@ export async function loadNewsroomAssignmentPage(options: NewsroomAssignmentPage
 const CONTENT_ITEMS_BY_STAGE_QUERY = `
   query ListItemsByStageAndUpdatedAt($stage: String!, $sortDirection: ModelSortDirection, $limit: Int, $nextToken: String) {
     listItemsByStageAndUpdatedAt(stage: $stage, sortDirection: $sortDirection, limit: $limit, nextToken: $nextToken) {
-      items { id lineageId versionNumber stage type status title headline slug section updatedAt }
+      items { id lineageId versionNumber stage type status title headline deck metadata slug section updatedAt }
       nextToken
     }
   }
@@ -2237,7 +2043,7 @@ type PublishedItemBoardRow = {
 };
 
 export async function loadNewsroomPublishedContentItemVersions(): Promise<ContentItemVersionRecord[]> {
-  if (isLocalPreviewEnabled()) return [];
+  if (isLocalPreviewEnabled()) return createLocalPreviewRealPublishedVersions();
   configureAmplifyClient();
   const client = generateClient<Schema>() as unknown as {
     graphql: (options: Record<string, unknown>) => Promise<GraphQLConnectionResponse<PublishedItemBoardRow>>;
@@ -2691,7 +2497,6 @@ export function hasTestEditorOverride(): boolean {
 
 type TestEditorNewsroomMock = {
   forumThreadsByEdition?: Record<string, ForumThreadWithMessages[]>;
-  insightForumThreads?: ForumThreadWithMessages[];
   messages?: MessageRecord[];
   payloads?: Record<string, HydratedModelPayload[]>;
   referenceAttachments?: ReferenceAttachmentRecord[];

package/components/newsroom-article-editor.tsx

@@ -14,10 +14,15 @@ import {
   DialogTitle,
 } from "./ui/dialog";
 import { Input } from "./ui/input";
-import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "./ui/select";
+import { isLocalPreviewEnabled } from "../lib/local-preview";
+import { newsroomDeskOptions } from "../lib/newsroom-sections";
+import { StoryReportingTrailView } from "./story-reporting-trail";
+import { loadStoryReportingTrail } from "./story-reporting-trail-client";
+import { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectTrigger, SelectValue } from "./ui/select";
 import { Spinner } from "./ui/spinner";
 import { Tabs, TabsList, TabsTrigger } from "./ui/tabs";
 import { Textarea } from "./ui/textarea";
+import { FRONT_MATTER_BLURB_KEY, FRONT_MATTER_SUBTITLE_KEY, FRONT_MATTER_TITLE_KEY, readFrontMatterText, writeFrontMatterText } from "../lib/front-matter-fields";
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "./ui/tooltip";
 import { ContentActionFailure, type ContentActionError } from "../lib/content-actions-client";
 import { newsroomHref } from "../lib/newsroom-base-path";
@@ -59,7 +64,7 @@ type ValidationState =
   | { status: "unavailable"; message: string };
 
 type Notice = { tone: "ok" | "error" | "info"; text: string };
-type MobileTab = "edit" | "preview";
+type MobileTab = "edit" | "preview" | "trail" | "references";
 
 function lineStartIndex(text: string, line: number): number {
   let index = 0;
@@ -91,10 +96,15 @@ function failureMessage(error: unknown): string {
   return error instanceof Error ? error.message : "The request failed.";
 }
 
+const NO_DESK_VALUE = "__no-desk__";
+
 export function NewsroomArticleEditor({ articleId, demo, embedded = false }: { articleId: string; demo: boolean; embedded?: boolean }) {
   const session = useOptionalNewsDeskClient();
-  const blocked = !demo && articlesAccessBlocked(session?.shell.phase);
-  const backend: ArticlesBackend = useMemo(() => resolveArticlesBackend(demo), [demo]);
+  const blocked = !(demo || isLocalPreviewEnabled()) && articlesAccessBlocked(session?.shell.phase);
+  const previewMode = demo || isLocalPreviewEnabled();
+  const backend: ArticlesBackend = useMemo(() => resolveArticlesBackend(previewMode), [previewMode]);
+  const [activeArticleId, setActiveArticleId] = useState(articleId);
+  useEffect(() => { setActiveArticleId(articleId); }, [articleId]);
   const isNew = articleId === "new";
 
   const [editor, setEditor] = useState<NewsroomArticleEditorState | null>(isNew ? emptyArticle() : null);
@@ -108,8 +118,15 @@ export function NewsroomArticleEditor({ articleId, demo, embedded = false }: { a
   const [notice, setNotice] = useState<Notice | null>(null);
   const [conflictOpen, setConflictOpen] = useState(false);
   const [unpublishOpen, setUnpublishOpen] = useState(false);
-  const [mobileTab, setMobileTab] = useState<MobileTab>("edit");
+  const [mobileTab, setMobileTab] = useState<MobileTab>("preview");
+  const [focusedReferenceId, setFocusedReferenceId] = useState<string | null>(null);
+  const [lineageId, setLineageId] = useState<string | null>(null);
+  const [latestVersion, setLatestVersion] = useState<{ id: string; number: number } | null>(null);
+  const latestVersionNumber = latestVersion?.number ?? null;
+  const [changeReason, setChangeReason] = useState("");
+  const citedKeys = useMemo(() => Object.values(((bodyIr as { papyrus?: { citations?: Record<string, string[]> } } | null)?.papyrus?.citations) ?? {}).flat(), [bodyIr]);
   const [sections, setSections] = useState<string[]>([]);
+  const deskOptions = useMemo(() => newsroomDeskOptions(session?.shell.dashboard?.newsroomSections ?? []), [session?.shell.dashboard?.newsroomSections]);
   const [reloadToken, setReloadToken] = useState(0);
   const [imageUrls, setImageUrls] = useState<Record<string, string>>({});
   const [imageUploading, setImageUploading] = useState(false);
@@ -118,17 +135,18 @@ export function NewsroomArticleEditor({ articleId, demo, embedded = false }: { a
   const frontMatterRef = useRef<HTMLTextAreaElement | null>(null);
   const bodyRef = useRef<HTMLTextAreaElement | null>(null);
   const imageInputRef = useRef<HTMLInputElement | null>(null);
-  const mediaBackend = useMemo(() => resolveMediaBackend(demo), [demo]);
+  const mediaBackend = useMemo(() => resolveMediaBackend(previewMode), [previewMode]);
   const validationSequence = useRef(0);
 
   useEffect(() => {
     if (blocked || isNew) return;
     let cancelled = false;
     backend
-      .loadArticle(articleId)
+      .loadArticle(activeArticleId)
       .then((article) => {
         if (cancelled) return;
         setEditor(stateFromArticle(article));
+        setLineageId(article.lineageId ?? null);
         setAliases(article.aliases);
         setEverPublished(article.everPublished);
         setSlugEdited(true);
@@ -140,7 +158,7 @@ export function NewsroomArticleEditor({ articleId, demo, embedded = false }: { a
     return () => {
       cancelled = true;
     };
-  }, [articleId, backend, blocked, isNew, reloadToken]);
+  }, [activeArticleId, backend, blocked, isNew, reloadToken]);
 
   useEffect(() => {
     if (blocked) return;
@@ -234,8 +252,12 @@ export function NewsroomArticleEditor({ articleId, demo, embedded = false }: { a
     patchEditor(patch);
   };
 
+  const changeFrontMatterField = (key: string, value: string) => {
+    if (editor) changeFrontMatter(writeFrontMatterText(editor.frontMatterYaml, key, value));
+  };
+
   const goToLine = (location: ErrorLocation) => {
-    setMobileTab("edit");
+    setMobileTab("preview");
     window.setTimeout(() => {
       const target = location.field === "frontMatterYaml" ? frontMatterRef.current : bodyRef.current;
       if (!target) return;
@@ -274,6 +296,41 @@ export function NewsroomArticleEditor({ articleId, demo, embedded = false }: { a
     }
   };
 
+  useEffect(() => {
+    if (!lineageId || isNew) { setLatestVersion(null); return; }
+    let cancelled = false;
+    loadStoryReportingTrail(lineageId, activeArticleId)
+      .then(trail => { if (!cancelled) { const newest = trail.versions[0]; setLatestVersion(newest ? { id: newest.id, number: newest.versionNumber } : null); } })
+      .catch(() => { if (!cancelled) setLatestVersion(null); });
+    return () => { cancelled = true; };
+  }, [activeArticleId, isNew, lineageId, reloadToken]);
+
+  const saveNewVersion = useCallback(async () => {
+    if (!editor || editor.id === null) return;
+    setBusy("save");
+    try {
+      const result = await backend.actions.saveItemDraft({
+        id: editor.id,
+        type: editor.type,
+        slug: editor.slug,
+        section: editor.section.trim() ? editor.section.trim() : null,
+        frontMatterYaml: editor.frontMatterYaml,
+        bodyMarkus: editor.bodyMarkus,
+        aliases,
+        expectedContentHash: editor.contentHash,
+        newVersion: true,
+        changeReason: changeReason.trim() || null,
+      });
+      setChangeReason("");
+      setActiveArticleId(result.item.id);
+      setNotice({ tone: "ok", text: `Saved as version ${result.item.versionNumber ?? ""}.` });
+    } catch (error) {
+      setNotice({ tone: "error", text: failureMessage(error) });
+    } finally {
+      setBusy(null);
+    }
+  }, [aliases, backend, changeReason, editor]);
+
   const saveDraft = useCallback(async (): Promise<string | null> => {
     if (!editor) return null;
     setBusy("save");
@@ -400,8 +457,9 @@ export function NewsroomArticleEditor({ articleId, demo, embedded = false }: { a
 
     const slugLocked = everPublished;
     const invalid = validation.status === "invalid" || validation.status === "unavailable";
-    const publishBlocked = invalid || validation.status === "checking" || busy !== null || !editor.slug.trim();
-    const saveBlocked = invalid || busy !== null || !editor.slug.trim() || (!editor.dirty && editor.id !== null);
+    const isOlderVersion = latestVersionNumber !== null && editor.versionNumber !== null && editor.versionNumber < latestVersionNumber;
+    const publishBlocked = isOlderVersion || invalid || validation.status === "checking" || busy !== null || !editor.slug.trim();
+    const saveBlocked = isOlderVersion || invalid || busy !== null || !editor.slug.trim() || (!editor.dirty && editor.id !== null);
     const stagingUrl = stagingPreviewUrl(
       process.env.NEXT_PUBLIC_PAPYRUS_STAGING_URL,
       editor.type,
@@ -480,6 +538,16 @@ export function NewsroomArticleEditor({ articleId, demo, embedded = false }: { a
                 {busy === "save" ? <Spinner /> : null}
                 Save draft
               </Button>
+              <Button
+                data-newsroom-article-save-version
+                disabled={isOlderVersion || invalid || busy !== null || editor.id === null || !editor.dirty}
+                onClick={() => void saveNewVersion()}
+                size="sm"
+                type="button"
+                variant="outline"
+              >
+                Save as new version
+              </Button>
               <Button
                 data-newsroom-article-publish
                 disabled={publishBlocked}
@@ -493,7 +561,7 @@ export function NewsroomArticleEditor({ articleId, demo, embedded = false }: { a
               {editor.status === "published" ? (
                 <Button
                   data-newsroom-article-unpublish
-                  disabled={busy !== null}
+                  disabled={isOlderVersion || busy !== null}
                   onClick={() => setUnpublishOpen(true)}
                   size="sm"
                   type="button"
@@ -511,16 +579,9 @@ export function NewsroomArticleEditor({ articleId, demo, embedded = false }: { a
             </div>
           ) : null}
 
-          <Tabs className="lg:hidden" defaultValue="edit" onValueChange={(value) => setMobileTab(value as MobileTab)} value={mobileTab}>
-            <TabsList>
-              <TabsTrigger className="min-w-[6rem]" value="edit">Edit</TabsTrigger>
-              <TabsTrigger className="min-w-[6rem]" value="preview">Preview</TabsTrigger>
-            </TabsList>
-          </Tabs>
-
-          <div className="grid gap-6 lg:grid-cols-2">
+          <div className="grid gap-6">
             <div
-              className={cn("min-w-0 space-y-4", mobileTab === "edit" ? "block" : "hidden", "lg:block")}
+              className="min-w-0 space-y-4"
               data-newsroom-article-edit-column
             >
               <div className="grid gap-3 sm:grid-cols-3">
@@ -543,18 +604,29 @@ export function NewsroomArticleEditor({ articleId, demo, embedded = false }: { a
                   </Select>
                 </label>
                 <label className="space-y-1 text-sm font-medium">
-                  <span>Section</span>
-                  <Input
-                    data-newsroom-article-section
-                    list="newsroom-article-sections"
-                    onChange={(event) => patchEditor({ section: event.target.value })}
-                    value={editor.section}
-                  />
-                  <datalist id="newsroom-article-sections">
-                    {sections.map((section) => (
-                      <option key={section} value={section} />
-                    ))}
-                  </datalist>
+                  <span>Desk</span>
+                  <Select
+                    onValueChange={(value) => {
+                      if (typeof value === "string") patchEditor({ section: value === NO_DESK_VALUE ? "" : value });
+                    }}
+                    value={deskOptions.some(option => option.value === editor.section) ? editor.section : NO_DESK_VALUE}
+                  >
+                    <SelectTrigger aria-label="Desk" className="w-full" data-newsroom-article-section>
+                      <SelectValue>{deskOptions.find(option => option.value === editor.section)?.label ?? "No desk"}</SelectValue>
+                    </SelectTrigger>
+                    <SelectContent>
+                      <SelectItem value={NO_DESK_VALUE}>No desk</SelectItem>
+                      {(["core", "rotating"] as const).map((kind) => deskOptions.some(option => option.kind === kind) ? (
+                        <SelectGroup key={kind}>
+                          <SelectLabel>{kind === "core" ? "Core desks" : "Rotating desks"}</SelectLabel>
+                          {deskOptions.filter(option => option.kind === kind).map((option) => (
+                            <SelectItem key={option.value} value={option.value}>{option.label}</SelectItem>
+                          ))}
+                        </SelectGroup>
+                      ) : null)}
+                    </SelectContent>
+                  </Select>
+                  {editor.section.trim() && !deskOptions.some(option => option.value === editor.section) ? <small className="newsroom-desk-legacy-value">Old section value: {editor.section.trim()}</small> : null}
                 </label>
                 <label className="space-y-1 text-sm font-medium">
                   <span>Slug</span>
@@ -571,8 +643,27 @@ export function NewsroomArticleEditor({ articleId, demo, embedded = false }: { a
                 </label>
               </div>
 
+                {isOlderVersion ? <p className="newsroom-article-older-version" data-newsroom-article-older-version role="status">
+                This is version {editor.versionNumber} of {latestVersionNumber}, shown read-only. <button className="newsroom-article-link-button" onClick={() => setActiveArticleId(latestVersion?.id ?? activeArticleId)} type="button">Open the latest version</button>
+              </p> : null}
+              <div aria-label="Story view" className="newsroom-article-view-toggle" role="group">
+              <button aria-pressed={mobileTab === "preview"} className="organizer-header-button" data-newsroom-article-view="preview" onClick={() => setMobileTab("preview")} type="button">Preview</button>
+              <button aria-pressed={mobileTab === "edit"} className="organizer-header-button" data-newsroom-article-view="edit" onClick={() => setMobileTab("edit")} type="button">Edit</button>
+              <button aria-pressed={mobileTab === "trail"} className="organizer-header-button" data-newsroom-article-view="trail" onClick={() => setMobileTab("trail")} type="button">Messages</button>
+              <button aria-pressed={mobileTab === "references"} className="organizer-header-button" data-newsroom-article-view="references" onClick={() => { setFocusedReferenceId(null); setMobileTab("references"); }} type="button">References</button>
+            </div>
+              {(mobileTab === "trail" || mobileTab === "references") && editor.id ? <StoryReportingTrailView focusedReferenceId={focusedReferenceId} onShowReference={(referenceId) => { setFocusedReferenceId(referenceId); setMobileTab("references"); }} view={mobileTab === "references" ? "references" : "messages"} citedKeys={citedKeys} demo={previewMode} itemId={editor.id} lineageId={lineageId} onOpenVersion={(versionId) => { setActiveArticleId(versionId); setMobileTab("preview"); }} /> : null}
+              <div className={cn("space-y-4", mobileTab === "edit" ? "block" : "hidden")} data-newsroom-article-raw-code>
+              <div className="newsroom-article-front-matter-fields" data-newsroom-article-fields>
+                <label><span>Title</span><Input data-newsroom-article-field="title" onChange={(event) => changeFrontMatterField(FRONT_MATTER_TITLE_KEY, event.target.value)} value={readFrontMatterText(editor.frontMatterYaml, FRONT_MATTER_TITLE_KEY)} /></label>
+                <label><span>Subtitle</span><Input data-newsroom-article-field="subtitle" onChange={(event) => changeFrontMatterField(FRONT_MATTER_SUBTITLE_KEY, event.target.value)} placeholder="A line under the headline" value={readFrontMatterText(editor.frontMatterYaml, FRONT_MATTER_SUBTITLE_KEY)} /></label>
+                <label><span>Blurb</span><Textarea data-newsroom-article-field="blurb" onChange={(event) => changeFrontMatterField(FRONT_MATTER_BLURB_KEY, event.target.value)} placeholder="Two or three lines that describe the story on the board and in listings" rows={3} value={readFrontMatterText(editor.frontMatterYaml, FRONT_MATTER_BLURB_KEY)} /></label>
+              </div>
+              <Input aria-label="What changed in this version" className="max-w-xl" onChange={(event) => setChangeReason(event.target.value)} placeholder="What changed? Recorded when you save as a new version." value={changeReason} />
+              <details className="newsroom-article-front-matter" data-newsroom-article-front-matter-details>
+                <summary>Front matter (YAML)</summary>
               <label className="block space-y-1 text-sm font-medium">
-                <span>Front matter (YAML)</span>
+                <span className="sr-only">Front matter (YAML)</span>
                 <Textarea
                   className={TEXTAREA_CLASS}
                   data-newsroom-article-front-matter
@@ -583,10 +674,11 @@ export function NewsroomArticleEditor({ articleId, demo, embedded = false }: { a
                   value={editor.frontMatterYaml}
                 />
               </label>
+              </details>
 
               <div className="space-y-1 text-sm font-medium">
                 <div className="flex flex-wrap items-center justify-between gap-2">
-                  <label htmlFor="newsroom-article-body">Body (Markus)</label>
+                  <label className="sr-only" htmlFor="newsroom-article-body">Story body</label>
                   <Button
                     data-newsroom-article-insert-image
                     disabled={editor.id === null || imageUploading || busy !== null}
@@ -664,16 +756,20 @@ export function NewsroomArticleEditor({ articleId, demo, embedded = false }: { a
                   })}
                 </ul>
               ) : null}
+              </div>
             </div>
 
             <div
-              className={cn("min-w-0", mobileTab === "preview" ? "block" : "hidden", "lg:block")}
+              className={cn("min-w-0", mobileTab === "preview" ? "block" : "hidden")}
               data-newsroom-article-preview-column
             >
               <div className="rounded-xl border border-border bg-card p-4" data-newsroom-article-preview>
-                <p className="mb-2 text-[0.7rem] font-semibold uppercase tracking-[0.08em] text-muted-foreground">
-                  Preview
-                </p>
+                {(readFrontMatterText(editor.frontMatterYaml, FRONT_MATTER_SUBTITLE_KEY) || readFrontMatterText(editor.frontMatterYaml, FRONT_MATTER_BLURB_KEY)) ? (
+                  <div className="newsroom-article-summary" data-newsroom-article-summary>
+                    {readFrontMatterText(editor.frontMatterYaml, FRONT_MATTER_SUBTITLE_KEY) ? <p className="newsroom-article-subtitle">{readFrontMatterText(editor.frontMatterYaml, FRONT_MATTER_SUBTITLE_KEY)}</p> : null}
+                    {readFrontMatterText(editor.frontMatterYaml, FRONT_MATTER_BLURB_KEY) ? <p className="newsroom-article-blurb">{readFrontMatterText(editor.frontMatterYaml, FRONT_MATTER_BLURB_KEY)}</p> : null}
+                  </div>
+                ) : null}
                 {invalid && bodyIr ? (
                   <p className="mb-2 text-xs text-muted-foreground">Showing the last valid version.</p>
                 ) : null}