@anthusai/papyrus 5.43.0-next.3 → 5.43.0-next.30

package/components/needs-me-reference-detail.tsx

@@ -0,0 +1,75 @@
+"use client";
+
+import { referenceDisplayTitle, referenceLineageId, formatReferenceListDate } from "../lib/newsroom-references";
+import { referenceMetadataField } from "../lib/reference-display";
+import { referenceDek, referencePreviewsByLineage } from "../lib/reference-preview";
+import { DEFAULT_TEASER_WORDS } from "../lib/reference-capture";
+import { referenceReasonCode, normalizeReferenceCurationStatus } from "../lib/reference-policy";
+import type { ReferenceRecord } from "../lib/category-repository";
+import type { NeedsMeEntry } from "../lib/needs-me-items";
+import { DefaultOutcome, Heading, type DetailProps } from "./needs-me-bodies";
+import { decidedChoiceOf } from "./needs-me-shared";
+import { predictionFromDecision, ReviewCard, type CardPrediction } from "./reference-review-card";
+import { ReferenceCapturePanel } from "./reference-capture-panel";
+import { useReferenceCapture } from "./reference-capture-client";
+import { ReferenceSourcePreview } from "./reference-source-preview";
+import { ReferenceSuggestionProvenance } from "./reference-cyclotron-suggestion";
+import { useReferencePreviewAttachments } from "./use-reference-preview-attachments";
+
+function cardPrediction(item: NeedsMeEntry, predictionLoading: boolean): CardPrediction {
+  if (item.payload.kind === "reference" && item.payload.decision) return predictionFromDecision(item.payload.decision);
+  return predictionLoading ? { state: "loading" } : { state: "none" };
+}
+
+/**
+ * A Reference, or a Reference whose capture may be cut off: the References detail's own pieces, in the same order. What the item is
+ * comes first (title, blurb, link, badges, summary), then the rating, then what was captured and how well.
+ */
+export function ReferenceBody(props: DetailProps & { payload: Extract<NeedsMeEntry["payload"], { kind: "reference" }> }) {
+  const { item, payload, ratings, disabledReason, attachments, captureTeaserLine = DEFAULT_TEASER_WORDS, onCorrectCapture, predictionLoading } = props;
+  const reference: ReferenceRecord = payload.reference;
+  const lineageId = referenceLineageId(reference);
+  const status = normalizeReferenceCurationStatus(reference.curationStatus);
+  const previewAttachments = useReferencePreviewAttachments(reference, attachments);
+  const capture = useReferenceCapture(reference, previewAttachments, captureTeaserLine, onCorrectCapture);
+  const url = reference.sourceUri?.trim() && /^https?:\/\//i.test(reference.sourceUri.trim()) ? reference.sourceUri.trim() : null;
+  const summary = capture.summary ?? referenceMetadataField(null, reference.metadata, "summary");
+  const dek = referenceDek(reference, referencePreviewsByLineage(previewAttachments).get(lineageId));
+  const incomplete = item.type === "incomplete_capture";
+  return (
+    <div className="space-y-4" data-reference-curation-status={status} data-news-desk-reference-detail={lineageId}>
+      <ReviewCard
+        decided={decidedChoiceOf(item)}
+        disabledReason={disabledReason}
+        initialNote={status === "pending" ? "" : reference.curationStatusReason ?? ""}
+        initialReason={referenceReasonCode(reference) ?? null}
+        dek={dek}
+        itemId={item.id}
+        meta={<Heading item={item} />}
+        onDecide={async () => undefined}
+        prediction={cardPrediction(item, predictionLoading)}
+        ratings={ratings}
+        sourcePreview={<ReferenceSourcePreview attachments={previewAttachments} sourceUri={reference.sourceUri} />}
+        summary={summary}
+        title={referenceDisplayTitle(reference)}
+        titleHref={url}
+      >
+        {payload.decision ? <div data-reference-relevance-decision={lineageId}><ReferenceSuggestionProvenance decision={payload.decision} /></div> : null}
+      </ReviewCard>
+      <DefaultOutcome item={item} />
+      {incomplete ? <p className="text-sm text-muted-foreground" data-needs-me-capture-note>The captured text looks cut off or missing. Read it below. If it is incomplete, choose Paste or correct the text and say whether the capture was complete, or rate the Reference as it is.</p> : null}
+      <ReferenceCapturePanel capture={capture} showSummary={false} />
+      <dl className="grid grid-cols-2 gap-3 text-sm">
+        <div>
+          <dt className="text-xs font-medium uppercase tracking-wide text-muted-foreground">Imported</dt>
+          <dd className="mt-1 text-foreground">{formatReferenceListDate(reference)}</dd>
+        </div>
+        <div>
+          <dt className="text-xs font-medium uppercase tracking-wide text-muted-foreground">Media</dt>
+          <dd className="mt-1 text-foreground">{reference.mediaType ?? "unknown"}</dd>
+        </div>
+      </dl>
+    </div>
+  );
+}
+

package/components/needs-me-shared.tsx

@@ -0,0 +1,48 @@
+"use client";
+
+import { CheckIcon, CircleCheckIcon, Loader2Icon } from "lucide-react";
+import { cn } from "../lib/utils";
+import type { NeedsMeEntry } from "../lib/needs-me-items";
+import type { ReviewChoice } from "./reference-review-card";
+
+/** References and captures are rated like the References feed: a reason code is asked for on Reject. */
+export function isReferenceLike(item: Pick<NeedsMeEntry, "type">): boolean {
+  return item.type === "reference" || item.type === "incomplete_capture";
+}
+
+export function decidedChoiceOf(item: Pick<NeedsMeEntry, "decisionState">): ReviewChoice | null {
+  return item.decisionState === "accepted" ? "accept" : item.decisionState === "rejected" ? "reject" : null;
+}
+
+/** What was recorded when a non-Reference item was decided: its Why, and whether it was rejected as "not this kind". Shown again whenever the item is reopened. */
+export function recordedAnswer(item: NeedsMeEntry): { why: string | null; notThisKind: boolean } {
+  const { payload } = item;
+  if (payload.kind === "draft") return { why: payload.item.decision?.why ?? null, notThisKind: Boolean(payload.item.decision?.notThisKind) };
+  if (payload.kind === "request") return { why: payload.request.answer?.feedback ?? null, notThisKind: payload.request.answer?.steer === "not_this_kind" };
+  if (payload.kind === "email") return { why: payload.summary.quarantine?.decision?.reason || null, notThisKind: false };
+  return { why: null, notThisKind: false };
+}
+
+/** A flag is information, not a question: one Acknowledge button in the footer's own tone. */
+export function FlagFooter({ busy, disabledReason, done, error, onAcknowledge }: { busy: boolean; disabledReason: string | null; done: boolean; error: string | null; onAcknowledge: () => void }) {
+  return (
+    <div className="space-y-2" data-flag-footer>
+      {done ? (
+        <p className="inline-flex min-h-12 items-center gap-1.5 text-sm font-medium" data-flag-acknowledged><CircleCheckIcon aria-hidden="true" className="size-4" />Acknowledged</p>
+      ) : (
+        <button
+          aria-disabled={busy || Boolean(disabledReason) || undefined}
+          className={cn("inline-flex min-h-12 w-full items-center justify-center gap-1.5 rounded-[16px] bg-[var(--feed-control)] px-3 text-sm font-semibold text-foreground outline-none transition-colors hover:bg-[var(--feed-control)]/70 focus-visible:ring-2 focus-visible:ring-ring", (busy || disabledReason) && "opacity-60")}
+          data-flag-acknowledge
+          onClick={() => { if (!busy && !disabledReason) onAcknowledge(); }}
+          type="button"
+        >
+          {busy ? <Loader2Icon aria-hidden="true" className="size-4 animate-spin" /> : <CheckIcon aria-hidden="true" className="size-4" />}
+          {busy ? "Saving…" : "Acknowledge"}
+        </button>
+      )}
+      {disabledReason && !done ? <p className="text-xs text-muted-foreground" data-review-disabled-reason>{disabledReason}</p> : null}
+      {error ? <p className="text-xs text-destructive" role="alert">{error}</p> : null}
+    </div>
+  );
+}

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, wantsReferencesHeadStart } 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" && wantsReferencesHeadStart(window.location.pathname)) prefetchReferencesFeed();
 
     try {
       const dashboard = await loadEditorNewsDeskDashboard({ isAdmin: access.isAdmin });
@@ -113,7 +126,8 @@ export function NewsDeskClientProvider({
         return;
       }
       if (isAuthorizationError(error)) {
-        setShell((current) => resolveForbidden(current, access.auth));
+        // The session already has editor rights, so the backend refusing a read is not a missing role. Say what was refused.
+        setShell((current) => resolveDashboardFailure(current, access.auth, refusedReadMessage(error)));
         return;
       }
       setShell((current) => resolveDashboardFailure(
@@ -182,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;
       }
@@ -215,9 +231,14 @@ function isAuthorizationError(error: unknown): boolean {
   return /not authorized|unauthorized|access denied|forbidden/i.test(message);
 }
 
+function refusedReadMessage(error: unknown): string {
+  const detail = error instanceof Error ? error.message : String(error ?? "");
+  return `The Newsroom backend refused a read for this signed-in account (${detail}). The account has editor or admin rights, so this is a backend authorization rule, not a missing role.`;
+}
+
 function resolvePrivateReadFailure(state: NewsDeskShellState, auth: NewsDeskShellState["auth"], error: unknown, fallback: string): NewsDeskShellState {
   if (isUnauthenticatedError(error)) return resolveSignedOut(state, { status: "signedOut", label: "Signed out" });
-  if (isAuthorizationError(error)) return resolveForbidden(state, auth);
+  if (isAuthorizationError(error)) return resolveDashboardFailure(state, auth, refusedReadMessage(error));
   return resolveDashboardFailure(state, auth, error instanceof Error ? error.message : fallback);
 }
 

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/news-desk-taxonomy-client.ts

@@ -1,6 +1,7 @@
 "use client";
 
 import { loadReferenceReviewDetails } from "../lib/reference-review-details";
+import { hasEditorRights } from "../lib/staff-groups";
 
 import { isEditorialWorkAssignment } from "../lib/newsroom-assignments";
 import { isLocalPreviewEnabled } from "../lib/local-preview";
@@ -838,7 +839,7 @@ export async function loadEditorResolvedAccessState(): Promise<EditorAccessState
     if (!refreshed.hasSession || refreshed.auth.status === "signedOut") {
       return { status: "signedOut", isEditor: false, isAdmin: false, auth: refreshed.auth, error: null };
     }
-    const isEditor = refreshed.groups.some((group) => group === "editor" || group === "admin");
+    const isEditor = hasEditorRights(refreshed.groups);
     if (!isEditor) {
       return {
         status: "forbidden",

package/components/newsroom-access-gate.tsx

@@ -1,44 +1,36 @@
 "use client";
 
-import { newsroomHref } from "../lib/newsroom-base-path";
 import Link from "next/link";
 import { SITE_BRAND } from "../lib/site-brand";
 import type { NewsDeskShellState } from "../lib/news-desk-session";
 import { cn } from "../lib/utils";
 import { NewsroomOpsShell } from "./newsroom-ops-shell";
-import { NewsroomOverviewSkeleton } from "./newsroom-overview-skeleton";
+import { NotificationSkeleton } from "./notification-cards";
 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>
+        <Link className={cn(buttonVariants({ variant: "ghost", size: "sm" }), "organizer-header-settings")} href="/settings">Settings</Link>
       )}
-      pageTitle={showSectionTabs ? "Notification Center" : "Newsroom"}
-      showNavigation={showSectionTabs}
+      pageTitle={referencesPage ? "References" : showSectionTabs ? "Notification Center" : "Newsroom"}
+      showNavigation={showSectionTabs || referencesPage}
     >
-      {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" />
-          <div className="grid gap-3 sm:grid-cols-2">
-            {Array.from({ length: 4 }, (_, index) => <div className="h-32 rounded-xl border bg-card p-4" key={index}>
-              <div className="h-4 w-2/3 rounded bg-muted" /><div className="mt-4 h-3 w-1/2 rounded bg-muted" />
-            </div>)}
-          </div>
-        </div>
-      )) : (
+      {/* The loading state is the feed's own skeleton, so what loads replaces it in place. */}
+      {pending && referencesPage ? <ReferencesPageLoading /> : pending ? <NotificationSkeleton bare={!showSectionTabs} count={4} /> : (
       <section aria-live="polite" data-news-desk-access={accessPhase} data-news-desk-access-phase={accessPhase}>
-        <div className="space-y-3 rounded-xl border border-border bg-card p-6">
+        <div className="space-y-3 rounded-xl bg-card p-6">
           <p className="m-0 text-[0.7rem] font-semibold uppercase tracking-[0.08em] text-muted-foreground">Access</p>
           <h2 className="m-0 font-sans text-xl font-semibold tracking-tight">{formatAccessTitle(shell)}</h2>
           <p className="m-0 text-sm text-muted-foreground">{formatAccessDetail(shell)}</p>
@@ -46,7 +38,8 @@ export function NewsDeskAccessGate({ shell, showSectionTabs = false }: { shell:
           <p className="m-0 text-sm text-foreground">{formatAccessActionDetail(shell)}</p>
           {shell?.phase === "signedOut" || shell?.phase === "error" ? (
             <div className="news-desk-access-panel__auth">
-              <ReaderAuthControl postAuthPath={newsroomHref()} showIdentity />
+              {/* No fixed return path: sign-in comes back to the page that asked, so a deep link survives it. */}
+              <ReaderAuthControl showIdentity />
             </div>
           ) : null}
         </div>

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-overview.tsx

@@ -2,18 +2,11 @@
 
 import Link from "next/link";
 import { usePathname } from "next/navigation";
-import { useMemo } from "react";
-import { Badge } from "./ui/badge";
+import { useCallback, useMemo } from "react";
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "./ui/card";
-import type { AssignmentRecord, NewsroomSectionRecord, ReferenceRecord } from "../lib/category-repository";
+import type { AssignmentRecord, NewsroomSectionRecord, ReferenceAttachmentRecord, ReferenceRecord } from "../lib/category-repository";
 import { getNewsroomNavHref } from "../lib/newsroom-nav";
-import {
-  filterReferencesByStatus,
-  formatReferenceListDate,
-  referenceDisplayTitle,
-  referenceLineageId,
-  selectCanonicalReferenceRecords,
-} from "../lib/newsroom-references";
+import { referenceLineageId, selectCanonicalReferenceRecords, type ReferenceCurationAction } from "../lib/newsroom-references";
 import {
   buildNewsroomSectionHref,
   displayNewsroomSectionShortTitle,
@@ -21,9 +14,15 @@ import {
   newsroomDeskKind,
   sortNewsroomSections,
 } from "../lib/newsroom-sections";
-import { newsroomInboxRowClassName } from "../lib/newsroom-list-selection";
+import { cn } from "../lib/utils";
+import { FEED_SURFACE_PROPS } from "./reference-feed";
 import type { RelevanceDecisionView } from "../lib/relevance-decisions";
+import type { ReferenceRejectionReasonCode } from "../lib/reference-policy";
+import { referencePreviewsByLineage, type ReferencePreview } from "../lib/reference-preview";
+import type { NotificationFixture } from "./notification-center";
 import { NotificationCenter } from "./notification-center";
+import type { CorrectCaptureAction } from "./reference-capture-client";
+import type { ReviewChoice } from "./reference-review-card";
 
 type NewsroomOpsOverviewProps = {
   assignments: AssignmentRecord[];
@@ -33,26 +32,57 @@ type NewsroomOpsOverviewProps = {
   humanCuratedReferenceLineageIds?: ReadonlySet<string>;
   newsroomSections: NewsroomSectionRecord[];
   references: ReferenceRecord[];
+  referenceAttachments?: ReferenceAttachmentRecord[];
+  /** True until the References have been read; a saved copy of the last view fills the page meanwhile. */
+  loading?: boolean;
+  savedCopy?: { references: ReferenceRecord[]; previews: Array<[string, ReferencePreview]>; decisions: Array<[string, RelevanceDecisionView]> } | null;
+  predictionState?: "loading" | "ready" | "error";
+  /** Words for why a rating cannot be saved right now, or null. */
+  disabledReason?: string | null;
+  onReview?: (reference: ReferenceRecord, action: ReferenceCurationAction, options?: { reasonCode?: ReferenceRejectionReasonCode | null; note?: string; decisionRelationId?: string; shareable?: boolean }) => Promise<void> | void;
+  /** Saves a pasted or corrected capture (the `correctReferenceCapture` action). Without it the capture panel has no edit action. */
+  onCorrectCapture?: CorrectCaptureAction;
+  /** Local real-data preview of the Notification Center (scripts/export-notification-center-fixture.py). */
+  notificationFixture?: NotificationFixture | null;
 };
 
 const NO_DECISIONS: ReadonlyMap<string, RelevanceDecisionView> = new Map();
-const NO_IDS: ReadonlySet<string> = new Set();
 
 export function NewsroomOpsOverview({
   actorLabel = "",
   assignments,
   decisions = NO_DECISIONS,
   demo = false,
-  humanCuratedReferenceLineageIds = NO_IDS,
+  humanCuratedReferenceLineageIds,
+  disabledReason = null,
+  loading = false,
   newsroomSections,
+  notificationFixture = null,
+  onCorrectCapture,
+  onReview,
+  predictionState = "ready",
+  referenceAttachments = [],
   references,
+  savedCopy = null,
 }: NewsroomOpsOverviewProps) {
   const pathname = usePathname();
-  const canonicalReferences = useMemo(() => selectCanonicalReferenceRecords(references), [references]);
-  const pendingReferences = useMemo(
-    () => filterReferencesByStatus(canonicalReferences, "pending").slice(0, 5),
-    [canonicalReferences],
-  );
+  const liveReferences = useMemo(() => selectCanonicalReferenceRecords(references), [references]);
+  // 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 canonicalReferences = showingSavedCopy ? savedCopy!.references : liveReferences;
+  const shownDecisions = useMemo(() => (showingSavedCopy && !decisions.size ? new Map(savedCopy!.decisions) : decisions), [decisions, savedCopy, showingSavedCopy]);
+  const previews = useMemo(() => {
+    const live = referencePreviewsByLineage(referenceAttachments);
+    return showingSavedCopy && !live.size ? new Map(savedCopy!.previews) : live;
+  }, [referenceAttachments, savedCopy, showingSavedCopy]);
+  const rateReference = useCallback(async (reference: ReferenceRecord, choice: ReviewChoice, reasonCode: ReferenceRejectionReasonCode | null, note?: string) => {
+    const decision = shownDecisions.get(referenceLineageId(reference));
+    await onReview?.(reference, choice, {
+      reasonCode: choice === "reject" ? reasonCode : null,
+      ...(note ? { note } : {}),
+      ...(decision ? { decisionRelationId: decision.decisionRelationId, shareable: false } : {}),
+    });
+  }, [onReview, shownDecisions]);
   const attentionAssignments = useMemo(
     () => assignments
       .filter((assignment) => {
@@ -68,58 +98,21 @@ export function NewsroomOpsOverview({
   );
   const coreDesks = useMemo(() => desks.filter(desk => newsroomDeskKind(desk) === "core"), [desks]);
   const rotatingDesks = useMemo(() => desks.filter(desk => newsroomDeskKind(desk) === "rotating"), [desks]);
+  const rateDisabled = disabledReason ?? (showingSavedCopy ? "Confirming your sign-in. You can answer in a moment." : null);
 
-  return (
-    <div
-      className="space-y-8 font-sans"
-      data-news-desk-section="overview"
-      data-newsroom-ops-home="true"
-    >
-      <div className="space-y-8" data-newsroom-overview-feeds>
-        <div aria-label="Notification Center feed" className="newsroom-overview-feed-frame rounded-xl border bg-card p-4 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring" data-newsroom-overview-notifications role="region" tabIndex={0}>
-          <NotificationCenter
-            actorLabel={actorLabel}
-            decisions={decisions}
-            demo={demo}
-            humanCuratedReferenceLineageIds={humanCuratedReferenceLineageIds}
-            references={canonicalReferences}
-          />
-        </div>
-        <section aria-label="Needs attention" className="space-y-3">
-          <h2 className="text-sm font-medium text-muted-foreground">Needs attention</h2>
-          {pendingReferences.length || attentionAssignments.length ? (
+  const below = (
+    <div className="space-y-12 pt-6" data-newsroom-overview-below {...FEED_SURFACE_PROPS}>
+        {attentionAssignments.length ? (
+          <section aria-label="Open assignments" className="space-y-3">
+            <h2 className="text-sm font-medium text-muted-foreground">Open assignments</h2>
             <div className="space-y-2">
-              {pendingReferences.map((reference) => {
-                const lineageId = referenceLineageId(reference);
-                const href = getNewsroomNavHref(`/newsroom/references/${encodeURIComponent(lineageId)}`, demo);
-                const active = pathname === href || pathname.startsWith(`${href}/`);
-                return (
-                  <Link
-                    aria-current={active ? "true" : undefined}
-                    className={newsroomInboxRowClassName(active)}
-                    data-newsroom-inbox-item="reference"
-                    data-newsroom-list-row
-                    data-selected={active || undefined}
-                    data-newsroom-card
-                    data-newsroom-card-id={lineageId}
-                    href={href}
-                    key={lineageId}
-                  >
-                    <div className="min-w-0 flex-1">
-                      <p className="truncate text-sm font-medium text-foreground">{referenceDisplayTitle(reference)}</p>
-                      <p className="text-xs text-muted-foreground">Review source intake · {formatReferenceListDate(reference)}</p>
-                    </div>
-                    <Badge className="mt-0.5 shrink-0" variant="outline">Pending</Badge>
-                  </Link>
-                );
-              })}
               {attentionAssignments.map((assignment) => {
                 const href = getNewsroomNavHref(`/newsroom/assignments/${encodeURIComponent(assignment.id)}`, demo);
                 const active = pathname === href || pathname.startsWith(`${href}/`);
                 return (
                   <Link
                     aria-current={active ? "true" : undefined}
-                    className={newsroomInboxRowClassName(active)}
+                    className={cn("flex items-start gap-3 rounded-[16px] bg-[var(--feed-card)] p-3 text-foreground outline-none transition-colors hover:bg-[var(--feed-control)] focus-visible:ring-2 focus-visible:ring-ring", active && "bg-[var(--feed-control)]")}
                     data-newsroom-inbox-item="assignment"
                     data-newsroom-list-row
                     data-selected={active || undefined}
@@ -130,19 +123,13 @@ export function NewsroomOpsOverview({
                       <p className="truncate text-sm font-medium text-foreground">{assignment.title}</p>
                       <p className="text-xs text-muted-foreground">Assignment · {assignment.assignmentTypeKey}</p>
                     </div>
-                    <Badge className="mt-0.5 shrink-0" variant="secondary">{assignment.status}</Badge>
+                    <span className="mt-0.5 shrink-0 rounded-full bg-[var(--feed-control)] px-2 py-0.5 text-xs font-medium">{assignment.status}</span>
                   </Link>
                 );
               })}
             </div>
-          ) : (
-            <Card>
-              <CardContent className="p-4 text-sm text-muted-foreground">
-                No pending references or open assignments. Check those destinations for other work.
-              </CardContent>
-            </Card>
-          )}
-        </section>
+          </section>
+        ) : null}
 
         {desks.length ? (
           <section aria-label="Sections" className="space-y-3" data-newsroom-ops-desks>
@@ -156,7 +143,7 @@ export function NewsroomOpsOverview({
                   href={buildNewsroomSectionHref(section.id, demo)}
                   key={section.id}
                 >
-                  <Card className="h-full transition-colors hover:border-primary/30">
+                  <Card className="h-full rounded-[20px] border-0 bg-[var(--feed-card)] shadow-none ring-0 transition-colors hover:bg-[var(--feed-control)]">
                     <CardHeader className="p-4">
                       <CardTitle className="text-base font-semibold">{section.title}</CardTitle>
                       <CardDescription className="uppercase tracking-wide text-[0.65rem]">
@@ -176,7 +163,7 @@ export function NewsroomOpsOverview({
                   href={buildNewsroomSectionHref(section.id, demo)}
                   key={section.id}
                 >
-                  <Card className="h-full transition-colors hover:border-primary/30">
+                  <Card className="h-full rounded-[20px] border-0 bg-[var(--feed-card)] shadow-none ring-0 transition-colors hover:bg-[var(--feed-control)]">
                     <CardHeader className="p-4">
                       <CardTitle className="text-base font-semibold">{section.title}</CardTitle>
                       <CardDescription className="uppercase tracking-wide text-[0.65rem]">
@@ -189,6 +176,34 @@ export function NewsroomOpsOverview({
             </div> : null}
           </section>
         ) : null}
+    </div>
+  );
+
+  return (
+    <div
+      className="h-full font-sans"
+      data-news-desk-section="overview"
+      data-newsroom-ops-home="true"
+    >
+      <div className="h-full" data-newsroom-overview-feeds>
+        <div className="h-full" data-newsroom-overview-notifications>
+          <NotificationCenter
+            below={below}
+            actorLabel={actorLabel}
+            decisions={shownDecisions}
+            demo={demo}
+            fixture={notificationFixture}
+            humanCuratedReferenceLineageIds={humanCuratedReferenceLineageIds}
+            onCorrectCapture={onCorrectCapture}
+            onRateReference={rateReference}
+            referenceAttachments={referenceAttachments}
+            predictionLoading={predictionState === "loading"}
+            previews={previews}
+            referenceDisabledReason={rateDisabled}
+            references={canonicalReferences}
+            referencesLoading={loading && !canonicalReferences.length}
+          />
+        </div>
       </div>
     </div>
   );

package/components/newsroom-ops-shell.tsx

@@ -1,6 +1,5 @@
 "use client";
 
-import { SearchIcon } from "lucide-react";
 import { Button } from "./ui/button";
 import { Separator } from "./ui/separator";
 import { cn } from "../lib/utils";
@@ -143,6 +142,8 @@ export function NewsroomOpsShell({ activeTab, appTitle, backHref = "/", backLabe
     media.addEventListener("change", change);
     return () => { document.removeEventListener("focusin", remember); media.removeEventListener("change", change); cancelAnimationFrame(frame); };
   }, []);
+  // The mobile top bar prefers the brand's compact mark, then scales the full logo; the serif title is the no-logo fallback.
+  const MastheadLogo = SITE_BRAND.components?.NewsroomLogoCompact ?? SITE_BRAND.components?.NewsroomLogo;
   const activePath = browserPathToInternalNewsroomPath(pathname ?? "/newsroom");
   const sidebarToggleLabel = collapsed ? "Expand sidebar" : "Collapse sidebar";
   const sidebarToggle = <button type="button" className="organizer-toggle" title={sidebarToggleLabel}
@@ -162,10 +163,10 @@ export function NewsroomOpsShell({ activeTab, appTitle, backHref = "/", backLabe
     <div className="organizer-workspace">
       <header className="organizer-topbar" data-newsroom-ops-topbar>
         {showNavigation && collapsed && sidebarToggle}
-        <Link className="organizer-masthead" href={backHref} title={backLabel}>{appTitle}</Link>
+        <Link className="organizer-masthead" href={backHref} title={backLabel}>{MastheadLogo ? <MastheadLogo className="organizer-masthead-logo" /> : 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}
@@ -177,27 +178,6 @@ export function NewsroomOpsShell({ activeTab, appTitle, backHref = "/", backLabe
   </div>;
 }
 
-export function NewsroomOpsSearchButton({
-  disabled,
-  onPress,
-}: {
-  disabled?: boolean;
-  onPress?: () => void;
-}) {
-  return (
-    <Button
-      aria-label="Search knowledge base"
-      disabled={disabled}
-      onClick={onPress}
-      size="icon-sm"
-      type="button"
-      variant="outline"
-    >
-      <SearchIcon className="size-4" />
-    </Button>
-  );
-}
-
 export function NewsroomOpsStatusBanner({
   children,
   tone = "info",
@@ -208,10 +188,10 @@ export function NewsroomOpsStatusBanner({
   return (
     <div
       className={cn(
-        "mb-4 rounded-xl border px-3 py-2 text-sm",
-        tone === "error" && "border-destructive/30 bg-destructive/10 text-destructive",
-        tone === "ok" && "border-primary/20 bg-primary/10 text-foreground",
-        tone === "info" && "border-border bg-muted/40 text-foreground",
+        // A success is announced to screen readers and never drawn: it would push the page down. Errors and notes are flat fills, no outlines.
+        tone === "ok" ? "sr-only" : "mb-4 rounded-lg px-3 py-2 text-sm",
+        tone === "error" && "bg-destructive/10 text-destructive",
+        tone === "info" && "bg-muted/60 text-foreground",
       )}
       role="status"
     >