@anthusai/papyrus 5.43.0-next.10 → 5.43.0-next.11

package/amplify/functions/model-attachment-upload/handler.ts

@@ -41,6 +41,7 @@ const ALLOWED_ROLES = new Set([
   "item_excerpt",
   "message_body",
   "metadata",
+  "preview",
   "ontology_concept_profile",
   "ontology_relation_explanation",
   "published_item_body",

package/components/monitoring-overview-view.tsx

@@ -144,6 +144,7 @@ export function EmailSubmissions({ items, detail, onOpen, onResolveArticleLink,
   const receiptKey = receiptId ?? "";
   const quarantine = (detail && "submission" in detail ? decidedByReceipt[receiptKey] ?? detail.submission.quarantine : null);
   const accepted = emailSubmissionAccepted(quarantine);
+  const groupInfo = detail && "submission" in detail ? items.find((item) => item.receiptId === detail.submission.receiptId)?.group : undefined;
   const reason = reasonByReceipt[receiptKey] ?? "";
   const busyDecision = busyDecisionByReceipt[receiptKey] ?? false;
   const selected = selectedByReceipt[receiptKey] ?? {};
@@ -274,6 +275,14 @@ export function EmailSubmissions({ items, detail, onOpen, onResolveArticleLink,
       {items.length ? <ul className="news-desk-monitoring__list">
         {items.map((item) => <li key={item.receiptId} data-email-submission={item.receiptId}>
           <strong>{item.subject || "(no subject)"}</strong>
+          {item.group ? <details data-email-group={item.group.fingerprint}>
+            <summary>Received {item.group.count} times · latest {formatUtc(item.observedAt)}</summary>
+            <ol>
+              {item.group.copies.map((copy) => <li key={copy.receiptId} data-email-copy={copy.receiptId}>
+                {formatUtc(copy.observedAt)} · {copy.quarantine ? QUARANTINE_LABELS[copy.quarantine.state] : copy.status}
+              </li>)}
+            </ol>
+          </details> : null}
           <span>{formatUtc(item.observedAt)} · {item.linkCount} candidate links · {item.reviewRequired
             ? `${item.linkCount} await editor import` : `${item.processedCount} queued`}</span>
           {item.reviewRequired ? <span>Authentication warnings: private review required; nothing was routed automatically.</span> : null}
@@ -296,6 +305,7 @@ export function EmailSubmissions({ items, detail, onOpen, onResolveArticleLink,
             <h5>{QUARANTINE_LABELS[quarantine.state]}</h5>
             {quarantine.state === "quarantined" ? <>
               <p>This message was held privately and nothing was routed. Accept it to queue its links as if it had been accepted, or Reject it to close it. Sender identity and authentication signals never grant access; the decision is yours and is recorded.</p>
+              {groupInfo ? <p data-email-group-note>One decision applies to all {groupInfo.count} copies of this email.</p> : null}
               <label>Why? (optional)
                 <textarea value={reason} rows={3} maxLength={500} style={{ display: "block", width: "100%" }}
                   onChange={(event) => setReasonByReceipt((current) => ({ ...current, [receiptKey]: event.target.value }))} />
@@ -308,7 +318,7 @@ export function EmailSubmissions({ items, detail, onOpen, onResolveArticleLink,
               </button>
             </> : null}
             {quarantine.decision ? <p data-email-decision-record>
-              {quarantine.decision.action === "accept" ? "Accepted" : "Rejected"}
+              {quarantine.decision.action === "accept" ? "Accepted" : "Rejected"}{quarantine.decision.viaGroup ? " (one decision for every copy of this email)" : ""}
               {quarantine.decision.by ? ` by ${quarantine.decision.by}` : ""}{quarantine.decision.at ? ` on ${formatUtc(quarantine.decision.at)}` : ""}
               {quarantine.decision.reason ? `. Why: ${quarantine.decision.reason}` : "."}
             </p> : null}

package/components/news-desk-client-provider.tsx

@@ -6,6 +6,9 @@ import { createContext, useCallback, useContext, useEffect, useMemo, useRef, use
 import type { DevSandboxEditorAuth } from "../lib/dev-sandbox-editor-auth";
 import type { CategorySteeringDashboard } from "../lib/category-repository";
 import { ensureDevSandboxEditorSession } from "./dev-sandbox-editor-sign-in";
+import { discardReferencesHeadStart, prefetchReferencesFeed } from "./references-prefetch";
+import { SITE_BRAND } from "../lib/site-brand";
+import { clearSavedNewsroomDisplay, loadSessionDisplay, saveSessionDisplay } from "../lib/reference-feed-cache";
 import {
   loadEditorAssignmentsData,
   loadEditorDoctrineRecordsData,
@@ -75,7 +78,12 @@ export function NewsDeskClientProvider({
       ));
       return;
     }
-    setShell((current) => beginAccessCheck(current));
+    // A recent confirmed session is shown (name, "loading" instead of "checking") while the real check runs again.
+    // Display only: the check below still decides access, and the backend authorizes every call.
+    const remembered = loadSessionDisplay(SITE_BRAND.id);
+    setShell((current) => (remembered && !current.dashboard
+      ? { ...beginAccessCheck(current), phase: "loadingDesk" as const, auth: { status: "signedIn" as const, label: remembered.label } }
+      : beginAccessCheck(current)));
 
     try {
       await ensureDevSandboxEditorSession(devSandboxEditorAuth);
@@ -88,6 +96,8 @@ export function NewsDeskClientProvider({
     if (bootstrapSequenceRef.current !== sequence) return;
 
     if (access.status === "signedOut") {
+      clearSavedNewsroomDisplay(SITE_BRAND.id);
+      discardReferencesHeadStart();
       setShell((current) => resolveSignedOut(current, access.auth));
       return;
     }
@@ -100,7 +110,10 @@ export function NewsDeskClientProvider({
       return;
     }
 
+    saveSessionDisplay(SITE_BRAND.id, { label: access.auth.label, isAdmin: access.isAdmin });
     setShell((current) => beginDeskLoad(current, access.auth));
+    // The References reads do not depend on the summary dashboard: start them now, side by side with it.
+    if (typeof window !== "undefined" && /\/newsroom\/references(\/|$)/.test(window.location.pathname)) prefetchReferencesFeed();
 
     try {
       const dashboard = await loadEditorNewsDeskDashboard({ isAdmin: access.isAdmin });
@@ -183,6 +196,8 @@ export function NewsDeskClientProvider({
     const unsubscribe = Hub.listen("auth", ({ payload }) => {
       if (payload.event === "signedOut") {
         bootstrapSequenceRef.current += 1;
+        clearSavedNewsroomDisplay(SITE_BRAND.id);
+        discardReferencesHeadStart();
         setShell((current) => resolveSignedOut(current, { status: "signedOut", label: "Signed out" }));
         return;
       }

package/components/news-desk-page.tsx

@@ -1,3 +1,4 @@
+import { withReferenceFeedFixture } from "../lib/local-preview-feed-fixture";
 import { resolveNewsDeskTab } from "../lib/newsroom-section-routing";
 import { NewsDeskWorkspace, type NewsDeskTab } from "./topic-steering-workspace";
 import {
@@ -67,7 +68,7 @@ export async function NewsDeskPage({ section: routeSection, selectionPath, searc
   const analysisProfiles = await loadAnalysisProfileSummaries(getBrandAnalysisProfilesPath(brand));
   const configuredCorpora = await loadConfiguredCorpusSummaries(getBrandSteeringConfigPath(brand));
   const dashboard = useDemoDashboard
-    ? createDemoCategorySteeringDashboard(brand.id, getBrandNewsroomSectionsConfigPath(brand))
+    ? withReferenceFeedFixture(createDemoCategorySteeringDashboard(brand.id, getBrandNewsroomSectionsConfigPath(brand)))
     : await loadCategorySteeringDashboard();
   return <NewsDeskWorkspace analysisProfiles={analysisProfiles} configuredCorpora={configuredCorpora} dashboard={dashboard} initialSelection={initialSelection} initialTab={initialTab} />;
 }

package/components/newsroom-access-gate.tsx

@@ -9,24 +9,26 @@ import { NewsroomOpsShell } from "./newsroom-ops-shell";
 import { NewsroomOverviewSkeleton } from "./newsroom-overview-skeleton";
 import { ReaderAuthControl } from "./reader-auth-control";
 import { buttonVariants } from "./ui/button";
+import { ReferencesPageLoading } from "./references-page-loading";
 
-export function NewsDeskAccessGate({ shell, showSectionTabs = false }: { shell: NewsDeskShellState | null; showSectionTabs?: boolean }) {
+export function NewsDeskAccessGate({ initialTab, shell, showSectionTabs = false }: { initialTab?: string; shell: NewsDeskShellState | null; showSectionTabs?: boolean }) {
   const accessPhase = shell?.phase ?? "checkingAccess";
   const pending = accessPhase === "checkingAccess" || accessPhase === "loadingDesk";
+  const referencesPage = initialTab === "references";
 
   return (
     <NewsroomOpsShell
-      activeTab="overview"
+      activeTab={referencesPage ? "references" : "overview"}
       appTitle={SITE_BRAND.appTitle}
       backHref="/"
       backLabel={SITE_BRAND.backToHomeLabel}
       headerActions={(
         <Link className={cn(buttonVariants({ variant: "ghost", size: "sm" }))} href="/settings">Settings</Link>
       )}
-      pageTitle={showSectionTabs ? "Notification Center" : "Newsroom"}
-      showNavigation={showSectionTabs}
+      pageTitle={referencesPage ? "References" : showSectionTabs ? "Notification Center" : "Newsroom"}
+      showNavigation={showSectionTabs || referencesPage}
     >
-      {pending ? (showSectionTabs ? <NewsroomOverviewSkeleton /> : (
+      {pending && referencesPage ? <ReferencesPageLoading /> : pending ? (showSectionTabs ? <NewsroomOverviewSkeleton /> : (
         <div aria-label="Loading newsroom" className="space-y-4" data-newsroom-page-skeleton role="status">
           <div className="h-6 w-48 rounded bg-muted" />
           <div className="h-4 w-3/4 rounded bg-muted" />

package/components/newsroom-client-shell.tsx

@@ -2,13 +2,14 @@ import { NewsDeskClientProvider } from "./news-desk-client-provider";
 import { createDemoCategorySteeringDashboard } from "../lib/category-repository";
 import { resolveDevSandboxEditorAuth } from "../lib/dev-sandbox-editor-auth";
 import { isLocalPreviewEnabled } from "../lib/local-preview";
+import { withReferenceFeedFixture } from "../lib/local-preview-feed-fixture";
 import { getBrandNewsroomSectionsConfigPath, resolveActiveSiteBrand } from "../lib/site-brand-tenant";
 
 export function NewsroomClientShell({ children }: Readonly<{ children: React.ReactNode }>) {
   const devSandboxEditorAuth = resolveDevSandboxEditorAuth();
   const activeBrand = resolveActiveSiteBrand();
   const localPreviewDashboard = isLocalPreviewEnabled()
-    ? createDemoCategorySteeringDashboard(activeBrand.id, getBrandNewsroomSectionsConfigPath(activeBrand))
+    ? withReferenceFeedFixture(createDemoCategorySteeringDashboard(activeBrand.id, getBrandNewsroomSectionsConfigPath(activeBrand)))
     : null;
 
   return (

package/components/newsroom-ops-shell.tsx

@@ -165,7 +165,7 @@ export function NewsroomOpsShell({ activeTab, appTitle, backHref = "/", backLabe
         <Link className="organizer-masthead" href={backHref} title={backLabel}>{appTitle}</Link>
         <h1 data-newsroom-ops-title>{pageTitle}</h1><OrganizerSearch demo={demo} /><div className="organizer-header-actions">{headerActions}</div><Account placement="header" />
       </header>
-      <main className="organizer-main">{demo && <p className="organizer-demo-notice">Demo workspace · synthetic examples</p>}{children}</main>
+      <main className="organizer-main">{demo && !session?.shell.dashboard?.realDataPreview && <p className="organizer-demo-notice">Demo workspace · synthetic examples</p>}{children}</main>
     </div>
     {showNavigation && <NewsroomMobileNavigation activeTab={activeTab} items={ORGANIZER_PRIMARY_NAV.map(item => ({ ...item, href: getNewsroomNavHref(item.path, demo) }))}
       chat={consoleState?.shouldOfferConsole ? { open: consoleState.open, onOpen: consoleState.openConsole } : undefined}

package/components/newsroom-organizer.css

@@ -347,3 +347,47 @@ body:has(.newsroom-organizer)>[data-staging-banner]{flex-shrink:0}
 .news-desk-columns--administration .news-desk-newsletter__text{margin:0;padding:12px;max-height:280px;overflow:auto;border:1px solid var(--org-line);font:400 12px/1.5 ui-monospace,monospace;white-space:pre-wrap;overflow-wrap:anywhere}
 .news-desk-columns--administration .news-desk-newsletter__filters{display:flex;flex-wrap:wrap;gap:12px 24px}
 .news-desk-columns--administration .news-desk-newsletter__filters .news-desk-doctrine-card__field{min-width:180px}
+
+/* The References feed is rounded and borderless (Ryan's design rule): flat tones and rounded rectangles instead of lines and boxes.
+   The newsroom chrome squares every "rounded" class above; inside a [data-feed-surface] the rounded classes mean what they say.
+   The repeated attribute raises specificity over the squaring rules without !important escalation. */
+.newsroom-organizer[data-kanbus-theme] [data-feed-surface][data-feed-surface][data-feed-surface] [class*="rounded-full"],
+.newsroom-organizer[data-kanbus-theme] [data-feed-surface][data-feed-surface][data-feed-surface][class*="rounded-full"] { border-radius: 9999px !important; }
+.newsroom-organizer[data-kanbus-theme] [data-feed-surface][data-feed-surface][data-feed-surface] [class*="rounded-[20px]"],
+.newsroom-organizer[data-kanbus-theme] [data-feed-surface][data-feed-surface][data-feed-surface][class*="rounded-[20px]"] { border-radius: 20px !important; }
+.newsroom-organizer[data-kanbus-theme] [data-feed-surface][data-feed-surface][data-feed-surface] [class*="rounded-2xl"],
+.newsroom-organizer[data-kanbus-theme] [data-feed-surface][data-feed-surface][data-feed-surface][class*="rounded-2xl"] { border-radius: 16px !important; }
+.newsroom-organizer[data-kanbus-theme] [data-feed-surface][data-feed-surface][data-feed-surface] [class*="rounded-3xl"],
+.newsroom-organizer[data-kanbus-theme] [data-feed-surface][data-feed-surface][data-feed-surface][class*="rounded-3xl"] { border-radius: 24px !important; }
+
+/* Feed tones. Light: cards a touch lighter than the page, footers between, controls a touch darker. Dark: each step lifts toward the ink.
+   Also set on the portaled mobile sheet, which carries the theme attributes itself. */
+[data-kanbus-theme] [data-feed-surface], [data-kanbus-theme][data-feed-surface] {
+  --feed-card: color-mix(in oklab, var(--kb-theme-paper) 35%, white);
+  --feed-footer: color-mix(in oklab, var(--kb-theme-paper) 70%, white);
+  --feed-control: color-mix(in oklab, var(--kb-theme-paper) 90%, var(--kb-theme-ink));
+}
+[data-kanbus-theme][data-color-mode="dark"] [data-feed-surface], [data-kanbus-theme][data-color-mode="dark"][data-feed-surface] {
+  --feed-card: color-mix(in oklab, var(--kb-theme-paper) 94%, var(--kb-theme-ink));
+  --feed-footer: color-mix(in oklab, var(--kb-theme-paper) 90%, var(--kb-theme-ink));
+  --feed-control: color-mix(in oklab, var(--kb-theme-paper) 80%, var(--kb-theme-ink));
+}
+
+/* Borderless detail pane, Add panel and mobile sheet ([data-feed-flat]): no border, rule or box anywhere inside. Regions are told apart
+   by tone (card, footer, control) and shapes are rounded rectangles. The repeated attribute outranks the newsroom chrome's own rules. */
+[data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat],
+[data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat] * { border-width: 0 !important; }
+[data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat] *:not(:focus-visible) { box-shadow: none; }
+[data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat] :is([data-slot=separator], hr) { display: none !important; }
+[data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat] :is(button, [role=button], [data-slot=badge]):not([aria-pressed=true]):not([data-slot=sheet-close]):not([class*="hover:bg-muted"]) {
+  background: var(--feed-control) !important; border-radius: 9999px !important; color: var(--foreground, inherit);
+}
+[data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat] :is(button, [role=button])[aria-pressed=true]:not([class*="destructive"]) {
+  background: var(--primary) !important; color: var(--primary-foreground) !important; border-radius: 9999px !important;
+}
+[data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat] :is(button, [role=button])[aria-pressed=true][class*="destructive"] { border-radius: 9999px !important; }
+[data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat] :is(textarea, input:not([type=radio]):not([type=checkbox]), select, details, [data-cyclotron-choice]:not([data-predicted])) {
+  background: var(--feed-control) !important; border-radius: 16px !important;
+}
+[data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat] [data-cyclotron-choice] { border-radius: 9999px !important; }
+[data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat][data-feed-flat] [data-review-queue-bar] { background: var(--feed-footer) !important; }

package/components/newsroom-references-view.tsx

@@ -4,7 +4,7 @@ import type { PrimingPanelProps } from "cyclotron/components/priming-panel";
 import { ReferenceAddEntry } from "./reference-add-entry";
 import { ReferenceCurationControls, useReferenceImport } from "./reference-curation-controls";
 
-import { ExternalLinkIcon } from "lucide-react";
+import { ExternalLinkIcon, LayoutGridIcon, ListIcon, PlusIcon } from "lucide-react";
 import { usePathname } from "next/navigation";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { Badge } from "./ui/badge";
@@ -42,6 +42,14 @@ import {
 import { normalizeReferenceCurationStatus, referenceReasonCode, type ReferenceRejectionReasonCode } from "../lib/reference-policy";
 import { newsroomListRowClassName } from "../lib/newsroom-list-selection";
 import { ReferenceSourcePreview } from "./reference-source-preview";
+import { FEED_SURFACE_PROPS, FEED_SURFACE_STYLE, ReferenceFeed } from "./reference-feed";
+import { partitionReferenceFeed, type ReferenceFeedTabKey } from "../lib/reference-feed-ranking";
+import { referencePreviewsByLineage, type ReferencePreview } from "../lib/reference-preview";
+import { isLocalPreviewEnabled } from "../lib/local-preview";
+import { chooseSyntheticRejects, withSyntheticRejects } from "../lib/local-preview-synthetic-rejects";
+import { cn } from "../lib/utils";
+import { getKanbusTheme, SITE_BRAND } from "../lib/site-brand";
+import { useResolvedPapyrusTheme } from "./use-resolved-papyrus-theme";
 import {
   ReviewCard,
   predictionFromDecision,
@@ -120,8 +128,14 @@ type NewsroomReferencesViewProps = {
   onReview: (reference: ReferenceRecord, action: ReferenceCurationAction, options?: ReferenceReviewOptions) => Promise<void> | void;
   referenceAttachments?: ReferenceAttachmentRecord[];
   references: ReferenceRecord[];
+  /** True while the References are still being read: the feed shows card skeletons instead of an empty page. */
+  loading?: boolean;
+  /** The last view this browser saved. Shown, read only, until the live read arrives. */
+  savedCopy?: { references: ReferenceRecord[]; previews: Array<[string, ReferencePreview]>; decisions: Array<[string, RelevanceDecisionView]> } | null;
 };
 
+type ReferenceView = "feed" | "list";
+
 type ReferenceListFilter = ReferenceStatusFilter | "needs_review";
 
 const NEEDS_REVIEW_FILTER: { key: ReferenceListFilter; label: string } = { key: "needs_review", label: "Needs review" };
@@ -442,7 +456,7 @@ export function NewsroomReferencesView({
   priming,
   cyclotronStatus,
   cyclotronPriming,
-  decisions,
+  decisions: liveDecisions,
   humanCuratedReferenceLineageIds,
   delegatedCurations,
   shadowAgreement = null,
@@ -461,9 +475,14 @@ export function NewsroomReferencesView({
   initialReferenceLineageId = null,
   onReview,
   referenceAttachments = [],
-  references,
+  references: liveReferences,
+  loading = false,
+  savedCopy = null,
 }: NewsroomReferencesViewProps) {
   const pathname = usePathname();
+  // The portaled mobile sheet sits outside the newsroom root, so it carries the theme attributes itself (same as useNewsroomThemeAttributes).
+  const themeMode = useResolvedPapyrusTheme();
+  const themeAttributes = { "data-kanbus-theme": getKanbusTheme(SITE_BRAND), "data-color-mode": themeMode };
   const sessionImport = useReferenceImport(disabled);
   const [importedCount, setImportedCount] = useState(0);
   const isMobileDetail = useMediaQuery("(max-width: 767px)");
@@ -473,7 +492,66 @@ export function NewsroomReferencesView({
   );
   const routeLineageId = pathname ? pathnameLineageId ?? "" : initialReferenceLineageId ?? "";
 
+  // Until the live read arrives, a saved copy of the last view fills the page. It is display only.
+  const showingSavedCopy = loading && !liveReferences.length && Boolean(savedCopy?.references.length);
+  const references = showingSavedCopy ? savedCopy!.references : liveReferences;
+  const baseDecisions = useMemo(
+    () => (showingSavedCopy && !liveDecisions?.size ? new Map(savedCopy!.decisions) : liveDecisions),
+    [liveDecisions, savedCopy, showingSavedCopy],
+  );
+  // Preview only: ?feedSynthRejects=N makes the N weakest Accept predictions into made-up Rejects (the page says so).
+  const synthRejectCount = useMemo(() => {
+    if (typeof window === "undefined" || !isLocalPreviewEnabled()) return 0;
+    const requested = Number(new URLSearchParams(window.location.search).get("feedSynthRejects"));
+    return Number.isInteger(requested) && requested > 0 ? requested : 0;
+  }, []);
+  const syntheticChoice = useRef<string[] | null>(null);
+  if (synthRejectCount && syntheticChoice.current === null && baseDecisions?.size && references.length) {
+    syntheticChoice.current = chooseSyntheticRejects(
+      baseDecisions,
+      new Set(references.filter((reference) => normalizeReferenceCurationStatus(reference.curationStatus) === "pending").map(referenceLineageId)),
+      synthRejectCount,
+    );
+  }
+  const synthetic = useMemo(
+    () => (synthRejectCount && syntheticChoice.current ? withSyntheticRejects(baseDecisions, syntheticChoice.current) : null),
+    [baseDecisions, synthRejectCount],
+  );
+  const decisions = synthetic?.decisions ?? baseDecisions;
+  const previews = useMemo(() => {
+    const live = referencePreviewsByLineage(referenceAttachments);
+    return showingSavedCopy && !live.size ? new Map(savedCopy!.previews) : live;
+  }, [referenceAttachments, savedCopy, showingSavedCopy]);
+  const [view, setView] = useState<ReferenceView>("feed");
+  const [addOpen, setAddOpen] = useState(false);
+  const [feedTab, setFeedTab] = useState<ReferenceFeedTabKey>("feed");
+  const [visitRated, setVisitRated] = useState<ReadonlySet<string>>(() => new Set());
+  const [mountedAt] = useState(() => Date.now());
+  const markVisitRated = useCallback((lineageId: string) => {
+    setVisitRated((current) => (current.has(lineageId) ? current : new Set(current).add(lineageId)));
+  }, []);
+  // Preview only: ?feedTau=<days> stands in for the learned freshness period, to review the Earlier section on a young corpus.
+  const tauDaysOverride = useMemo(() => {
+    if (typeof window === "undefined" || !isLocalPreviewEnabled()) return null;
+    const requested = Number(new URLSearchParams(window.location.search).get("feedTau"));
+    return Number.isFinite(requested) && requested > 0 ? requested : null;
+  }, []);
+
+  // Preview only: ?feedState=loading holds the page in its loading state, to review the card skeletons.
+  const previewSkeleton = useMemo(
+    () => typeof window !== "undefined" && isLocalPreviewEnabled() && new URLSearchParams(window.location.search).get("feedState") === "loading",
+    [],
+  );
+
   const canonicalReferences = useMemo(() => selectCanonicalReferenceRecords(references), [references]);
+  const partition = useMemo(
+    () => partitionReferenceFeed(canonicalReferences, decisions, { now: mountedAt, visitRated, tauDaysOverride }),
+    [canonicalReferences, decisions, mountedAt, tauDaysOverride, visitRated],
+  );
+  const feedOrderIds = useMemo(
+    () => (feedTab === "feed" ? [...partition.feed, ...partition.earlier] : feedTab === "rated" ? partition.rated : partition.earlier).map((item) => item.lineageId),
+    [feedTab, partition],
+  );
   const statusCounts = useMemo(() => countReferencesByStatus(canonicalReferences), [canonicalReferences]);
 
   const [statusFilter, setStatusFilter] = useState<ReferenceListFilter>(routeLineageId ? "all" : "pending");
@@ -504,14 +582,14 @@ export function NewsroomReferencesView({
   // list, but keeps its place in the queue until they move on, so "3 of 29" does not jump under them.
   const queueRef = useRef<string[]>([]);
   const queue = useMemo(() => {
-    const ids = filteredReferences.map(referenceLineageId);
+    const ids = view === "feed" ? [...feedOrderIds] : filteredReferences.map(referenceLineageId);
     const open = selectedReference ? referenceLineageId(selectedReference) : "";
     if (open && !ids.includes(open)) {
       const before = queueRef.current.indexOf(open);
       if (before >= 0) ids.splice(Math.min(before, ids.length), 0, open);
     }
     return ids;
-  }, [filteredReferences, selectedReference]);
+  }, [feedOrderIds, filteredReferences, selectedReference, view]);
   useEffect(() => { queueRef.current = queue; }, [queue]);
   const [caughtUp, setCaughtUp] = useState(false);
   const selectedIndex = selectedReference ? queue.indexOf(referenceLineageId(selectedReference)) : -1;
@@ -582,9 +660,21 @@ export function NewsroomReferencesView({
 
   const runReview = (action: ReferenceCurationAction, options?: ReferenceReviewOptions) => {
     if (!selectedReference) return;
+    if (action === "accept" || action === "reject") markVisitRated(referenceLineageId(selectedReference));
     return onReview(selectedReference, action, options);
   };
 
+  const rateFromFeed = async (reference: ReferenceRecord, choice: ReviewChoice, reasonCode: ReferenceRejectionReasonCode | null) => {
+    const decision = decisions?.get(referenceLineageId(reference));
+    await onReview(reference, choice, {
+      reasonCode: choice === "reject" ? reasonCode : null,
+      ...(decision ? { decisionRelationId: decision.decisionRelationId, shareable: false } : {}),
+    });
+  };
+  const feedDisabledReason = disabled
+    ? "Editor access is required to change this reference."
+    : showingSavedCopy ? "Confirming your sign-in. You can answer in a moment." : null;
+
   const caughtUpPanel = (
     <div className="space-y-2 p-6 text-center" data-review-caught-up>
       <h3 className="text-lg font-semibold">All caught up</h3>
@@ -606,23 +696,64 @@ export function NewsroomReferencesView({
       data-detail-open={selectedReference || routeLineageId ? "true" : "false"}
     >
       <div className="flex min-h-0 min-w-0 flex-1 flex-col gap-4 md:overflow-hidden">
-        <div className="shrink-0 space-y-1">
-          <h2 className="text-lg font-semibold tracking-tight">References</h2>
-          <p className="text-sm text-muted-foreground">
-            Review source intake before it becomes accepted evidence.
-          </p>
+        <div className="flex shrink-0 items-center justify-between gap-3" {...FEED_SURFACE_PROPS}>
+          <div className="min-w-0 space-y-0.5">
+            <h2 className="text-2xl font-bold tracking-tight">References</h2>
+            <p className="hidden text-sm text-muted-foreground sm:block">
+              {view === "feed" ? "A feed ranked by what you are most likely to accept." : "Review source intake before it becomes accepted evidence."}
+            </p>
+          </div>
+          <div className="flex items-center gap-2">
+            <button
+              aria-controls="reference-add-panel"
+              aria-expanded={addOpen}
+              aria-label="Add a reference and prediction activity"
+              className={cn("inline-flex min-h-10 items-center justify-center gap-1.5 rounded-full px-3 text-sm font-medium outline-none transition-colors focus-visible:ring-2 focus-visible:ring-ring", addOpen ? "bg-[var(--feed-control)] text-foreground" : "bg-[var(--feed-card)] text-muted-foreground hover:text-foreground")}
+              data-reference-add-toggle
+              onClick={() => setAddOpen((open) => !open)}
+              title="Add a reference and prediction activity"
+              type="button"
+            >
+              <PlusIcon aria-hidden="true" className="size-4" />
+              <span className="hidden sm:inline">Add</span>
+            </button>
+            <div aria-label="Reference view" className="inline-flex rounded-full bg-[var(--feed-card)] p-1" role="group">
+              {([["feed", "Feed", LayoutGridIcon], ["list", "List", ListIcon]] as const).map(([key, label, Icon]) => (
+                <button
+                  aria-label={label}
+                  aria-pressed={view === key}
+                  className={cn(
+                    "inline-flex min-h-8 items-center justify-center gap-1.5 rounded-full px-3 text-sm font-medium outline-none transition-colors focus-visible:ring-2 focus-visible:ring-ring",
+                    view === key ? "bg-[var(--feed-control)] text-foreground" : "text-muted-foreground hover:text-foreground",
+                  )}
+                  data-reference-view={key}
+                  key={key}
+                  onClick={() => { setView(key); setCaughtUp(false); }}
+                  title={label}
+                  type="button"
+                >
+                  <Icon aria-hidden="true" className="size-4" />
+                  <span className="hidden sm:inline">{label}</span>
+                </button>
+              ))}
+            </div>
+          </div>
         </div>
-        {predictionState === "loading" ? <p role="status">Loading predictions…</p> : null}
+        {synthetic?.changed ? (
+          <p className="rounded-2xl bg-[var(--feed-card)] p-3 text-sm" data-preview-synthetic role="status" {...FEED_SURFACE_PROPS}>
+            Preview only: {synthetic.changed} of these predictions are made up to show the Reject end of the feed. Real data has none yet.
+          </p>
+        ) : null}
+        {predictionState === "loading" && view === "list" ? <p role="status">Loading predictions…</p> : null}
         {predictionState === "error" ? (
-          <div role="alert" className="space-y-2 rounded-md border p-3">
+          <div role="alert" className="space-y-2 rounded-2xl bg-[var(--feed-card)] p-4" {...FEED_SURFACE_PROPS}>
             <p>Predictions unavailable. {predictionError}</p>
             <p className="text-sm">You can still review references. Existing suggestions may be out of date.</p>
             {onRetryPredictions ? <Button onClick={onRetryPredictions} size="sm" type="button" variant="outline">Retry predictions</Button> : null}
           </div>
         ) : null}
-        <details className="shrink-0 overflow-y-auto rounded-md border p-3 text-sm" style={{ maxHeight: "35dvh" }}>
-          <summary className="cursor-pointer font-semibold">Add a reference and prediction activity</summary>
-          <div className="mt-3 space-y-4">
+        <div className="shrink-0 overflow-y-auto rounded-[20px] bg-[var(--feed-card)] p-4 text-sm" data-feed-flat="" data-feed-surface="" hidden={!addOpen} id="reference-add-panel" style={{ ...FEED_SURFACE_STYLE, maxHeight: "45dvh", overflowY: "auto" }}>
+          <div className="space-y-4">
         <ReferenceLiveAgreement agreement={shadowAgreement} />
         <ReferenceAddEntry
           importOptions={disabled ? null : priming ?? sessionImport?.panel}
@@ -639,8 +770,31 @@ export function NewsroomReferencesView({
           </div>
         ) : null}
           </div>
-        </details>
+        </div>
 
+        {view === "feed" ? (
+          <ScrollArea className="min-h-0 flex-1" data-reference-feed-scroll>
+            <div className="pb-6 pr-1">
+              <ReferenceFeed
+                disabledReason={feedDisabledReason}
+                loading={previewSkeleton || (loading && !references.length)}
+                now={mountedAt}
+                onOpen={selectReference}
+                onRate={rateFromFeed}
+                onTabChange={(next) => { setFeedTab(next); setCaughtUp(false); }}
+                onVisitRated={markVisitRated}
+                partition={partition}
+                predictionLoading={predictionState === "loading"}
+                previews={previews}
+                selectedLineageId={selectedLineageId}
+                stale={showingSavedCopy || (loading && references.length > 0)}
+                tab={feedTab}
+                visitRated={visitRated}
+              />
+            </div>
+          </ScrollArea>
+        ) : (
+          <>
         <Tabs
           className="shrink-0"
           defaultValue="pending"
@@ -716,15 +870,22 @@ export function NewsroomReferencesView({
             )}
           </div>
         </ScrollArea>
+          </>
+        )}
       </div>
 
       <div
-        className="hidden min-h-0 w-full shrink-0 flex-col overflow-hidden rounded-xl border border-border bg-card md:flex md:w-[min(100%,24rem)] lg:w-[min(100%,28rem)]"
+        className={cn(
+          "hidden min-h-0 w-full shrink-0 flex-col overflow-hidden rounded-[20px] bg-[var(--feed-card)] md:flex md:w-[min(100%,24rem)] lg:w-[min(100%,28rem)]",
+          view === "feed" && !selectedReference && "md:hidden",
+        )}
         data-newsroom-list-detail-shell
         data-news-desk-section="references"
         data-detail-open={selectedReference ? "true" : "false"}
+        data-feed-flat=""
+        {...FEED_SURFACE_PROPS}
       >
-        <div className="flex shrink-0 items-center justify-between gap-2 border-b border-border px-3 py-2">
+        <div className="flex shrink-0 items-center justify-between gap-2 px-4 pt-3 pb-1">
           <span className="text-sm font-medium text-foreground">Detail</span>
         </div>
         <div className="flex min-h-0 flex-1 flex-col" data-review-gestures onPointerDown={gestures.onPointerDown} onPointerUp={gestures.onPointerUp} style={gestures.style}>
@@ -766,12 +927,12 @@ export function NewsroomReferencesView({
           }}
           open={(mobileDetailOpen && Boolean(selectedReference)) || caughtUp}
         >
-          <SheetContent className="gap-0 p-0" side="bottom">
+          <SheetContent className="gap-0 rounded-t-[24px] bg-[var(--feed-card)] p-0" data-feed-flat="" data-feed-surface="" side="bottom" {...themeAttributes}>
             <SheetHeader className="border-b border-border px-4 py-3">
               <SheetTitle className="text-left text-base">Reference</SheetTitle>
             </SheetHeader>
             {selectedReference ? (
-              <div data-review-gestures onPointerDown={gestures.onPointerDown} onPointerUp={gestures.onPointerUp} style={gestures.style}><ScrollArea className="max-h-[70dvh]">
+              <div className="min-w-0" data-review-gestures onPointerDown={gestures.onPointerDown} onPointerUp={gestures.onPointerUp} style={gestures.style}><ScrollArea className="max-h-[70dvh]">
                 <ReferenceDetailPanel
                   key={referenceLineageId(selectedReference)}
                   predictionState={predictionState}