@anthusai/papyrus 5.43.0 → 5.45.0

package/components/reference-review-card.tsx

@@ -12,6 +12,7 @@ import {
 import { useEffect, useRef, useState, type ReactNode, type PointerEvent as ReactPointerEvent } from "react";
 import { Button } from "./ui/button";
 import { cn } from "../lib/utils";
+import { RatingGrid } from "./review-rating-grid";
 import { REFERENCE_REJECTION_REASON_CODES, type ReferenceRejectionReasonCode } from "../lib/reference-policy";
 
 export type ReviewChoice = "accept" | "reject";
@@ -44,6 +45,84 @@ function percent(confidence: number | null): string | null {
   return confidence === null ? null : `${Math.round(confidence * 100)}%`;
 }
 
+/**
+ * The Cyclotron's read-only row: its Accept or Reject highlighted with its confidence, and a check or cross once a person has answered.
+ * Shared by the review card and by every list that shows a suggestion before a decision.
+ */
+export function CyclotronRow({ decided = null, prediction }: { decided?: ReviewChoice | null; prediction: CardPrediction }) {
+  const matched = decided && prediction.state === "ready" ? prediction.choice === decided : null;
+  return (
+    <div className="space-y-2" data-review-row="cyclotron">
+      <div className="flex items-center gap-3">
+        <span className="w-20 shrink-0 text-sm font-semibold">Cyclotron</span>
+        {prediction.state === "ready" ? (
+          <div className="flex flex-1 gap-2">
+            {(["accept", "reject"] as const).map((choice) => {
+              const predicted = prediction.state === "ready" && prediction.choice === choice;
+              const verdict = predicted && matched !== null ? (matched ? "match" : "miss") : null;
+              return (
+                <span
+                  className={cn(
+                    "inline-flex min-h-10 flex-1 items-center justify-center gap-1.5 rounded-md border px-3 text-sm",
+                    predicted ? "border-foreground bg-muted font-semibold" : "border-dashed text-muted-foreground",
+                    verdict === "match" && "border-green-700 bg-green-100 text-green-950",
+                    verdict === "miss" && "border-red-700 bg-red-100 text-red-950",
+                  )}
+                  data-cyclotron-choice={choice}
+                  data-predicted={predicted || undefined}
+                  data-verdict={verdict ?? undefined}
+                  key={choice}
+                >
+                  {verdict === "match" ? <CircleCheckIcon aria-hidden="true" className="size-4" /> : null}
+                  {verdict === "miss" ? <CircleXIcon aria-hidden="true" className="size-4" /> : null}
+                  {CHOICE_LABEL[choice]}
+                  {predicted && percent(prediction.confidence) ? <small className="text-xs font-normal">{percent(prediction.confidence)}</small> : null}
+                  {verdict ? <span className="sr-only">{verdict === "match" ? ", matches your answer" : ", differs from your answer"}</span> : null}
+                </span>
+              );
+            })}
+          </div>
+        ) : (
+          <p className="text-sm text-muted-foreground" data-cyclotron-state={prediction.state}>
+            {prediction.state === "loading" ? "Loading…" : prediction.state === "error" ? "Prediction unavailable" : "No prediction"}
+          </p>
+        )}
+      </div>
+    </div>
+  );
+}
+
+/** The two answers, large enough to tap: Accept and Reject, the chosen one filled and checked (never colour alone). */
+export function ChoiceButtons({ chosen, disabled = false, onChoose }: { chosen: ReviewChoice | null; disabled?: boolean; onChoose: (choice: ReviewChoice) => void }) {
+  return (
+    <div className="flex flex-1 gap-2">
+      {(["accept", "reject"] as const).map((choice) => {
+        const on = chosen === choice;
+        return (
+          <Button
+            aria-disabled={disabled ? true : undefined}
+            aria-pressed={on}
+            className="min-h-14 flex-1 text-base"
+            data-review-choice={choice}
+            key={choice}
+            onClick={() => onChoose(choice)}
+            type="button"
+            variant={on ? (choice === "accept" ? "default" : "destructive") : "outline"}
+          >
+            {on ? <CheckIcon aria-hidden="true" className="size-5" /> : null}
+            {CHOICE_LABEL[choice]}
+          </Button>
+        );
+      })}
+    </div>
+  );
+}
+
+/** A reference's relevance decision in the card's own vocabulary. */
+export function predictionFromDecision(decision: { label: string; positiveLabel: string | null; confidence: number | null }): CardPrediction {
+  return { state: "ready", choice: decision.label === (decision.positiveLabel ?? "include") ? "accept" : "reject", confidence: decision.confidence };
+}
+
 /**
  * One reusable card for answering a single question: Accept or Reject. The Cyclotron's row is
  * read-only; the human row is the real control and its answer is final. Saves on tap.
@@ -156,12 +235,6 @@ export function ReviewCard({
     return () => window.removeEventListener("keydown", onKey);
   });
 
-  const predictedMarker = (choice: ReviewChoice) => {
-    if (prediction.state !== "ready" || prediction.choice !== choice) return null;
-    return prediction.choice;
-  };
-  const matched = decided && prediction.state === "ready" ? prediction.choice === decided : null;
-
   return (
     <section aria-label="Review" className="space-y-4" data-review-card={itemId}>
       <header className="space-y-1">
@@ -175,76 +248,17 @@ export function ReviewCard({
         {summary ? <p className="text-sm text-muted-foreground">{summary}</p> : null}
       </header>
 
-      <div className="space-y-2" data-review-row="cyclotron">
-        <div className="flex items-center gap-3">
-          <span className="w-20 shrink-0 text-sm font-semibold">Cyclotron</span>
-          {prediction.state === "ready" ? (
-            <div className="flex flex-1 gap-2">
-              {(["accept", "reject"] as const).map((choice) => {
-                const predicted = predictedMarker(choice) !== null;
-                const verdict = predicted && matched !== null ? (matched ? "match" : "miss") : null;
-                return (
-                  <span
-                    className={cn(
-                      "inline-flex min-h-10 flex-1 items-center justify-center gap-1.5 rounded-md border px-3 text-sm",
-                      predicted ? "border-foreground bg-muted font-semibold" : "border-dashed text-muted-foreground",
-                      verdict === "match" && "border-green-700 bg-green-100 text-green-950",
-                      verdict === "miss" && "border-red-700 bg-red-100 text-red-950",
-                    )}
-                    data-cyclotron-choice={choice}
-                    data-predicted={predicted || undefined}
-                    data-verdict={verdict ?? undefined}
-                    key={choice}
-                  >
-                    {verdict === "match" ? <CircleCheckIcon aria-hidden="true" className="size-4" /> : null}
-                    {verdict === "miss" ? <CircleXIcon aria-hidden="true" className="size-4" /> : null}
-                    {CHOICE_LABEL[choice]}
-                    {predicted && percent(prediction.confidence) ? <small className="text-xs font-normal">{percent(prediction.confidence)}</small> : null}
-                    {verdict ? <span className="sr-only">{verdict === "match" ? ", matches your answer" : ", differs from your answer"}</span> : null}
-                  </span>
-                );
-              })}
-            </div>
-          ) : (
-            <p className="text-sm text-muted-foreground" data-cyclotron-state={prediction.state}>
-              {prediction.state === "loading" ? "Loading…" : prediction.state === "error" ? "Prediction unavailable" : "No prediction"}
-            </p>
-          )}
-        </div>
-      </div>
-
-      <div className="space-y-2" data-review-row="you">
-        <div className="flex items-center gap-3">
-          <span className="w-20 shrink-0 text-sm font-semibold">You</span>
-          <div className="flex flex-1 gap-2">
-            {(["accept", "reject"] as const).map((choice) => {
-              const on = chosen === choice;
-              return (
-                <Button
-                  aria-disabled={disabledReason ? true : undefined}
-                  aria-pressed={on}
-                  className="min-h-14 flex-1 text-base"
-                  data-review-choice={choice}
-                  key={choice}
-                  onClick={() => choose(choice)}
-                  type="button"
-                  variant={on ? (choice === "accept" ? "default" : "destructive") : "outline"}
-                >
-                  {on ? <CheckIcon aria-hidden="true" className="size-5" /> : null}
-                  {CHOICE_LABEL[choice]}
-                </Button>
-              );
-            })}
-          </div>
-        </div>
-        <div className="min-h-5 pl-[5.75rem] text-sm" role="status">
-          {saving ? "Saving…" : saved ? (
-            <span className="inline-flex items-center gap-1" data-review-saved><CheckIcon aria-hidden="true" className="size-4" />Saved</span>
-          ) : null}
-        </div>
-        {disabledReason ? <p className="text-sm text-muted-foreground" data-review-disabled-reason>{disabledReason}</p> : null}
-        {error ? <p className="text-sm text-destructive" role="alert">{error}</p> : null}
-      </div>
+      <RatingGrid
+        answer={chosen}
+        decided={decided}
+        disabled={Boolean(disabledReason)}
+        disabledReason={disabledReason}
+        feedback={saving ? { phase: "saving" } : error ? { phase: "error", message: error } : saved ? { phase: "saved" } : { phase: "idle" }}
+        onChoose={choose}
+        prediction={prediction}
+        size="large"
+        surface="card"
+      />
 
       <label className="block text-sm font-medium">
         Why? (optional)

package/components/references-page-loading.tsx

@@ -0,0 +1,61 @@
+"use client";
+
+import { useEffect, useMemo, useState } from "react";
+import { LoaderIcon } from "lucide-react";
+import { SITE_BRAND } from "../lib/site-brand";
+import { loadFeedSnapshot, type FeedSnapshot } from "../lib/reference-feed-cache";
+import { partitionReferenceFeed, type ReferenceFeedTabKey } from "../lib/reference-feed-ranking";
+import { selectCanonicalReferenceRecords } from "../lib/newsroom-references";
+import { ReferenceFeed, ReferenceFeedSkeleton } from "./reference-feed";
+
+/**
+ * What the References page shows while the session and the first reads are still resolving: the real page header at once,
+ * then this browser's last saved view (read only, answering switches on when the session is confirmed), or card skeletons
+ * when there is none. Never a full-screen "checking" screen.
+ */
+export function ReferencesPageLoading() {
+  const [snapshot, setSnapshot] = useState<FeedSnapshot | null>(null);
+  const [checked, setChecked] = useState(false);
+  const [tab, setTab] = useState<ReferenceFeedTabKey>("feed");
+  const [note, setNote] = useState<string | null>(null);
+  const [now] = useState(() => Date.now());
+  useEffect(() => {
+    setSnapshot(loadFeedSnapshot(SITE_BRAND.id));
+    setChecked(true);
+  }, []);
+  const references = useMemo(() => selectCanonicalReferenceRecords(snapshot?.references ?? []), [snapshot]);
+  const decisions = useMemo(() => new Map(snapshot?.decisions ?? []), [snapshot]);
+  const previews = useMemo(() => new Map(snapshot?.previews ?? []), [snapshot]);
+  const partition = useMemo(() => partitionReferenceFeed(references, decisions, { now }), [references, decisions, now]);
+  const noVisitRated = useMemo(() => new Set<string>(), []);
+
+  return (
+    <div className="space-y-4" data-references-page-loading>
+      <div className="space-y-1">
+        <h2 className="text-2xl font-bold tracking-tight">References</h2>
+        <p className="text-sm text-muted-foreground">A feed ranked by what you are most likely to accept.</p>
+      </div>
+      {note ? <p className="text-sm text-muted-foreground" role="status">{note}</p> : null}
+      {checked && references.length ? (
+        <ReferenceFeed
+          disabledReason="Confirming your sign-in. You can answer in a moment."
+          now={now}
+          onOpen={() => setNote("Opening a reference is available in a moment, once your sign-in is confirmed.")}
+          onRate={() => undefined}
+          onTabChange={setTab}
+          onVisitRated={() => undefined}
+          partition={partition}
+          previews={previews}
+          stale
+          tab={tab}
+          visitRated={noVisitRated}
+        />
+      ) : (
+        <>
+          <p className="inline-flex items-center gap-1.5 text-xs text-muted-foreground" role="status"><LoaderIcon aria-hidden="true" className="size-3.5 animate-spin" />Loading your references</p>
+          <ReferenceFeedSkeleton />
+        </>
+      )}
+    </div>
+  );
+}

package/components/references-prefetch.ts

@@ -0,0 +1,47 @@
+/**
+ * Starts the References reads as soon as the editor session is confirmed, in parallel with the summary dashboard, instead of after it.
+ * The page that needs them takes the in-flight request once; anything later, or a retry, makes a fresh read. This is a head start
+ * on the same reads, not a cache: the backend authorizes each call exactly as before.
+ */
+import {
+  loadEditorMessagesData,
+  loadEditorReferencesData,
+  loadEditorSemanticRelationsData,
+} from "./news-desk-taxonomy-client";
+
+const HEAD_START_MS = 60_000;
+type Started = { startedAt: number; promise: Promise<unknown> };
+const started = new Map<string, Started>();
+
+const LOADERS = {
+  references: loadEditorReferencesData,
+  relations: loadEditorSemanticRelationsData,
+  messages: loadEditorMessagesData,
+} as const;
+type Key = keyof typeof LOADERS;
+
+/** Begin all three reads. Safe to call twice; a failure is reported to whoever takes the read, never as an unhandled rejection. */
+export function prefetchReferencesFeed(now = Date.now()) {
+  for (const key of Object.keys(LOADERS) as Key[]) {
+    if (started.has(key)) continue;
+    const promise = LOADERS[key]();
+    promise.catch(() => undefined);
+    started.set(key, { startedAt: now, promise });
+  }
+}
+
+function take<Key2 extends Key>(key: Key2, now = Date.now()): ReturnType<(typeof LOADERS)[Key2]> {
+  const head = started.get(key);
+  started.delete(key);
+  if (head && now - head.startedAt <= HEAD_START_MS) return head.promise as ReturnType<(typeof LOADERS)[Key2]>;
+  return LOADERS[key]() as ReturnType<(typeof LOADERS)[Key2]>;
+}
+
+export const loadReferencesWithHeadStart = () => take("references");
+export const loadRelationsWithHeadStart = () => take("relations");
+export const loadMessagesWithHeadStart = () => take("messages");
+
+/** Forget any unclaimed head start (sign-out). */
+export function discardReferencesHeadStart() {
+  started.clear();
+}

package/components/review-rating-grid.tsx

@@ -0,0 +1,164 @@
+"use client";
+
+import { CheckIcon, CircleCheckIcon, CircleXIcon, Loader2Icon, XIcon } from "lucide-react";
+import { UNRECORDED_CONFIDENCE } from "../lib/reference-feed-ranking";
+import { cn } from "../lib/utils";
+import type { CardPrediction, ReviewChoice } from "./reference-review-card";
+
+/**
+ * The rating area of a card: one grid, three columns (label | Accept | Reject), and the two rows share its columns exactly.
+ *   Cyclotron   [ Accept 96% ]  [ Reject ]      read only; the predicted side is highlighted with its confidence
+ *               [====== confidence bar, centred at 50% ======]
+ *   You         [ Accept ]      [ Reject ]      the real buttons, each directly under its matching cell
+ * Feedback is never colour alone: before you answer the predicted cell is neutral-accent with a check or cross; after, it turns
+ * green with a CircleCheck (Match) or red with a CircleX (Miss), and the confidence bar tints the same way. Your chosen button is
+ * filled. Flat tones and rounded shapes only, no borders.
+ */
+
+export type RatingFeedback = { phase: "idle" | "saving" | "saved" | "error"; message?: string };
+
+/** P(accept) from a prediction: its confidence is in the side it chose; an unrecorded confidence is a mild lean. */
+export function predictionAcceptProbability(prediction: Extract<CardPrediction, { state: "ready" }>): number {
+  const confidence = prediction.confidence ?? UNRECORDED_CONFIDENCE;
+  return prediction.choice === "accept" ? confidence : 1 - confidence;
+}
+
+/** How far, in percent of the whole bar, the fill reaches from the centre: |P(accept) - 0.5| * 2, over the two halves. */
+export function confidenceFillPercent(probability: number): number {
+  return Math.min(100, Math.abs(probability - 0.5) * 2 * 100);
+}
+
+const WORD: Record<ReviewChoice, string> = { accept: "Accept", reject: "Reject" };
+
+const TONE = {
+  match: "bg-emerald-600/20 text-emerald-900 dark:bg-emerald-400/20 dark:text-emerald-100",
+  miss: "bg-red-600/20 text-red-900 dark:bg-red-400/20 dark:text-red-100",
+} as const;
+const FILL = { match: "bg-emerald-600 dark:bg-emerald-400", miss: "bg-red-600 dark:bg-red-400", neutral: "bg-[var(--primary)]" } as const;
+
+export function RatingGrid({
+  answer,
+  decided = answer,
+  disabled = false,
+  disabledReason = null,
+  feedback = { phase: "idle" },
+  onChoose,
+  prediction,
+  size = "compact",
+  surface = "footer",
+}: {
+  /** The side the buttons show as chosen (it may be a pending choice that is still saving). */
+  answer: ReviewChoice | null;
+  /** The saved human answer, which the Match / Miss verdict compares against. */
+  decided?: ReviewChoice | null;
+  disabled?: boolean;
+  disabledReason?: string | null;
+  feedback?: RatingFeedback;
+  onChoose: (choice: ReviewChoice) => void;
+  prediction: CardPrediction;
+  size?: "compact" | "large";
+  /** The tone the grid sits on, so the bar's centre notch matches it. */
+  surface?: "footer" | "card";
+}) {
+  const ready = prediction.state === "ready" ? prediction : null;
+  const verdict = ready && decided ? (ready.choice === decided ? "match" : "miss") : null;
+  const probability = ready ? predictionAcceptProbability(ready) : 0.5;
+  const half = confidenceFillPercent(probability) / 2; // percent of the full bar width, on one side of the centre
+  const leansAccept = probability >= 0.5;
+  const confidenceText = ready && ready.confidence !== null ? `${Math.round(ready.confidence * 100)}%` : null;
+  const cell = size === "large" ? "min-h-14 text-base" : "min-h-12 text-sm";
+  const label = size === "large" ? "text-sm" : "text-xs";
+
+  return (
+    <div className={cn("grid grid-cols-[4.5rem_minmax(0,1fr)_minmax(0,1fr)] gap-x-2 gap-y-2.5", size === "large" && "grid-cols-[5rem_minmax(0,1fr)_minmax(0,1fr)]")} data-rating-grid>
+      <div className="col-span-3 grid grid-cols-subgrid items-stretch gap-y-2" data-review-row="cyclotron">
+        <span className={cn("self-center font-semibold", label)}>Cyclotron</span>
+        {(["accept", "reject"] as const).map((choice) => {
+          const predicted = ready?.choice === choice;
+          const Icon = predicted ? (verdict === "match" ? CircleCheckIcon : verdict === "miss" ? CircleXIcon : choice === "accept" ? CheckIcon : XIcon) : null;
+          return (
+            <span
+              className={cn(
+                "flex flex-col items-center justify-center rounded-[16px] px-2 py-1.5 text-center",
+                cell,
+                !predicted && "bg-[var(--feed-control)]/45 text-muted-foreground",
+                predicted && !verdict && "bg-[var(--feed-control)] font-semibold text-[var(--primary)]",
+                predicted && verdict && cn("font-semibold", TONE[verdict]),
+              )}
+              data-cyclotron-choice={choice}
+              data-predicted={predicted || undefined}
+              data-verdict={predicted && verdict ? verdict : undefined}
+              key={choice}
+            >
+              <span className="inline-flex items-center gap-1.5">
+                {Icon ? <Icon aria-hidden="true" className="size-4 shrink-0" /> : null}
+                {WORD[choice]}
+                {predicted && confidenceText ? <small className="text-xs font-normal opacity-80">{confidenceText}</small> : null}
+              </span>
+              {predicted && verdict ? <small className="text-xs font-medium" data-verdict-word>{verdict === "match" ? "Match" : "Miss"}</small> : null}
+              {predicted && verdict ? <span className="sr-only">{verdict === "match" ? ", matches your answer" : ", differs from your answer"}</span> : null}
+            </span>
+          );
+        })}
+        <div className="col-span-2 col-start-2 flex flex-col gap-1" data-confidence>
+          <div
+            aria-label={ready ? `Cyclotron confidence: leans ${leansAccept ? "Accept" : "Reject"}, ${Math.round(confidenceFillPercent(probability))} percent of the way` : "No confidence"}
+            className="relative h-2.5 w-full overflow-hidden rounded-full bg-[var(--feed-control)]"
+            data-confidence-bar
+            data-confidence-direction={ready ? (leansAccept ? "accept" : "reject") : "none"}
+            role="img"
+          >
+            {ready ? (
+              <span
+                className={cn("absolute inset-y-0 rounded-full", FILL[verdict ?? "neutral"])}
+                data-confidence-fill
+                data-fill-percent={Math.round(half * 2)}
+                style={{ left: leansAccept ? `${50 - half}%` : "50%", width: `${half}%` }}
+              />
+            ) : null}
+            <span aria-hidden="true" className={cn("absolute inset-y-0 left-1/2 w-1 -translate-x-1/2", surface === "footer" ? "bg-[var(--feed-footer)]" : "bg-[var(--feed-card)]")} />
+          </div>
+          {prediction.state === "ready" ? null : (
+            <small className="text-center text-xs text-muted-foreground" data-cyclotron-state={prediction.state}>
+              {prediction.state === "loading" ? "Loading…" : prediction.state === "error" ? "Prediction unavailable" : "No prediction"}
+            </small>
+          )}
+        </div>
+      </div>
+
+      <div className="col-span-3 grid grid-cols-subgrid items-stretch" data-review-row="you">
+        <span className={cn("self-center font-semibold", label)}>You</span>
+        {(["accept", "reject"] as const).map((choice) => {
+          const on = answer === choice;
+          const Icon = choice === "accept" ? CheckIcon : XIcon;
+          return (
+            <button
+              aria-disabled={disabled ? true : undefined}
+              aria-pressed={on}
+              className={cn(
+                "inline-flex items-center justify-center gap-1.5 rounded-[16px] px-2 font-medium outline-none transition-colors focus-visible:ring-2 focus-visible:ring-ring",
+                cell,
+                on ? "bg-[var(--primary)] font-semibold text-[var(--primary-foreground)]" : "bg-[var(--feed-control)] text-foreground hover:bg-[var(--feed-control)]/70",
+                disabled && "opacity-60",
+              )}
+              data-review-choice={choice}
+              key={choice}
+              onClick={() => onChoose(choice)}
+              type="button"
+            >
+              <Icon aria-hidden="true" className={cn("size-4", !on && "opacity-60")} />
+              {WORD[choice]}
+            </button>
+          );
+        })}
+      </div>
+
+      <div className="col-span-3 min-h-5 text-xs text-muted-foreground" data-feed-saved role="status">
+        {feedback.phase === "saving" ? <span className="inline-flex items-center gap-1"><Loader2Icon aria-hidden="true" className="size-3.5 animate-spin" />Saving…</span> : null}
+        {feedback.phase === "saved" ? <span className="inline-flex items-center gap-1" data-review-saved><CheckIcon aria-hidden="true" className="size-3.5" />Saved</span> : null}
+      </div>
+      {disabledReason ? <p className="col-span-3 text-xs text-muted-foreground" data-review-disabled-reason>{disabledReason}</p> : null}
+      {feedback.phase === "error" ? <p className="col-span-3 text-xs text-destructive" role="alert">{feedback.message}</p> : null}
+    </div>
+  );
+}

package/components/topic-steering-workspace.tsx

@@ -94,6 +94,9 @@ import { useOptionalNewsDeskClient } from "./news-desk-client-provider";
 import { ReferenceSourcePreview } from "./reference-source-preview";
 import type { ReaderAuthSnapshot } from "./reader-auth-state";
 import { NewsDeskAccessGate } from "./newsroom-access-gate";
+import { loadMessagesWithHeadStart, loadReferencesWithHeadStart, loadRelationsWithHeadStart } from "./references-prefetch";
+import { loadFeedSnapshot, saveFeedSnapshot, type FeedSnapshot } from "../lib/reference-feed-cache";
+import { referencePreviewsByLineage } from "../lib/reference-preview";
 import { NewsroomOpsOverview } from "./newsroom-ops-overview";
 import { NewsroomCurationBootstrap } from "./newsroom-curation-bootstrap";
 import { NewsroomReferencesView } from "./newsroom-references-view";
@@ -696,7 +699,7 @@ export function NewsDeskWorkspace({
   }
 
   if (dashboard?.isPublicSkeleton && session?.shell.phase !== "ready") {
-    return <NewsDeskAccessGate shell={session?.shell ?? null} showSectionTabs={showSectionTabs} />;
+    return <NewsDeskAccessGate initialTab={initialTab} shell={session?.shell ?? null} showSectionTabs={showSectionTabs} />;
   }
 
   if (dashboard) {
@@ -716,7 +719,7 @@ export function NewsDeskWorkspace({
     );
   }
 
-  return <NewsDeskAccessGate shell={session?.shell ?? null} showSectionTabs={showSectionTabs} />;
+  return <NewsDeskAccessGate initialTab={initialTab} shell={session?.shell ?? null} showSectionTabs={showSectionTabs} />;
 }
 
 function NewsDeskDashboard({
@@ -777,9 +780,16 @@ function NewsDeskDashboard({
   const [referenceAttachments, setReferenceAttachments] = useState(dashboard.referenceAttachments);
   const [messages, setMessages] = useState(dashboard.messages);
   const [semanticRelations, setSemanticRelations] = useState(dashboard.semanticRelations);
+  const [savedFeedCopy, setSavedFeedCopy] = useState<Pick<FeedSnapshot, "references" | "previews" | "decisions"> | null>(null);
+  useEffect(() => {
+    // Display only: the last view this browser saved, shown until the live read arrives.
+    if (dashboard.isDemo) return;
+    const snapshot = loadFeedSnapshot(SITE_BRAND.id);
+    if (snapshot) setSavedFeedCopy(snapshot);
+  }, [dashboard.isDemo]);
   const cyclotronPreviewFixtures = useMemo(
-    () => (isLocalPreviewEnabled() ? createLocalPreviewCyclotronFixtures(references) : null),
-    [references],
+    () => (isLocalPreviewEnabled() && !semanticRelations.some((relation) => relation.predicate === "relevance_decision_is") ? createLocalPreviewCyclotronFixtures(references) : null),
+    [references, semanticRelations],
   );
   const relevanceDecisions = useMemo(
     () => currentRelevanceDecisions(cyclotronPreviewFixtures ? [...semanticRelations, ...cyclotronPreviewFixtures.relations] : semanticRelations),
@@ -1215,7 +1225,7 @@ function NewsDeskDashboard({
   useEffect(() => {
     if (!canLoadPrivateCorpus || hasHydratedReferences) return;
     let active = true;
-    void loadEditorReferencesData()
+    void loadReferencesWithHeadStart()
       .then(({ references: nextReferences, referenceAttachments }) => {
         if (!active) return;
         setReferences(nextReferences);
@@ -1326,8 +1336,8 @@ function NewsDeskDashboard({
   const selectedReviewLineageId = pathname ? pathnameReferenceLineageId ?? "" : initialSelection.reference ?? "";
   const referenceReviewData = useReferenceReviewData({
     enabled: canLoadPrivateCorpus && needsReferenceReviewData && !(activeTab === "references" && selectedReviewLineageId),
-    loadRelations: loadEditorSemanticRelationsData,
-    loadMessages: loadEditorMessagesData,
+    loadRelations: loadRelationsWithHeadStart,
+    loadMessages: loadMessagesWithHeadStart,
     onRelations: setSemanticRelations,
     onMessages: setMessages,
   });
@@ -1351,6 +1361,18 @@ function NewsDeskDashboard({
     ? selectedReviewRead.lineageId === selectedReviewLineageId ? selectedReviewRead.state : "loading"
     : referenceReviewData.state;
   const predictionError = selectedReviewIsCurrent ? selectedReviewRead.error : referenceReviewData.error;
+  useEffect(() => {
+    // Keep a display copy for the next visit once everything the feed shows has been read.
+    if (dashboard.isDemo || activeTab !== "references" || !hasHydratedReferences || predictionState !== "ready" || !references.length) return;
+    const timer = window.setTimeout(() => {
+      saveFeedSnapshot(SITE_BRAND.id, {
+        references: selectCanonicalReferenceRecords(references),
+        previews: referencePreviewsByLineage(referenceAttachments),
+        decisions: relevanceDecisions,
+      });
+    }, 800);
+    return () => window.clearTimeout(timer);
+  }, [activeTab, dashboard.isDemo, hasHydratedReferences, predictionState, referenceAttachments, references, relevanceDecisions]);
   const retryReferenceReviewData = () => { referenceReviewData.retry(); setSelectedReviewAttempt((current) => current + 1); };
 
   const applyReferenceRecord = useCallback((nextReference: ReferenceRecord) => {
@@ -3035,7 +3057,7 @@ function NewsDeskDashboard({
         headerActions={(
           <>
             {dashboard.isDemo ? (
-              <Badge variant="outline">Demo</Badge>
+              dashboard.realDataPreview ? null : <Badge variant="outline">Demo</Badge>
             ) : (
               <Link className={cn(buttonVariants({ variant: "ghost", size: "sm" }))} href="/settings">Settings</Link>
             )}
@@ -3182,6 +3204,8 @@ function NewsDeskDashboard({
               options?.sectionId)}
             referenceAttachments={referenceAttachments}
             references={references}
+            loading={!dashboard.isDemo && !hasHydratedReferences}
+            savedCopy={savedFeedCopy}
           />
           </NewsroomCurationBootstrap>
         ) : null}

package/infra/amplify-app-shell.js

@@ -6,10 +6,26 @@ import { addCloudEmail } from "./cloud-email.js";
 import { parseCloudEmail } from "./cloud-email-config.js";
 import { GITHUB_OIDC_PROVIDER_HOST } from "./github-oidc-provider.js";
 import { cmsProductionBuildSpec, cmsStagingBuildSpec, readerBuildSpec } from "./build-specs.js";
-import { PROSPECTUS_PAPYRUS_SITE_ROUTES, hasCmsApp, isStagingEnabled, resolveRedirectSubDomainPrefix, resolveCmsHostName, resolveSiteOrigin, githubOidcSubjects, resolveGithubRepository, resolveProspectusAccountsEndpoint, resolveProspectusSessionSealingParameterName, resolveReaderPollSecretParameterName, resolveRevalidateSecretParameterName, resolveStackName, resolveStagingDomainName, resolveStoragePreviewPrefix } from "./site-config.js";
+import { PROSPECTUS_PAPYRUS_SITE_ROUTES, hasCmsApp, isStagingEnabled, resolveRedirectSubDomainPrefix, resolveCmsHostName, resolveSiteOrigin, githubOidcSubjects, resolveGithubRepository, resolveProspectusAccountsEndpoint, resolveProspectusSessionSealingParameterName, resolveReaderPollSecretParameterName, resolveRevalidateSecretParameterName, resolveStackName, resolveStagingDomainName, resolveChatStackName, chatExportName, CHAT_EXPORTED_RESOURCES, CHAT_ENVIRONMENT_NAMES, CHAT_PRIVATE_ASSISTANT_ID, CHAT_PRIVATE_ASSISTANT_NAME, resolveStoragePreviewPrefix } from "./site-config.js";
 function environmentVariables(variables) {
     return Object.entries(variables).map(([name, value]) => ({ name, value }));
 }
+/**
+ * The production branch's private chat environment. Only a site with an enabled `chat` block gets the flag and the
+ * resource names (imported from the chat data stack's exports, so that stack must be deployed first); every other
+ * site keeps the flag "false" and no chat variables, and its newsroom serves neither the chat route nor the UI.
+ */
+function chatEnvironment(config) {
+    const chatStackName = resolveChatStackName(config);
+    if (!chatStackName)
+        return { PAPYRUS_PRIVATE_CHAT_ENABLED: "false" };
+    return {
+        PAPYRUS_PRIVATE_CHAT_ENABLED: "true",
+        ...Object.fromEntries(CHAT_EXPORTED_RESOURCES.map((resource) => [CHAT_ENVIRONMENT_NAMES[resource], Fn.importValue(chatExportName(chatStackName, resource))])),
+        PAPYRUS_CHAT_PRIVATE_BOT_ID: CHAT_PRIVATE_ASSISTANT_ID,
+        PAPYRUS_CHAT_PRIVATE_BOT_NAME: CHAT_PRIVATE_ASSISTANT_NAME,
+    };
+}
 function readerCustomHeaders(rules) {
     if (!rules)
         return undefined;
@@ -199,7 +215,7 @@ export class AmplifyAppShellStack extends Stack {
             environmentVariables: environmentVariables({
                 ...config.cms.environment,
                 ...emailEnvironment,
-                PAPYRUS_PRIVATE_CHAT_ENABLED: config.cms.environment.PAPYRUS_PRIVATE_CHAT_ENABLED ?? "false",
+                ...(config.chat?.enabled ? chatEnvironment(config) : { PAPYRUS_PRIVATE_CHAT_ENABLED: config.cms.environment.PAPYRUS_PRIVATE_CHAT_ENABLED ?? "false" }),
                 PAPYRUS_COGNITO_DOMAIN_PREFIX: config.cms.cognitoDomainPrefix,
                 ...(config.cms.applyCognitoDomainPrefix ? { PAPYRUS_APPLY_COGNITO_DOMAIN_PREFIX: "true" } : {}),
                 PAPYRUS_OAUTH_REDIRECT_URLS: oauthRedirectUrls,

package/infra/amplify-app-shell.ts

@@ -7,12 +7,28 @@ import { addCloudEmail } from "./cloud-email";
 import { parseCloudEmail } from "./cloud-email-config";
 import { GITHUB_OIDC_PROVIDER_HOST } from "./github-oidc-provider";
 import { cmsProductionBuildSpec, cmsStagingBuildSpec, readerBuildSpec } from "./build-specs";
-import { AmplifyAppShellSiteConfig, PROSPECTUS_PAPYRUS_SITE_ROUTES, ReaderCustomHeaderRule, hasCmsApp, isStagingEnabled, resolveRedirectSubDomainPrefix, resolveCmsHostName, resolveSiteOrigin, githubOidcSubjects, resolveGithubRepository, resolveProspectusAccountsEndpoint, resolveProspectusSessionSealingParameterName, resolveReaderPollSecretParameterName, resolveRevalidateSecretParameterName, resolveStackName, resolveStagingDomainName, resolveStoragePreviewPrefix } from "./site-config";
+import { AmplifyAppShellSiteConfig, PROSPECTUS_PAPYRUS_SITE_ROUTES, ReaderCustomHeaderRule, hasCmsApp, isStagingEnabled, resolveRedirectSubDomainPrefix, resolveCmsHostName, resolveSiteOrigin, githubOidcSubjects, resolveGithubRepository, resolveProspectusAccountsEndpoint, resolveProspectusSessionSealingParameterName, resolveReaderPollSecretParameterName, resolveRevalidateSecretParameterName, resolveStackName, resolveStagingDomainName, resolveChatStackName, chatExportName, CHAT_EXPORTED_RESOURCES, CHAT_ENVIRONMENT_NAMES, CHAT_PRIVATE_ASSISTANT_ID, CHAT_PRIVATE_ASSISTANT_NAME, resolveStoragePreviewPrefix } from "./site-config";
 
 function environmentVariables(variables: Record<string, string>): amplify.CfnBranch.EnvironmentVariableProperty[] {
   return Object.entries(variables).map(([name, value]) => ({ name, value }));
 }
 
+/**
+ * The production branch's private chat environment. Only a site with an enabled `chat` block gets the flag and the
+ * resource names (imported from the chat data stack's exports, so that stack must be deployed first); every other
+ * site keeps the flag "false" and no chat variables, and its newsroom serves neither the chat route nor the UI.
+ */
+function chatEnvironment(config: AmplifyAppShellSiteConfig): Record<string, string> {
+  const chatStackName = resolveChatStackName(config);
+  if (!chatStackName) return { PAPYRUS_PRIVATE_CHAT_ENABLED: "false" };
+  return {
+    PAPYRUS_PRIVATE_CHAT_ENABLED: "true",
+    ...Object.fromEntries(CHAT_EXPORTED_RESOURCES.map((resource) => [CHAT_ENVIRONMENT_NAMES[resource], Fn.importValue(chatExportName(chatStackName, resource))])),
+    PAPYRUS_CHAT_PRIVATE_BOT_ID: CHAT_PRIVATE_ASSISTANT_ID,
+    PAPYRUS_CHAT_PRIVATE_BOT_NAME: CHAT_PRIVATE_ASSISTANT_NAME,
+  };
+}
+
 function readerCustomHeaders(rules: ReaderCustomHeaderRule[] | undefined): string | undefined {
   if (!rules) return undefined;
   const lines = ["customHeaders:"];
@@ -221,7 +237,7 @@ export class AmplifyAppShellStack extends Stack {
       environmentVariables: environmentVariables({
         ...config.cms.environment,
         ...emailEnvironment,
-        PAPYRUS_PRIVATE_CHAT_ENABLED: config.cms.environment.PAPYRUS_PRIVATE_CHAT_ENABLED ?? "false",
+        ...(config.chat?.enabled ? chatEnvironment(config) : { PAPYRUS_PRIVATE_CHAT_ENABLED: config.cms.environment.PAPYRUS_PRIVATE_CHAT_ENABLED ?? "false" }),
         PAPYRUS_COGNITO_DOMAIN_PREFIX: config.cms.cognitoDomainPrefix,
         ...(config.cms.applyCognitoDomainPrefix ? { PAPYRUS_APPLY_COGNITO_DOMAIN_PREFIX: "true" } : {}),
         PAPYRUS_OAUTH_REDIRECT_URLS: oauthRedirectUrls,