@anthusai/papyrus 1.0.0-next.5 → 1.0.0-next.7

package/components/newsroom-articles-view.tsx

@@ -0,0 +1,129 @@
+"use client";
+
+import { PlusIcon } from "lucide-react";
+import Link from "next/link";
+import { useEffect, useMemo, useState } from "react";
+import { Badge } from "./ui/badge";
+import { buttonVariants } from "./ui/button";
+import { Spinner } from "./ui/spinner";
+import { Tabs, TabsList, TabsTrigger } from "./ui/tabs";
+import { SITE_BRAND } from "../lib/site-brand";
+import { getNewsroomNavHref } from "../lib/newsroom-nav";
+import { newsroomHref } from "../lib/newsroom-base-path";
+import {
+  resolveArticlesBackend,
+  rowStatusLabel,
+  type NewsroomArticleRow,
+} from "../lib/newsroom-articles";
+import { cn } from "../lib/utils";
+import { useOptionalNewsDeskClient } from "./news-desk-client-provider";
+import { NewsDeskAccessGate } from "./newsroom-access-gate";
+import { NewsroomOpsShell, NewsroomOpsStatusBanner } from "./newsroom-ops-shell";
+
+type ArticleFilter = "all" | "drafts" | "published";
+
+export function articlesAccessBlocked(phase: string | undefined): boolean {
+  return phase === undefined || phase === "checkingAccess" || phase === "signedOut" || phase === "forbidden" || phase === "error";
+}
+
+export function NewsroomArticlesView({ demo }: { demo: boolean }) {
+  const session = useOptionalNewsDeskClient();
+  const blocked = !demo && articlesAccessBlocked(session?.shell.phase);
+  const [rows, setRows] = useState<NewsroomArticleRow[] | null>(null);
+  const [loadError, setLoadError] = useState<string | null>(null);
+  const [filter, setFilter] = useState<ArticleFilter>("all");
+
+  useEffect(() => {
+    if (blocked) return;
+    let cancelled = false;
+    resolveArticlesBackend(demo)
+      .listRows()
+      .then((loaded) => {
+        if (!cancelled) setRows(loaded);
+      })
+      .catch((error: unknown) => {
+        if (!cancelled) setLoadError(error instanceof Error ? error.message : "Could not load articles.");
+      });
+    return () => {
+      cancelled = true;
+    };
+  }, [blocked, demo]);
+
+  const visibleRows = useMemo(() => {
+    if (!rows) return [];
+    if (filter === "drafts") return rows.filter((row) => row.status === "draft");
+    if (filter === "published") return rows.filter((row) => row.status === "published");
+    return rows;
+  }, [filter, rows]);
+
+  if (blocked) return <NewsDeskAccessGate shell={session?.shell ?? null} />;
+
+  return (
+    <NewsroomOpsShell
+      activeTab="articles"
+      appTitle={SITE_BRAND.appTitle}
+      backHref="/"
+      backLabel={SITE_BRAND.backToHomeLabel}
+      demo={demo}
+      headerActions={(
+        <>
+          {demo ? <Badge variant="outline">Demo</Badge> : null}
+          <Link
+            className={cn(buttonVariants({ size: "sm" }))}
+            data-newsroom-article-new
+            href={getNewsroomNavHref(newsroomHref("articles", "new"), demo)}
+          >
+            <PlusIcon aria-hidden="true" />
+            New article
+          </Link>
+        </>
+      )}
+      pageTitle="Articles"
+    >
+      <div className="space-y-4" data-newsroom-articles>
+        <Tabs defaultValue="all" onValueChange={(value) => setFilter(value as ArticleFilter)} value={filter}>
+          <TabsList>
+            <TabsTrigger className="min-w-[5.5rem]" value="all">All</TabsTrigger>
+            <TabsTrigger className="min-w-[5.5rem]" value="drafts">Drafts</TabsTrigger>
+            <TabsTrigger className="min-w-[5.5rem]" value="published">Published</TabsTrigger>
+          </TabsList>
+        </Tabs>
+        {loadError ? <NewsroomOpsStatusBanner tone="error">{loadError}</NewsroomOpsStatusBanner> : null}
+        {rows === null && !loadError ? (
+          <div className="flex items-center gap-2 text-sm text-muted-foreground">
+            <Spinner /> Loading articles…
+          </div>
+        ) : null}
+        {rows !== null && visibleRows.length === 0 ? (
+          <p className="text-sm text-muted-foreground">Nothing here yet.</p>
+        ) : null}
+        <ul className="divide-y divide-border rounded-xl border border-border bg-card" data-newsroom-articles-list>
+          {visibleRows.map((row) => (
+            <li key={row.id}>
+              <Link
+                className="flex flex-col gap-1 px-4 py-3 hover:bg-muted/40 sm:flex-row sm:items-center sm:justify-between sm:gap-4"
+                data-newsroom-article-row={row.slug}
+                href={getNewsroomNavHref(newsroomHref("articles", row.id), demo)}
+              >
+                <span className="min-w-0">
+                  <span className="block truncate text-sm font-medium">{row.title}</span>
+                  <span className="block truncate text-xs text-muted-foreground">
+                    {row.slug}
+                    {row.section ? ` · ${row.section}` : ""}
+                    {row.type !== "article" ? ` · ${row.type}` : ""}
+                  </span>
+                </span>
+                <Badge
+                  data-newsroom-article-status
+                  variant={row.status === "draft" ? "muted" : row.pending ? "outline" : "secondary"}
+                >
+                  {rowStatusLabel(row)}
+                </Badge>
+              </Link>
+            </li>
+          ))}
+        </ul>
+      </div>
+    </NewsroomOpsShell>
+  );
+}

package/components/newsroom-ops-shell.tsx

@@ -3,6 +3,7 @@
 import {
   BookOpenIcon,
   ClipboardListIcon,
+  FileTextIcon,
   LayoutGridIcon,
   MenuIcon,
   SearchIcon,
@@ -55,6 +56,7 @@ type NewsroomOpsShellProps = {
 
 const MOBILE_TAB_ICONS: Record<string, typeof LayoutGridIcon> = {
   overview: LayoutGridIcon,
+  articles: FileTextIcon,
   assignments: ClipboardListIcon,
   references: BookOpenIcon,
   topics: TagsIcon,
@@ -198,7 +200,7 @@ export function NewsroomOpsShell({
           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-5 gap-1 px-2">
+          <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;

package/components/topic-steering-workspace.tsx

@@ -81,7 +81,7 @@ import { cn } from "../lib/utils";
 import { useOptionalNewsDeskClient } from "./news-desk-client-provider";
 import { ReferenceSourcePreview } from "./reference-source-preview";
 import type { ReaderAuthSnapshot } from "./reader-auth-state";
-import { ReaderAuthControl } from "./reader-auth-control";
+import { NewsDeskAccessGate } from "./newsroom-access-gate";
 import { NewsroomOpsOverview } from "./newsroom-ops-overview";
 import { NewsroomReferencesView } from "./newsroom-references-view";
 import { NewsroomAssignmentsView } from "./newsroom-assignments-view";
@@ -169,7 +169,6 @@ import {
   uniqueNeighborGroupsForCategoryContext,
   type CategoryDrilldownContext,
 } from "../lib/newsroom-category-drilldown";
-import type { NewsDeskShellState } from "../lib/news-desk-session";
 import {
   resolveNewsroomCardTemplate,
   type NewsroomCardSpan,
@@ -15399,63 +15398,6 @@ function readTextClaim(value: unknown): string | null {
   return typeof value === "string" && value.trim() ? value.trim() : null;
 }
 
-function NewsDeskAccessGate({ shell, showSectionTabs = false }: { shell: NewsDeskShellState | null; showSectionTabs?: boolean }) {
-  const accessPhase = shell?.phase ?? "checkingAccess";
-
-  return (
-    <NewsroomOpsShell
-      activeTab="overview"
-      appTitle={SITE_BRAND.appTitle}
-      backHref="/"
-      backLabel={SITE_BRAND.backToHomeLabel}
-      headerActions={(
-        <Link className={cn(buttonVariants({ variant: "ghost", size: "sm" }))} href="/settings">Settings</Link>
-      )}
-      pageTitle="Newsroom"
-      showNavigation={showSectionTabs}
-    >
-      <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">
-          <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>
-          {shell?.error ? <p className="text-sm text-destructive">{shell.error}</p> : null}
-          <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="/newsroom" showIdentity />
-            </div>
-          ) : null}
-        </div>
-      </section>
-    </NewsroomOpsShell>
-  );
-}
-
-function formatAccessTitle(state: NewsDeskShellState | null): string {
-  if (!state || state.phase === "checkingAccess") return "Checking Desk Credentials";
-  if (state.phase === "loadingDesk") return "Loading Newsroom Records";
-  if (state.phase === "forbidden") return "Editor Role Required";
-  if (state.phase === "error") return "Newsroom Unavailable";
-  return "Editor Sign-In Required";
-}
-
-function formatAccessDetail(state: NewsDeskShellState | null): string {
-  if (!state || state.phase === "checkingAccess") return `${SITE_BRAND.appTitle} is checking the current browser session before loading steering state.`;
-  if (state.phase === "loadingDesk") return `${SITE_BRAND.appTitle} verified the browser session and is loading private Newsroom records.`;
-  if (state.phase === "forbidden") return "This account is signed in, but the Cognito session does not include the editor or admin group.";
-  if (state.phase === "error") return `${SITE_BRAND.appTitle} could not verify this editor session or load the private Newsroom data.`;
-  return "Sign in with an editor or admin account to inspect category, category tree, ontology, and graph steering.";
-}
-
-function formatAccessActionDetail(state: NewsDeskShellState | null): string {
-  if (!state || state.phase === "checkingAccess") return "This should only take a moment. If it hangs, reload the page.";
-  if (state.phase === "loadingDesk") return "Private records are loading from GraphQL. Large reference queues may take several seconds.";
-  if (state.phase === "forbidden") return "Ask an admin to add this account to the editor or admin group, then sign out and back in.";
-  if (state.phase === "error") return "Reload the page or check the local development console for the GraphQL error.";
-  return "Use the login button above to authenticate with an editor or admin account.";
-}
-
 function SectionHeader({ title, detail }: { title: string; detail: string }) {
   const id = title.toLowerCase().replace(/[^a-z0-9]+/g, "-");
   return (

package/lib/content-actions-demo.ts

@@ -0,0 +1,190 @@
+import { ContentActionFailure } from "./content-actions-client";
+import type {
+  DeriveMarkusInput,
+  DeriveMarkusResult,
+  PublishItemResult,
+  SaveItemDraftInput,
+  SaveItemDraftResult,
+  UnpublishItemResult,
+} from "./content-actions-client";
+import {
+  createDemoArticleRecords,
+  demoContentHash,
+  type DemoArticleRecord,
+} from "./newsroom-demo-articles";
+import { sourceLineOffset, type ArticlesBackend, type EditableArticle, type NewsroomArticleRow } from "./newsroom-articles";
+
+function titleFromYaml(frontMatterYaml: string | null, fallback: string): string {
+  for (const line of (frontMatterYaml ?? "").split("\n")) {
+    const match = /^title\s*:\s*(.*)$/.exec(line);
+    if (match && match[1].trim()) return match[1].trim().replace(/^["']|["']$/g, "");
+  }
+  return fallback;
+}
+
+const DEMO_IMAGE_DIRECTIVE = /^::image\{([^}]*)\}$/;
+
+function demoAttribute(attributes: string, name: string): string {
+  const match = new RegExp(`${name}="([^"]*)"`).exec(attributes);
+  return match ? match[1] : "";
+}
+
+function demoEnvelope(bodyMarkus: string) {
+  const images: Record<string, Record<string, unknown>> = {};
+  const children = bodyMarkus
+    .split(/\n{2,}/)
+    .map((block) => block.trim())
+    .filter(Boolean)
+    .map((block) => {
+      const heading = /^(#{1,6})\s+(.*)$/.exec(block);
+      if (heading) {
+        return { type: "heading", level: heading[1].length, inline: [{ type: "text", text: heading[2] }], line: null };
+      }
+      const image = DEMO_IMAGE_DIRECTIVE.exec(block);
+      if (image) {
+        const token = `PAPYRUSMARKUP${String(Object.keys(images).length + 1).padStart(5, "0")}END`;
+        images[token] = {
+          src: demoAttribute(image[1], "src"),
+          alt: demoAttribute(image[1], "alt"),
+          layout: demoAttribute(image[1], "layout") || null,
+        };
+        return { type: "paragraph", inline: [{ type: "text", text: token }], line: null };
+      }
+      return { type: "paragraph", inline: [{ type: "text", text: block }], line: null };
+    });
+  return {
+    schemaVersion: 1,
+    markus: { version: "demo", irSchemaVersion: 1 },
+    document: { type: "document", schema_version: 1, front_matter: {}, children },
+    papyrus: { images, citations: {}, citationLists: {}, entries: {}, bibliography: [] },
+  };
+}
+
+export function createDemoArticlesBackend(): ArticlesBackend {
+  const records = new Map<string, DemoArticleRecord>(createDemoArticleRecords().map((record) => [record.id, record]));
+  let created = 0;
+
+  const requireRecord = (id: string): DemoArticleRecord => {
+    const record = records.get(id);
+    if (!record) throw new ContentActionFailure([{ code: "not-found", message: "That article was not found.", line: null }]);
+    return record;
+  };
+
+  return {
+    actions: {
+      async deriveMarkus(input: DeriveMarkusInput): Promise<DeriveMarkusResult> {
+        const lines = input.bodyMarkus.split("\n");
+        const invalidIndex = lines.findIndex((line) => line.includes(":::nope"));
+        if (invalidIndex >= 0) {
+          throw new ContentActionFailure([
+            { code: "markus-validation", message: 'Unknown directive "nope".', line: invalidIndex + 1 + sourceLineOffset(input.frontMatterYaml) },
+          ]);
+        }
+        const envelope = demoEnvelope(input.bodyMarkus);
+        return {
+          ok: true,
+          bodyIrBytes: JSON.stringify(envelope).length,
+          ...(input.includeIr ? { bodyIr: envelope } : {}),
+          errors: [],
+        };
+      },
+      async saveItemDraft(input: SaveItemDraftInput): Promise<SaveItemDraftResult> {
+        const existing = input.id ? requireRecord(input.id) : null;
+        if (existing && input.expectedContentHash !== null && input.expectedContentHash !== existing.contentHash) {
+          throw new ContentActionFailure([
+            { code: "conflict", message: "The item changed since it was loaded.", line: null },
+          ]);
+        }
+        if (existing && existing.everPublished && existing.slug !== input.slug) {
+          throw new ContentActionFailure([
+            { code: "slug-locked", message: "The slug cannot change once the item has been published.", line: null },
+          ]);
+        }
+        const id = existing?.id ?? `demo-article-new-${(created += 1)}`;
+        const title = titleFromYaml(input.frontMatterYaml, input.slug);
+        const frontMatterYaml = input.frontMatterYaml ?? "";
+        const record: DemoArticleRecord = {
+          id,
+          type: input.type,
+          slug: input.slug,
+          section: input.section,
+          title,
+          status: existing?.status ?? "draft",
+          frontMatterYaml,
+          bodyMarkus: input.bodyMarkus,
+          contentHash: demoContentHash(frontMatterYaml, input.bodyMarkus),
+          publishedContentHash: existing?.publishedContentHash ?? null,
+          versionNumber: existing?.versionNumber ?? null,
+          everPublished: existing?.everPublished ?? false,
+          updatedAt: new Date().toISOString(),
+        };
+        records.set(id, record);
+        return {
+          ok: true,
+          item: {
+            id,
+            contentHash: record.contentHash,
+            status: record.status,
+            slug: record.slug,
+            versionNumber: record.versionNumber,
+          },
+        };
+      },
+      async publishItem(id: string): Promise<PublishItemResult> {
+        const record = requireRecord(id);
+        const changed = record.status !== "published" || record.publishedContentHash !== record.contentHash;
+        const versionNumber = changed ? (record.versionNumber ?? 0) + 1 : record.versionNumber;
+        records.set(id, {
+          ...record,
+          status: "published",
+          everPublished: true,
+          publishedContentHash: record.contentHash,
+          versionNumber,
+          updatedAt: new Date().toISOString(),
+        });
+        return { ok: true, changed, publishedId: `published-${id}`, versionNumber };
+      },
+      async unpublishItem(id: string): Promise<UnpublishItemResult> {
+        const record = requireRecord(id);
+        const changed = record.status === "published";
+        records.set(id, {
+          ...record,
+          status: "draft",
+          publishedContentHash: null,
+          updatedAt: new Date().toISOString(),
+        });
+        return { ok: true, changed };
+      },
+    },
+    async listRows(): Promise<NewsroomArticleRow[]> {
+      return [...records.values()]
+        .map((record) => ({
+          id: record.id,
+          type: record.type,
+          slug: record.slug,
+          section: record.section,
+          title: record.title || record.slug,
+          status: record.status,
+          pending: record.status === "published" && record.publishedContentHash !== record.contentHash,
+          updatedAt: record.updatedAt,
+        }))
+        .sort((left, right) => right.updatedAt.localeCompare(left.updatedAt));
+    },
+    async loadArticle(id: string): Promise<EditableArticle> {
+      const record = requireRecord(id);
+      return {
+        id: record.id,
+        type: record.type,
+        section: record.section,
+        slug: record.slug,
+        frontMatterYaml: record.frontMatterYaml,
+        bodyMarkus: record.bodyMarkus,
+        contentHash: record.contentHash,
+        status: record.status,
+        versionNumber: record.versionNumber,
+        aliases: [],
+        everPublished: record.everPublished,
+      };
+    },
+  };
+}