@anthusai/papyrus 1.0.0-next.9 → 1.0.0

package/components/newsroom-board-view.tsx

@@ -0,0 +1,99 @@
+"use client";
+
+import { useEffect, useMemo, useRef, useState } from "react";
+import Link from "next/link";
+import { IssueCollection, IssueDetailPanel, IssueTypeFilter, issueTypeFromFilter } from "@kanbus/ui";
+import "@kanbus/ui/styles/kanban.css";
+import "./newsroom-newsprint-board.css";
+import { canReadNewsroomBoard, newsroomBoardConfig, projectNewsroomBoard, type NativeBoardIssue } from "../lib/newsroom-board";
+import { getContentItemName, SITE_BRAND } from "../lib/site-brand";
+import { getNewsroomNavHref } from "../lib/newsroom-nav";
+import { loadNewsroomAssignmentPage, loadNewsroomContentItemVersions, loadNewsroomReferencePage } from "./news-desk-taxonomy-client";
+import { useOptionalNewsDeskClient } from "./news-desk-client-provider";
+import { NewsDeskAccessGate } from "./newsroom-access-gate";
+import { NewsroomOpsShell, NewsroomOpsStatusBanner } from "./newsroom-ops-shell";
+import { useResolvedPapyrusTheme } from "./use-resolved-papyrus-theme";
+import { readLocalReaderSettings, subscribeReaderSettingsChanges } from "./reader-settings";
+
+const STATIC_MOTION = { mode: "static" } as const;
+
+/** Read-only shared board over authenticated CMS records; existing workspaces own every mutation. */
+export function NewsroomBoardView() {
+  const session = useOptionalNewsDeskClient();
+  const allowed = canReadNewsroomBoard(session?.shell.phase);
+  const theme = useResolvedPapyrusTheme();
+  const [lowMotion, setLowMotion] = useState(false);
+  const [issues, setIssues] = useState<NativeBoardIssue[]>([]);
+  const [filter, setFilter] = useState("all");
+  const [view, setView] = useState<"board" | "list">("board");
+  const [revision, setRevision] = useState(0);
+  const [selected, setSelected] = useState<string | null>(null);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+  const [tokens, setTokens] = useState<{ reference?: string | null; assignment?: string | null }>({});
+  const generation = useRef(0);
+  const busy = useRef(false);
+  useEffect(() => {
+    setLowMotion(readLocalReaderSettings().motion === "low");
+    return subscribeReaderSettingsChanges(settings => setLowMotion(settings.motion === "low"));
+  }, []);
+  useEffect(() => {
+    const request = ++generation.current;
+    busy.current = false;
+    setIssues([]); setSelected(null); setTokens({}); setError(null);
+    if (!allowed) { setLoading(false); return; }
+    setLoading(true); busy.current = true;
+    Promise.all([
+      loadNewsroomContentItemVersions(),
+      loadNewsroomReferencePage({ limit: 50 }),
+      loadNewsroomAssignmentPage({ limit: 50 }),
+    ]).then(([contentItemVersions, references, assignments]) => {
+      if (generation.current !== request) return;
+      setIssues(projectNewsroomBoard({ contentItemVersions, references: references.items, assignments: assignments.items }));
+      setTokens({ reference: references.nextToken, assignment: assignments.nextToken });
+    }).catch((reason: unknown) => {
+      if (generation.current === request) setError(reason instanceof Error ? reason.message : "Could not load newsroom records.");
+    }).finally(() => { if (generation.current === request) { setLoading(false); busy.current = false; } });
+    return () => { generation.current = request + 1; };
+  }, [allowed, revision]);
+  async function loadMore(kind: "reference" | "assignment") {
+    if (!allowed || busy.current || !tokens[kind]) return;
+    const request = generation.current;
+    busy.current = true; setLoading(true); setError(null);
+    try {
+      const added = kind === "reference"
+        ? await loadNewsroomReferencePage({ limit: 50, nextToken: tokens.reference }).then(page => ({ issues: projectNewsroomBoard({ references: page.items }), token: page.nextToken }))
+        : await loadNewsroomAssignmentPage({ limit: 50, nextToken: tokens.assignment }).then(page => ({ issues: projectNewsroomBoard({ assignments: page.items }), token: page.nextToken }));
+      if (generation.current !== request) return;
+      setIssues(current => [...new Map([...current, ...added.issues].map(issue => [issue.id, issue])).values()]);
+      setTokens(current => ({ ...current, [kind]: added.token }));
+    } catch (reason) {
+      if (generation.current === request) setError(reason instanceof Error ? reason.message : "Could not load more records.");
+    } finally { if (generation.current === request) { setLoading(false); busy.current = false; } }
+  }
+  const config = useMemo(() => newsroomBoardConfig(issues), [issues]);
+  const issue = issues.find(item => item.id === selected);
+  if (!allowed) return <NewsDeskAccessGate shell={session?.shell ?? null} />;
+  return <NewsroomOpsShell activeTab="work" appTitle={SITE_BRAND.appTitle} backLabel={SITE_BRAND.backToHomeLabel} pageTitle="Board">
+    <div className="organizer-native-board papyrus-newsprint-board" data-color-mode={theme}>
+      <div className="organizer-board-toolbar">
+        <IssueTypeFilter config={config} value={filter} onChange={value => { setFilter(value); setSelected(null); }} name="Record type" />
+        <div role="group" aria-label="Record presentation"><button type="button" aria-pressed={view === "board"} onClick={() => setView("board")}>Board</button><button type="button" aria-pressed={view === "list"} onClick={() => setView("list")}>List</button><button type="button" disabled={loading} onClick={() => setRevision(current => current + 1)}>Refresh records</button></div>
+      </div>
+      <p className="organizer-board-note">{`Each ${getContentItemName().singular.toLowerCase()} appears once, in the column for its stage. Open a record to use its existing editor or workflow controls.`}</p>
+      {error && <NewsroomOpsStatusBanner tone="error">{error}</NewsroomOpsStatusBanner>}
+      <p role="status" className="organizer-board-note">{loading ? "Loading records…" : `${issues.length} records loaded. References and assignments load in pages.`}</p>
+      <div className="organizer-board-body" data-detail-open={Boolean(issue)}>
+        <IssueCollection issues={issues} config={config} query={{ type: issueTypeFromFilter(filter) }} view={view}
+          motion={lowMotion ? STATIC_MOTION : undefined}
+          columnStateKey={`papyrus.cms.columns.v1.${SITE_BRAND.id}`} initialScroll="start"
+          selectedIssueId={selected} detailOpen={Boolean(issue)} onSelectIssue={item => setSelected(item.id)} ariaLabel="Newsroom records"
+          emptyMessage={loading ? "Loading records…" : error ? "Records could not be loaded." : "No records in this selection."} />
+        {issue && <IssueDetailPanel issue={issue} onClose={() => setSelected(null)} fields={[{ label: "CMS record ID", value: issue.nativeId }, { label: "Status", value: issue.nativeStatus }]}>
+          <Link href={getNewsroomNavHref(issue.href)}>Open {issue.type}</Link>
+        </IssueDetailPanel>}
+      </div>
+      <div className="organizer-board-pages">{tokens.reference && <button disabled={loading} type="button" onClick={() => void loadMore("reference")}>Load more references</button>}{tokens.assignment && <button disabled={loading} type="button" onClick={() => void loadMore("assignment")}>Load more assignments</button>}</div>
+    </div>
+  </NewsroomOpsShell>;
+}

package/components/newsroom-client-shell.tsx

@@ -0,0 +1,12 @@
+import { NewsDeskClientProvider } from "./news-desk-client-provider";
+import { resolveDevSandboxEditorAuth } from "../lib/dev-sandbox-editor-auth";
+
+export function NewsroomClientShell({ children }: Readonly<{ children: React.ReactNode }>) {
+  const devSandboxEditorAuth = resolveDevSandboxEditorAuth();
+
+  return (
+    <NewsDeskClientProvider devSandboxEditorAuth={devSandboxEditorAuth}>
+      {children}
+    </NewsDeskClientProvider>
+  );
+}

package/components/newsroom-curation-provider.tsx

@@ -0,0 +1,17 @@
+'use client';
+
+import {createContext,useContext,useMemo,useRef,type ReactNode} from 'react';
+import {createCurationSession,requestCuration,type CurationBootstrap,type CurationRequest,type CurationSession} from '../lib/curation-client';
+import type {PublicationScope} from '../lib/publication-cyclotron';
+
+const Context=createContext<CurationSession|null>(null);
+
+/** Host opt-in. Absence preserves the released CMS and performs no new reads. */
+export function NewsroomCurationProvider({bootstrap,request=requestCuration,children}:{bootstrap:CurationBootstrap|null;request?:CurationRequest;children:ReactNode}){
+  const selected=useRef<PublicationScope|null>(bootstrap?.scope??null);
+  selected.current=bootstrap?.scope??null;
+  const session=useMemo(()=>bootstrap?createCurationSession(bootstrap,request,()=>selected.current):null,[bootstrap,request]);
+  return <Context.Provider value={session}>{children}</Context.Provider>;
+}
+
+export function useNewsroomCuration(){return useContext(Context);}

package/components/newsroom-fonts/playfair-display-OFL.txt

@@ -0,0 +1,93 @@
+Copyright 2017 The Playfair Display Project Authors (https://github.com/clauseggers/Playfair-Display), with Reserved Font Name "Playfair Display"
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded, 
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.

package/components/newsroom-fonts/plus-jakarta-sans-OFL.txt

@@ -0,0 +1,93 @@
+Copyright 2020 The Plus Jakarta Sans Project Authors (https://github.com/tokotype/PlusJakartaSans)
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded, 
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.

package/components/newsroom-newsprint-board.css

@@ -0,0 +1,48 @@
+.papyrus-newsprint-board {
+  --background: var(--org-paper);
+  --card: var(--org-paper);
+  --frame: var(--org-paper);
+  --column: var(--org-paper);
+  --border: var(--org-line);
+  --text-foreground: var(--org-ink);
+  --text-muted: var(--org-muted);
+  --text-selected: var(--org-ink);
+  --font-body: Newsroom UI, system-ui, sans-serif;
+  --kb-column-width: 245px;
+  --kb-column-radius: 0;
+  --kb-card-radius: 0;
+  --kb-card-border-width: 0;
+  --kb-card-shadow: none;
+  --kb-card-selected-shadow: none;
+  --kb-board-gap: 18px;
+  color: var(--org-ink);
+  background: transparent;
+}
+.papyrus-newsprint-board .kb-grid { height: 100%; min-height: 0; scrollbar-width: thin; }
+.papyrus-newsprint-board .kb-column { border-left: 1px solid var(--org-line); padding-left: 10px; }
+.papyrus-newsprint-board .kb-column-header {
+  border-bottom: 2px solid var(--org-ink);
+  padding: 5px 0;
+  font: 700 12px Newsroom Display, Georgia, serif;
+  text-transform: uppercase;
+  letter-spacing: .6px;
+  min-height: 32px;
+}
+.papyrus-newsprint-board .issue-card {
+  --issue-accent: var(--org-paper) !important;
+  --issue-accent-muted: var(--muted) !important;
+  --issue-accent-foreground: var(--org-ink) !important;
+  --issue-priority-bg: var(--org-paper) !important;
+  background: transparent !important;
+  border-radius: 0;
+  border-bottom: 1px solid var(--org-line) !important;
+  box-shadow: none !important;
+}
+.papyrus-newsprint-board .issue-accent-bar { border-bottom: 1px solid var(--org-line); background: var(--org-paper) !important; color: var(--org-ink) !important; }
+.papyrus-newsprint-board .issue-accent-id { font: 400 9px Newsroom UI, system-ui, sans-serif; letter-spacing: .8px; white-space: nowrap; color: var(--org-ink) !important; }
+.papyrus-newsprint-board .issue-accent-priority { border-radius: 0; color: var(--org-muted) !important; background: transparent !important; font-size: 8px; }
+.papyrus-newsprint-board .issue-card h3 { font: 700 19px/1.2 Newsroom Display, Georgia, serif !important; letter-spacing: -.2px; }
+.papyrus-newsprint-board .issue-card[data-selected=true] { outline: 2px solid var(--org-ink); outline-offset: -2px; }
+.papyrus-newsprint-board .issue-card[data-selected=true] h3 { color: var(--org-ink) !important; }
+.papyrus-newsprint-board .kb-issue-detail { background: var(--org-paper); border: 1px solid var(--org-line); border-radius: 0; box-shadow: none; }
+.papyrus-newsprint-board .kb-issue-detail h2 { font: 700 28px/1.2 Newsroom Display, Georgia, serif; border-bottom: 3px double var(--org-ink); padding-bottom: 12px; }

package/components/newsroom-ops-overview.tsx

@@ -3,8 +3,13 @@
 import {
   BookOpenIcon,
   ClipboardListIcon,
+  FileTextIcon,
   LayersIcon,
+  LightbulbIcon,
   MessageSquareIcon,
+  NetworkIcon,
+  SearchIcon,
+  SettingsIcon,
 } from "lucide-react";
 import Link from "next/link";
 import { usePathname } from "next/navigation";
@@ -12,7 +17,7 @@ import { useMemo } from "react";
 import { Badge } from "./ui/badge";
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "./ui/card";
 import type { AssignmentRecord, MessageRecord, NewsroomSectionRecord, ReferenceRecord } from "../lib/category-repository";
-import { getNewsroomNavHref } from "../lib/newsroom-nav";
+import { getNewsroomNavHref, NEWSROOM_OPS_NAV, type NewsroomNavTabId } from "../lib/newsroom-nav";
 import {
   countReferencesByStatus,
   filterReferencesByStatus,
@@ -37,15 +42,28 @@ type NewsroomOpsOverviewProps = {
   references: ReferenceRecord[];
 };
 
-type DestinationKey = "references" | "assignments" | "messages" | "topics";
+type DestinationKey = Exclude<NewsroomNavTabId, "overview" | "desks">;
 
-const DESTINATION_META: Record<DestinationKey, { label: string; detail: string; href: string; icon: typeof BookOpenIcon }> = {
-  references: { label: "References", detail: "Source intake", href: "/newsroom/references", icon: BookOpenIcon },
-  assignments: { label: "Assignments", detail: "Work queue", href: "/newsroom/assignments", icon: ClipboardListIcon },
-  messages: { label: "Messages", detail: "Team threads", href: "/newsroom/messages", icon: MessageSquareIcon },
-  topics: { label: "Topics", detail: "Taxonomy", href: "/newsroom/topics", icon: LayersIcon },
+const DESTINATION_ICONS: Record<DestinationKey, typeof BookOpenIcon> = {
+  articles: FileTextIcon,
+  assignments: ClipboardListIcon,
+  references: BookOpenIcon,
+  messages: MessageSquareIcon,
+  insights: LightbulbIcon,
+  topics: LayersIcon,
+  concepts: NetworkIcon,
+  administration: SettingsIcon,
+  search: SearchIcon,
 };
 
+const DESTINATIONS = NEWSROOM_OPS_NAV.filter((item) => item.id !== "overview").map((item) => ({
+  key: item.id as DestinationKey,
+  label: item.label,
+  detail: item.detail,
+  href: item.href,
+  icon: DESTINATION_ICONS[item.id as DestinationKey],
+}));
+
 function openAssignmentCount(assignments: AssignmentRecord[]): number {
   return assignments.filter((assignment) => {
     const status = assignment.status?.trim().toLowerCase() ?? "";
@@ -85,11 +103,10 @@ export function NewsroomOpsOverview({
     [newsroomSections],
   );
 
-  const destinationCounts: Record<DestinationKey, number | null> = {
+  const destinationCounts: Partial<Record<DestinationKey, number | null>> = {
     references: referenceCounts.pending ?? 0,
     assignments: openAssignmentCount(assignments),
     messages: recentMessageCount(messages),
-    topics: null,
   };
 
   return (
@@ -102,8 +119,8 @@ export function NewsroomOpsOverview({
         <section aria-label="Destinations" className="space-y-3">
           <h2 className="text-sm font-medium text-muted-foreground">Go to</h2>
           <div className="grid grid-cols-2 gap-3 sm:grid-cols-4">
-            {(Object.keys(DESTINATION_META) as DestinationKey[]).map((key) => {
-              const meta = DESTINATION_META[key];
+            {DESTINATIONS.map((meta) => {
+              const key = meta.key;
               const Icon = meta.icon;
               const count = destinationCounts[key];
               const href = getNewsroomNavHref(meta.href, demo);

package/components/newsroom-ops-shell.tsx

@@ -34,6 +34,8 @@ import {
   NEWSROOM_SIDEBAR_NAV_INACTIVE,
 } from "../lib/newsroom-list-selection";
 import { cn } from "../lib/utils";
+import { SITE_BRAND } from "../lib/site-brand";
+import { NewsroomOrganizerShell } from "./newsroom-organizer-shell";
 
 export type NewsroomNavCount = {
   count: number | null;
@@ -41,7 +43,7 @@ export type NewsroomNavCount = {
   visible?: boolean;
 };
 
-type NewsroomOpsShellProps = {
+export type NewsroomOpsShellProps = {
   activeTab: NewsroomNavTabId | string;
   appTitle: string;
   backHref?: string;
@@ -136,6 +138,10 @@ export function NewsroomOpsShell({
   const resolvedActiveTab = activeTab === "desks" ? "topics" : activeTab;
   const mobilePrimary = useMemo(() => NEWSROOM_MOBILE_PRIMARY_NAV, []);
 
+  if (SITE_BRAND.newsroomLayout === "organizer") return <NewsroomOrganizerShell activeTab={activeTab} appTitle={appTitle}
+    backHref={backHref} backLabel={backLabel} demo={demo} headerActions={headerActions} pageTitle={pageTitle}
+    showNavigation={showNavigation} tabCounts={tabCounts}>{children}</NewsroomOrganizerShell>;
+
   return (
     <div
       className="flex h-dvh max-h-dvh flex-col overflow-hidden bg-background text-foreground"

package/components/newsroom-organizer-shell.tsx

@@ -0,0 +1,130 @@
+"use client";
+
+import { useEffect, useId, useState } from "react";
+import Link from "next/link";
+import { usePathname } from "next/navigation";
+import { BookOpen, ClipboardList, LayoutDashboard, Menu, MessagesSquare, PanelLeftClose, PanelLeftOpen, Settings, UserRound, LogIn, LogOut } from "lucide-react";
+import { ORGANIZER_NAV_GROUPS, ORGANIZER_PRIMARY_NAV, ORGANIZER_SETTINGS_DESTINATION } from "../lib/newsroom-organizer-nav";
+import { browserPathToInternalNewsroomPath } from "../lib/newsroom-base-path";
+import { getNewsroomNavHref } from "../lib/newsroom-nav";
+import { SITE_BRAND } from "../lib/site-brand";
+import { useOptionalNewsDeskClient } from "./news-desk-client-provider";
+import { ReaderAuthControl } from "./reader-auth-control";
+import { Sheet, SheetContent, SheetHeader, SheetTitle, SheetDescription, SheetTrigger } from "./ui/sheet";
+import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuItem, DropdownMenuSeparator } from "./ui/dropdown-menu";
+import type { NewsroomOpsShellProps } from "./newsroom-ops-shell";
+import "./newsroom-organizer.css";
+
+const ICONS = { overview: LayoutDashboard, board: ClipboardList, references: BookOpen, messages: MessagesSquare };
+
+/** Navigation is a presentation layer; existing route and server authorization still own access. */
+function Navigation({ activePath, demo, admin, surface, onNavigate }: { activePath: string; demo: boolean; admin: boolean; surface: string; onNavigate?: () => void }) {
+  const id = useId();
+  const all = ORGANIZER_NAV_GROUPS.flatMap(group => group.items);
+  const active = all.filter(item => activePath === item.path || (item.path !== "/newsroom" && activePath.startsWith(item.path + "/"))).sort((a, b) => b.path.length - a.path.length)[0]?.key;
+  return <nav className="organizer-destinations" aria-label={surface === "sidebar" ? "Newsroom" : "All workspaces"}>
+    {ORGANIZER_NAV_GROUPS.map((group, index) => <section key={group.title} aria-labelledby={`${id}-${index}`}>
+      <h3 id={`${id}-${index}`}>{group.title}</h3>
+      {group.items.filter(item => item.access !== "admin" || admin).map(item => <Link key={item.key}
+        href={getNewsroomNavHref(item.path, demo)} onClick={onNavigate} aria-label={item.label}
+        aria-current={active === item.key ? "page" : undefined} aria-describedby={`${id}-${item.key}`}
+        data-news-desk-tab={item.key}>
+        <strong>{item.label}</strong><small id={`${id}-${item.key}`}>{item.description}</small>
+      </Link>)}
+    </section>)}
+  </nav>;
+}
+
+function Account({ placement }: { placement: "sidebar" | "header" }) {
+  const session = useOptionalNewsDeskClient();
+  const auth = session?.shell.auth ?? { status: "loading" as const, label: "Checking sign-in" };
+  const [open, setOpen] = useState(false);
+  useEffect(() => {
+    const media = matchMedia("(max-width: 900px)");
+    const close = () => setOpen(false);
+    media.addEventListener("change", close);
+    return () => media.removeEventListener("change", close);
+  }, []);
+  return <DropdownMenu open={open} onOpenChange={setOpen}>
+    <DropdownMenuTrigger className={`organizer-account organizer-account-${placement}`} aria-label="Account menu" title="Account menu">
+      <UserRound size={18} aria-hidden="true" /><span><strong>{auth.label}</strong><small>{auth.status === "signedIn" ? "Account & preferences" : auth.status === "signedOut" ? "Not signed in" : "Checking session"}</small></span>
+    </DropdownMenuTrigger>
+    <DropdownMenuContent className="organizer-account-popup" side={placement === "sidebar" ? "top" : "bottom"} align="end">
+      <DropdownMenuGroup>
+        <DropdownMenuLabel>{auth.label}</DropdownMenuLabel><DropdownMenuSeparator />
+        <DropdownMenuItem render={<Link href={getNewsroomNavHref(ORGANIZER_SETTINGS_DESTINATION.path)} />}><Settings aria-hidden="true" />{ORGANIZER_SETTINGS_DESTINATION.label}</DropdownMenuItem>
+        <ReaderAuthControl authState={auth} renderAction={({ disabled, onClick, signedIn }) => <DropdownMenuItem disabled={disabled} closeOnClick={false} onClick={onClick}>
+          {signedIn ? <LogOut aria-hidden="true" /> : <LogIn aria-hidden="true" />}{signedIn ? "Sign out" : "Sign in"}
+        </DropdownMenuItem>} />
+      </DropdownMenuGroup>
+    </DropdownMenuContent>
+  </DropdownMenu>;
+}
+
+export function NewsroomOrganizerShell({ activeTab, appTitle, backHref = "/", backLabel, children, demo = false, headerActions, pageTitle, showNavigation = true }: NewsroomOpsShellProps) {
+  const pathname = usePathname();
+  const session = useOptionalNewsDeskClient();
+  const admin = demo || session?.shell.dashboard?.canManageUsers === true;
+  const [menuOpen, setMenuOpen] = useState(false);
+  const [collapsed, setCollapsed] = useState(false);
+  const [loadedPreference, setLoadedPreference] = useState(false);
+  const preferenceKey = `papyrus.cms.sidebar.v1.${SITE_BRAND.id}`;
+  useEffect(() => {
+    try { setCollapsed(localStorage.getItem(preferenceKey) === "true"); } catch { /* Optional browser preference. */ }
+    setLoadedPreference(true);
+  }, [preferenceKey]);
+  useEffect(() => { if (loadedPreference) try { localStorage.setItem(preferenceKey, String(collapsed)); } catch { /* Controls still work without storage. */ } }, [collapsed, loadedPreference, preferenceKey]);
+  useEffect(() => { setMenuOpen(false); }, [pathname]);
+  useEffect(() => {
+    const media = matchMedia("(max-width: 900px)");
+    let previousFocus: Element | null = null;
+    let frame = 0;
+    const remember = () => { if (document.activeElement !== document.body) previousFocus = document.activeElement; };
+    const change = () => {
+      const active = document.activeElement === document.body ? previousFocus : document.activeElement;
+      if (!(active instanceof HTMLElement)) return;
+      if (!media.matches) setMenuOpen(false);
+      const selector = active.closest(".organizer-account, .organizer-account-popup") ? ".organizer-account"
+        : media.matches && active.closest(".organizer-sidebar, .organizer-toggle") ? ".organizer-more"
+        : !media.matches && active.closest(".organizer-bottom-nav, .organizer-menu") ? ".organizer-toggle" : null;
+      if (!selector) return;
+      cancelAnimationFrame(frame);
+      frame = requestAnimationFrame(() => {
+        if (document.activeElement === active || document.activeElement === document.body || !(document.activeElement as HTMLElement)?.getClientRects().length)
+          Array.from(document.querySelectorAll<HTMLElement>(selector)).find(element => element.getClientRects().length)?.focus();
+      });
+    };
+    document.addEventListener("focusin", remember);
+    media.addEventListener("change", change);
+    return () => { document.removeEventListener("focusin", remember); media.removeEventListener("change", change); cancelAnimationFrame(frame); };
+  }, []);
+  const activePath = browserPathToInternalNewsroomPath(pathname ?? "/newsroom");
+  return <div className="newsroom-organizer" data-news-desk data-newsroom-ops-shell="true" data-newsroom-chrome="organizer" data-sidebar-collapsed={collapsed || !showNavigation ? "true" : "false"}>
+    {showNavigation && <aside className="organizer-sidebar" hidden={collapsed} id="organizer-sidebar">
+      <Link className="organizer-brand" href={getNewsroomNavHref("/newsroom", demo)}>{appTitle}<small>The newsroom</small></Link>
+      <Navigation activePath={activePath} demo={demo} admin={admin} surface="sidebar" />
+      <Account placement="sidebar" />
+    </aside>}
+    <div className="organizer-workspace">
+      <header className="organizer-topbar" data-newsroom-ops-topbar>
+        {showNavigation && <button type="button" className="organizer-toggle" title={collapsed ? "Expand sidebar" : "Collapse sidebar"}
+          aria-label={collapsed ? "Expand sidebar" : "Collapse sidebar"} aria-expanded={!collapsed} aria-controls="organizer-sidebar" onClick={() => setCollapsed(value => !value)}>
+          {collapsed ? <PanelLeftOpen size={16} aria-hidden="true" /> : <PanelLeftClose size={16} aria-hidden="true" />}<span>{collapsed ? "Expand sidebar" : "Collapse sidebar"}</span>
+        </button>}
+        <Link className="organizer-masthead" href={backHref} title={backLabel}>{appTitle}</Link>
+        <h1 data-newsroom-ops-title>{pageTitle}</h1><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>
+    </div>
+    {showNavigation && <nav className="organizer-bottom-nav" aria-label="Primary newsroom navigation"><ul>
+      {ORGANIZER_PRIMARY_NAV.map(item => { const Icon = ICONS[item.key as keyof typeof ICONS]; return <li key={item.key}><Link
+        href={getNewsroomNavHref(item.path, demo)} title={item.description} aria-label={item.label} aria-current={activeTab === item.key || activeTab === "work" && item.key === "board" ? "page" : undefined}>
+        <Icon size={18} aria-hidden="true" /><span>{item.label}</span></Link></li>; })}
+      <li><Sheet open={menuOpen} onOpenChange={setMenuOpen}><SheetTrigger className="organizer-more" aria-label="More"><Menu size={18} aria-hidden="true" /><span>More</span></SheetTrigger>
+        <SheetContent side="bottom" className="organizer-menu"><SheetHeader><SheetTitle>Newsroom</SheetTitle><SheetDescription>Workspaces and administration</SheetDescription></SheetHeader>
+          <Navigation activePath={activePath} demo={demo} admin={admin} surface="menu" onNavigate={() => setMenuOpen(false)} />
+        </SheetContent>
+      </Sheet></li>
+    </ul></nav>}
+  </div>;
+}