@anthusai/papyrus 1.19.1 → 2.0.0-next.2

package/components/newsroom-ops-shell.tsx

@@ -1,41 +1,24 @@
 "use client";
 
-import {
-  BookOpenIcon,
-  ClipboardListIcon,
-  FileTextIcon,
-  LayoutGridIcon,
-  MenuIcon,
-  SearchIcon,
-  TagsIcon,
-} from "lucide-react";
-import Link from "next/link";
-import type { ReactNode } from "react";
-import { useMemo, useState } from "react";
-import { Badge } from "./ui/badge";
-import { Button, buttonVariants } from "./ui/button";
-import { ScrollArea } from "./ui/scroll-area";
+import { SearchIcon } from "lucide-react";
+import { Button } from "./ui/button";
 import { Separator } from "./ui/separator";
-import {
-  Sheet,
-  SheetContent,
-  SheetHeader,
-  SheetTitle,
-  SheetTrigger,
-} from "./ui/sheet";
-import {
-  getNewsroomNavHref,
-  NEWSROOM_MOBILE_PRIMARY_NAV,
-  NEWSROOM_OPS_NAV,
-  type NewsroomNavTabId,
-} from "../lib/newsroom-nav";
-import {
-  NEWSROOM_SIDEBAR_NAV_ACTIVE,
-  NEWSROOM_SIDEBAR_NAV_INACTIVE,
-} from "../lib/newsroom-list-selection";
 import { cn } from "../lib/utils";
+
+import { useEffect, useId, useState, type ReactNode } from "react";
+import Link from "next/link";
+import { usePathname, useRouter, useSearchParams } from "next/navigation";
+import { BookOpen, ClipboardList, Menu, Search, 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 { NewsroomOrganizerShell } from "./newsroom-organizer-shell";
+import { useOptionalNewsDeskClient } from "./news-desk-client-provider";
+import { ReaderAuthControl } from "./reader-auth-control";
+import { ProspectusAccountChooser, useProspectusAccountSummary } from "./prospectus-account-chooser";
+import { Sheet, SheetContent, SheetHeader, SheetTitle, SheetDescription, SheetTrigger } from "./ui/sheet";
+import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuItem, DropdownMenuSeparator } from "./ui/dropdown-menu";
+import "./newsroom-organizer.css";
 
 export type NewsroomNavCount = {
   count: number | null;
@@ -44,7 +27,7 @@ export type NewsroomNavCount = {
 };
 
 export type NewsroomOpsShellProps = {
-  activeTab: NewsroomNavTabId | string;
+  activeTab: string;
   appTitle: string;
   backHref?: string;
   backLabel: string;
@@ -56,215 +39,140 @@ export type NewsroomOpsShellProps = {
   tabCounts?: Partial<Record<string, NewsroomNavCount>>;
 };
 
-const MOBILE_TAB_ICONS: Record<string, typeof LayoutGridIcon> = {
-  overview: LayoutGridIcon,
-  articles: FileTextIcon,
-  assignments: ClipboardListIcon,
-  references: BookOpenIcon,
-  topics: TagsIcon,
-};
-
-function formatCountLabel(count: number | null, missing?: boolean): string {
-  if (missing) return "?";
-  if (count == null) return "…";
-  if (count >= 1000) return `${Math.round(count / 100) / 10}k`;
-  return String(count);
+/** The standard place to search the knowledge base; the Search page is the results page. */
+function OrganizerSearch({ demo }: { demo: boolean }) {
+  const router = useRouter();
+  const searchParams = useSearchParams();
+  const [text, setText] = useState(searchParams.get("q") ?? "");
+  return <form className="organizer-search" role="search" onSubmit={event => {
+    event.preventDefault();
+    const query = text.trim();
+    if (query) router.push(getNewsroomNavHref(`/newsroom/search?q=${encodeURIComponent(query)}`, demo));
+  }}>
+    <Search size={14} aria-hidden="true" />
+    <input aria-label="Search the knowledge base" data-newsroom-search type="search" onChange={event => setText(event.target.value)} placeholder="Search" value={text} />
+  </form>;
 }
 
-function NavCountBadge({
-  countState,
-}: {
-  countState?: NewsroomNavCount;
-}) {
-  if (!countState || countState.visible === false) return null;
-  return (
-    <Badge
-      className="newsroom-nav-count min-w-7 px-1.5"
-      data-newsroom-nav-count
-      variant={countState.missing ? "outline" : "secondary"}
-    >
-      {formatCountLabel(countState.count, countState.missing)}
-    </Badge>
-  );
+const ICONS = { articles: 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 => [item.path, ...(item.alsoActiveOnPaths ?? [])].some(candidate => activePath === candidate || (candidate !== "/newsroom" && activePath.startsWith(candidate + "/")))).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 SidebarNavLink({
-  active,
-  countState,
-  demo,
-  item,
-  onNavigate,
-}: {
-  active: boolean;
-  countState?: NewsroomNavCount;
-  demo?: boolean;
-  item: (typeof NEWSROOM_OPS_NAV)[number];
-  onNavigate?: () => void;
-}) {
-  return (
-    <Link
-      aria-current={active ? "page" : undefined}
-      className={cn(
-        buttonVariants({ variant: "ghost", size: "default" }),
-        "h-auto min-h-11 w-full justify-start gap-3 px-3 py-2.5 text-left font-normal",
-        active ? NEWSROOM_SIDEBAR_NAV_ACTIVE : NEWSROOM_SIDEBAR_NAV_INACTIVE,
-      )}
-      data-news-desk-tab={item.id}
-      href={getNewsroomNavHref(item.href, demo)}
-      onClick={onNavigate}
-    >
-      <NavCountBadge countState={countState} />
-      <span className="min-w-0 flex-1">
-        <span className="block text-sm font-medium">{item.label}</span>
-        <span className={cn("block text-xs", active ? "text-foreground/70" : "text-muted-foreground")}>{item.detail}</span>
-      </span>
-    </Link>
-  );
+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);
+  const accountSummary = useProspectusAccountSummary();
+  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 id={`organizer-account-trigger-${placement}`} 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>{accountSummary ?? (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 />
+        <ProspectusAccountChooser />
+        <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 NewsroomOpsShell({
-  activeTab,
-  appTitle,
-  backHref = "/",
-  backLabel,
-  children,
-  demo = false,
-  headerActions,
-  pageTitle,
-  showNavigation = true,
-  tabCounts = {},
-}: NewsroomOpsShellProps) {
+export function NewsroomOpsShell({ 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 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"
-      data-news-desk
-      data-newsroom-chrome="app"
-      data-newsroom-ops-shell="true"
-    >
-      <header
-        className="flex h-14 shrink-0 items-center gap-3 border-b border-border bg-card/50 px-3 sm:px-4"
-        data-newsroom-ops-topbar
-      >
-        <Link
-          className={cn(buttonVariants({ variant: "ghost", size: "sm" }), "shrink-0 px-2")}
-          href={backHref}
-        >
-          {backLabel}
-        </Link>
-        <div className="min-w-0 flex-1">
-          <p className="truncate text-[0.65rem] font-semibold uppercase tracking-[0.12em] text-muted-foreground">
-            {appTitle}
-          </p>
-          <h1 className="truncate text-base font-semibold tracking-tight text-foreground" data-newsroom-ops-title>
-            {pageTitle}
-          </h1>
-        </div>
-        <div className="flex shrink-0 items-center gap-1.5">{headerActions}</div>
-      </header>
-
-      <div className="flex min-h-0 flex-1">
-        {showNavigation ? (
-          <aside
-            aria-label="Newsroom sections"
-            className="hidden w-64 shrink-0 flex-col border-r border-border bg-muted/20 md:flex"
-            data-newsroom-ops-sidebar
-          >
-            <ScrollArea className="min-h-0 flex-1 p-3">
-              <nav className="flex flex-col gap-1">
-                {NEWSROOM_OPS_NAV.map((item) => (
-                  <SidebarNavLink
-                    active={resolvedActiveTab === item.id}
-                    countState={tabCounts[item.id]}
-                    demo={demo}
-                    item={item}
-                    key={item.id}
-                  />
-                ))}
-              </nav>
-            </ScrollArea>
-          </aside>
-        ) : null}
-
-        <main className="flex min-h-0 min-w-0 flex-1 flex-col">
-          <ScrollArea className="min-h-0 flex-1">
-            <div className="mx-auto w-full max-w-6xl p-4 sm:p-6">{children}</div>
-          </ScrollArea>
-        </main>
+  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");
+  const sidebarToggleLabel = collapsed ? "Expand sidebar" : "Collapse sidebar";
+  const sidebarToggle = <button type="button" className="organizer-toggle" title={sidebarToggleLabel}
+    aria-label={sidebarToggleLabel} aria-expanded={!collapsed} aria-controls="organizer-sidebar" onClick={() => setCollapsed(value => !value)}>
+    {collapsed ? <PanelLeftOpen size={16} aria-hidden="true" /> : <PanelLeftClose size={16} aria-hidden="true" />}
+  </button>;
+  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">
+      <div className="organizer-sidebar-head">
+        <Link className="organizer-brand" href={getNewsroomNavHref("/newsroom", demo)}>{SITE_BRAND.components?.NewsroomLogo ? <SITE_BRAND.components.NewsroomLogo className="organizer-brand-logo" /> : appTitle}<small>The newsroom</small></Link>
+        {sidebarToggle}
       </div>
-
-      {showNavigation ? (
-        <nav
-          aria-label="Primary newsroom navigation"
-          className="shrink-0 border-t border-border bg-card/95 pb-[max(env(safe-area-inset-bottom),0.35rem)] pt-1 md:hidden"
-          data-newsroom-ops-bottom-nav
-        >
-          <ul className="grid grid-cols-6 gap-1 px-1">
-            {mobilePrimary.map((item) => {
-              const Icon = MOBILE_TAB_ICONS[item.id] ?? LayoutGridIcon;
-              const active = resolvedActiveTab === item.id;
-              return (
-                <li key={item.id}>
-                  <Link
-                    aria-current={active ? "page" : undefined}
-                    className={cn(
-                      "flex min-h-14 flex-col items-center justify-center gap-1 rounded-xl px-1 py-2 text-[0.68rem] font-medium",
-                      active
-                        ? "bg-primary text-primary-foreground shadow-sm"
-                        : "text-muted-foreground",
-                    )}
-                    data-news-desk-tab={item.id}
-                    href={getNewsroomNavHref(item.href, demo)}
-                  >
-                    <Icon className="size-4" aria-hidden="true" />
-                    <span>{item.label}</span>
-                  </Link>
-                </li>
-              );
-            })}
-            <li>
-              <Sheet onOpenChange={setMenuOpen} open={menuOpen}>
-                <SheetTrigger
-                  className={cn(
-                    "flex min-h-14 w-full flex-col items-center justify-center gap-1 rounded-xl px-1 py-2 text-[0.68rem] font-medium text-muted-foreground",
-                  )}
-                >
-                  <MenuIcon className="size-4" aria-hidden="true" />
-                  <span>More</span>
-                </SheetTrigger>
-                <SheetContent className="gap-0 p-0" side="bottom">
-                  <SheetHeader className="border-b border-border px-4 py-4">
-                    <SheetTitle>All sections</SheetTitle>
-                  </SheetHeader>
-                  <ScrollArea className="max-h-[60dvh] p-3">
-                    <div className="flex flex-col gap-1">
-                      {NEWSROOM_OPS_NAV.map((item) => (
-                        <SidebarNavLink
-                          active={resolvedActiveTab === item.id}
-                          countState={tabCounts[item.id]}
-                          demo={demo}
-                          item={item}
-                          key={item.id}
-                          onNavigate={() => setMenuOpen(false)}
-                        />
-                      ))}
-                    </div>
-                  </ScrollArea>
-                </SheetContent>
-              </Sheet>
-            </li>
-          </ul>
-        </nav>
-      ) : null}
+      <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 && collapsed && sidebarToggle}
+        <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>
     </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 ? "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>;
 }
 
 export function NewsroomOpsSearchButton({

package/components/reference-cyclotron-priming.tsx

@@ -6,9 +6,8 @@ import { primingStateText, type PrimingRequestView } from "../lib/relevance-stat
 export type PrimingFormInput = { url: string; label: string; explanation: string };
 
 /**
- * A compact form that primes the running relevance cyclotron with a pasted
- * URL. The next sweep reads the page, adds it to the cyclotron's example list
- * and records the outcome, which this list shows beside each saved request.
+ * A compact "Add a reference" form for a pasted URL. The page is read in the
+ * background and the outcome is shown beside each added reference.
  */
 export function ReferenceCyclotronPriming({
   labels,
@@ -25,19 +24,19 @@ export function ReferenceCyclotronPriming({
   const [message, setMessage] = useState<string | null>(null);
 
   async function submit() {
-    setMessage("Saving…");
+    setMessage("Adding…");
     try {
       await onRequestPriming({ url, label, explanation });
       setUrl("");
       setExplanation("");
-      setMessage("Saved. The next sweep reads the page and adds it to the cyclotron.");
+      setMessage("Added. The page will be read shortly.");
     } catch (error) {
       setMessage(error instanceof Error ? error.message : String(error));
     }
   }
 
   return (
-    <section aria-label="Prime the relevance cyclotron" className="space-y-2 text-sm" data-reference-cyclotron-priming>
+    <section aria-label="Add a reference" className="space-y-2 text-sm" data-reference-cyclotron-priming>
       <form
         className="flex flex-wrap items-end gap-3"
         onSubmit={(event) => {
@@ -46,9 +45,9 @@ export function ReferenceCyclotronPriming({
         }}
       >
         <label className="flex min-w-64 flex-1 flex-col gap-1">
-          <span className="text-xs text-muted-foreground">Prime with a URL</span>
+          <span className="text-xs text-muted-foreground">Add a reference by URL</span>
           <input
-            aria-label="Priming URL"
+            aria-label="Reference URL"
             onChange={(event) => setUrl(event.target.value)}
             placeholder="https://"
             required
@@ -57,8 +56,8 @@ export function ReferenceCyclotronPriming({
           />
         </label>
         <label className="flex flex-col gap-1">
-          <span className="text-xs text-muted-foreground">Label</span>
-          <select aria-label="Priming label" onChange={(event) => setLabel(event.target.value)} value={label}>
+          <span className="text-xs text-muted-foreground">Include or exclude</span>
+          <select aria-label="Include or exclude" onChange={(event) => setLabel(event.target.value)} value={label}>
             {labels.map((choice) => (
               <option key={choice} value={choice}>{choice}</option>
             ))}
@@ -66,13 +65,13 @@ export function ReferenceCyclotronPriming({
         </label>
         <label className="flex min-w-48 flex-1 flex-col gap-1">
           <span className="text-xs text-muted-foreground">Why (optional)</span>
-          <input aria-label="Priming explanation" onChange={(event) => setExplanation(event.target.value)} type="text" value={explanation} />
+          <input aria-label="Reason" onChange={(event) => setExplanation(event.target.value)} type="text" value={explanation} />
         </label>
-        <button className="cyclotron-review-secondary" type="submit">Save</button>
+        <button className="cyclotron-review-secondary" type="submit">Add reference</button>
         {message ? <p className="basis-full text-xs" role="status">{message}</p> : null}
       </form>
       {requests.length ? (
-        <ul aria-label="Saved priming requests" className="space-y-1 text-xs text-muted-foreground">
+        <ul aria-label="Added references" className="space-y-1 text-xs text-muted-foreground">
           {requests.slice(0, 10).map((view) => (
             <li data-priming-request-state={view.outcome?.state ?? "waiting"} key={view.request.requestId}>
               <span className="font-medium">{view.request.label}</span> {view.request.url} · {primingStateText(view)}

package/components/reference-cyclotron-status.tsx

@@ -38,19 +38,19 @@ export function ReferenceCyclotronStatus({
     setMessage("Sending…");
     try {
       await onRequestRate(choice);
-      setMessage("The next sweep applies it and the status will show who set it.");
+      setMessage("Saved. The new rate takes effect shortly and the status will show who set it.");
     } catch (error) {
       setMessage(error instanceof Error ? error.message : String(error));
     }
   }
 
   return (
-    <section aria-label="Relevance cyclotron" className="space-y-2" data-reference-cyclotron-status>
+    <section aria-label="Suggestion status" className="space-y-2" data-reference-cyclotron-status>
       <CyclotronStatusView status={status} />
       {stale ? (
         <p className="text-xs text-foreground" data-reference-cyclotron-status-stale>
           <span aria-hidden="true">⚠ </span>
-          Snapshot from {Math.round(ageHours)} hours ago; the next sweep refreshes it.
+          Status last updated {Math.round(ageHours)} hours ago; it refreshes automatically.
         </p>
       ) : null}
       <button
@@ -59,7 +59,7 @@ export function ReferenceCyclotronStatus({
         onClick={() => setOpen((value) => !value)}
         type="button"
       >
-        {open ? "Hide what the cyclotron is doing" : "What the cyclotron is doing"}
+        {open ? "Hide suggestion details" : "Suggestion details"}
       </button>
       {open ? (
         <div className="space-y-3">

package/components/reference-cyclotron-suggestion.tsx

@@ -101,12 +101,12 @@ export function ReferenceSuggestionProvenance({ decision }: { decision: Relevanc
         <ul className="mt-2 space-y-1">
           <li>{summary.teachingLabelsSentence}.</li>
           <li>{summary.primingExamplesSentence}.</li>
-          <li>Doctrine fingerprint {summary.doctrineShortHash ?? "not recorded"}.</li>
-          <li>Model {summary.modelVersion ?? "version not recorded"}.</li>
+          <li>Guidelines code {summary.doctrineShortHash ?? "not recorded"}.</li>
+          <li>Suggestion {summary.modelVersion ?? "revision not recorded"}.</li>
           <li>Decided {formatSuggestionTime(summary.decidedAt)}.</li>
         </ul>
       ) : (
-        <p className="mt-2">This suggestion was made before the cyclotron recorded how. Only its model version and confidence are known.</p>
+        <p className="mt-2">This suggestion was made before the details were recorded. Only its revision and confidence are known.</p>
       )}
     </details>
   );
@@ -116,7 +116,7 @@ export function ReferenceSuggestionProvenance({ decision }: { decision: Relevanc
 export function CountsAsTrainingLabelNote({ referenceLineageId }: { referenceLineageId: string }) {
   return (
     <p className="border-l-2 border-foreground pl-2 text-xs font-semibold text-foreground" data-reference-training-label={referenceLineageId}>
-      Counts as a training label: an editor made this decision, so the cyclotron learns from it.
+      Recorded as an editor&rsquo;s own decision.
     </p>
   );
 }
@@ -135,8 +135,8 @@ export function DelegatedCurationNote({ delegated, referenceLineageId }: { deleg
       <p className="text-xs">Delegation {delegated.delegationShortId || "id not recorded"}.</p>
       <p className="text-xs font-semibold" data-reference-training-label={referenceLineageId}>
         {delegated.countsAsTrainingLabel
-          ? `Counts as a training label: the record is stamped as ${delegated.person ?? "the person"}'s own decision, so the cyclotron learns from it.`
-          : "Does not count as a training label."}
+          ? `Recorded as ${delegated.person ?? "the person"}'s own decision.`
+          : "Not recorded as a person's own decision."}
       </p>
     </section>
   );

package/components/reference-live-agreement.tsx

@@ -12,10 +12,10 @@ import { formatSuggestionTime } from "./reference-cyclotron-suggestion";
 
 function MeasurementFigures({ measurement }: { measurement: AgreementStripMeasurement }) {
   const figures: Array<[string, string]> = [
-    ["Agreement", formatPercentage(measurement.agreement)],
-    ["Precision", formatPercentage(measurement.precision)],
-    ["Recall", formatPercentage(measurement.recall)],
-    ["Comparisons", String(measurement.comparisons)],
+    ["Matches editors", formatPercentage(measurement.agreement)],
+    ["Suggested includes editors kept", formatPercentage(measurement.precision)],
+    ["Editor includes suggested", formatPercentage(measurement.recall)],
+    ["Decisions compared", String(measurement.comparisons)],
   ];
   return (
     <dl className="flex flex-wrap gap-x-6 gap-y-1">
@@ -30,19 +30,19 @@ function MeasurementFigures({ measurement }: { measurement: AgreementStripMeasur
 }
 
 /**
- * Live agreement at the top of References: how often the cyclotron's
+ * Live agreement at the top of References: how often the
  * suggestions matched what editors then decided. Hidden without a payload.
  */
 export function ReferenceLiveAgreement({ agreement }: { agreement: ShadowAgreement | null }) {
   const state = agreementStripState(agreement);
   if (state.kind === "hidden") return null;
   return (
-    <section aria-label="Live agreement" className="shrink-0 space-y-2 border-y border-foreground py-3" data-reference-live-agreement={state.kind}>
-      <h3 className="text-xs font-semibold uppercase tracking-wide text-foreground">Live agreement</h3>
+    <section aria-label="Suggestion accuracy" className="shrink-0 space-y-2 border-y border-foreground py-3" data-reference-live-agreement={state.kind}>
+      <h3 className="text-xs font-semibold uppercase tracking-wide text-foreground">Suggestion accuracy</h3>
       {state.loop ? (
         <p className="text-sm text-foreground" data-reference-live-agreement-loop>
           <span className="font-semibold">{loopStateWords(state.loop)}</span>
-          {" · "}Last sweep {formatSuggestionTime(state.loop.lastSweepAt)}
+          {" · "}Last checked {formatSuggestionTime(state.loop.lastSweepAt)}
           {" · "}{dailyCapWords(state.loop)}
         </p>
       ) : null}
@@ -51,11 +51,11 @@ export function ReferenceLiveAgreement({ agreement }: { agreement: ShadowAgreeme
       ) : null}
       {state.kind === "not_enough" ? (
         <p className="text-sm text-foreground" data-reference-live-agreement-not-enough>
-          Not enough comparisons yet: {state.measurement.comparisons} of {state.needed} editor decisions have followed a suggestion. Figures appear at {state.needed}.
+          Not enough decisions yet: {state.measurement.comparisons} of {state.needed} editor decisions have followed a suggestion. Figures appear at {state.needed}.
         </p>
       ) : <MeasurementFigures measurement={state.measurement} />}
       <p className="text-xs text-foreground">
-        Suggestions compared with the decisions editors made afterwards. Computed {formatSuggestionTime(agreement?.computedAt ?? null)}.
+        Suggestions compared with the decisions editors made afterwards. Updated {formatSuggestionTime(agreement?.computedAt ?? null)}.
       </p>
     </section>
   );

package/components/reference-priming.tsx

@@ -10,7 +10,7 @@ export function ReferencePriming(props: PrimingPanelProps) {
   return (
     <section className="shrink-0 space-y-3" aria-label="Representative reference examples">
       <Button aria-expanded={open} onClick={() => setOpen((value) => !value)} variant="outline">
-        {open ? "Hide example priming" : "Curate reference examples (optional)"}
+        {open ? "Hide example references" : "Add example references (optional)"}
       </Button>
       {open ? <div className="max-h-[55dvh] space-y-3 overflow-y-auto pr-1"><p className="text-sm text-muted-foreground">Corrections to extracted content: describe what needs fixing, then enter the corrected title and abstract or summary. The note is saved with your correction; it does not automatically regenerate the content. Choose Publish / Not publish separately. An explanation of that judgment is optional.</p><PrimingPanel {...props} renderItem={props.renderItem ?? ((item) => <div className="space-y-2"><p className="whitespace-pre-wrap text-sm">{String(item.values.abstract ?? item.values.text ?? "")}</p><p className="break-all text-xs text-muted-foreground">{String(item.values.source_uri ?? "")}</p></div>)} /></div> : null}
     </section>

package/components/reference-relevance-review.tsx

@@ -67,7 +67,7 @@ export function ReferenceRelevanceReview({
           onChange={(event) => setShareable(event.target.checked)}
           type="checkbox"
         />
-        My explanation may be quoted publicly (for the Cyclotron example page)
+        My explanation may be quoted publicly (on a public example page)
       </label>
       {error ? <p className="text-xs text-destructive" role="alert">{error}</p> : null}
     </section>