feat: add presentation opening thesis visual

2026-07-10 03:39:17 +07:00
parent a7acace668
commit 9a42e2bfc3
5 changed files with 152 additions and 0 deletions
@@ -0,0 +1,32 @@
+import { cleanup, render, screen } from "@testing-library/react";
+import { afterEach, describe, expect, it } from "vitest";
+import { findBeat, findScene } from "../storyboard.js";
+import { OpeningThesisScene } from "./OpeningThesisScene.js";
+
+const thesisScene = findScene("thesis")!;
+
+afterEach(() => cleanup());
+
+describe("OpeningThesisScene", () => {
+  it("renders the title reveal with latent component icons", () => {
+    render(<OpeningThesisScene scene={thesisScene} beat={findBeat("thesis", "title")!} />);
+
+    expect(screen.getByRole("heading", { name: /Design and Implementation of lda\.chat/i })).toBeInTheDocument();
+    expect(screen.getByText("Planner")).toBeInTheDocument();
+    expect(screen.getByText("Tool Surface")).toBeInTheDocument();
+    expect(screen.getByText("Workflow Platform")).toBeInTheDocument();
+    expect(screen.getByRole("img", { name: /Planner icon/i })).toBeInTheDocument();
+    expect(screen.getByRole("img", { name: /Tool Surface icon/i })).toBeInTheDocument();
+    expect(screen.getByRole("img", { name: /Workflow Platform icon/i })).toBeInTheDocument();
+  });
+
+  it("renders contribution focus without relying on lda.chat as category label", () => {
+    render(<OpeningThesisScene scene={thesisScene} beat={findBeat("thesis", "substrate")!} />);
+
+    expect(screen.getByText("Codex / Claude / OpenCode")).toBeInTheDocument();
+    expect(screen.getByText("CLI / MCP / APIs")).toBeInTheDocument();
+    expect(screen.getByText("submitted substrate")).toBeInTheDocument();
+    expect(screen.getByText("Typed · Durable · Inspectable")).toBeInTheDocument();
+    expect(screen.queryByText("wf")).not.toBeInTheDocument();
+  });
+});
@@ -0,0 +1,54 @@
+import { StageCaption } from "../StageCaption.js";
+import type { SceneBeatDefinition, SceneDefinition } from "../storyboard.js";
+import { ConceptNode, ConceptRail } from "./ConceptPrimitives.js";
+
+type OpeningThesisSceneProps = {
+  readonly scene: SceneDefinition;
+  readonly beat: SceneBeatDefinition;
+};
+
+const title = "Design and Implementation of lda.chat";
+
+export const OpeningThesisScene = ({ scene, beat }: OpeningThesisSceneProps) => {
+  const contributionBeat = beat.id === "substrate";
+  return (
+    <>
+      <StageCaption eyebrow="Origin story" title={title}>
+        <p>{beat.caption}</p>
+      </StageCaption>
+      <section
+        className="opening-thesis"
+        aria-label="AI agent decomposition"
+        data-opening-beat={beat.id}
+      >
+        <div className="opening-thesis__title-card">
+          <span>AI agent for workspace workflows</span>
+          <strong>{contributionBeat ? "Decomposed" : scene.title}</strong>
+        </div>
+        <ConceptRail label="AI agent components">
+          <ConceptNode
+            title="Planner"
+            subtitle="Codex / Claude / OpenCode"
+            icon="planner"
+            emphasis={contributionBeat ? "muted" : "normal"}
+          />
+          <ConceptNode
+            title="Tool Surface"
+            subtitle="CLI / MCP / APIs"
+            icon="tool"
+            emphasis={contributionBeat ? "muted" : "normal"}
+          />
+          <ConceptNode
+            title="Workflow Platform"
+            subtitle="submitted substrate"
+            icon="platform"
+            emphasis="primary"
+          >
+            <span>Typed · Durable · Inspectable</span>
+          </ConceptNode>
+        </ConceptRail>
+      </section>
+      <p className="scene-body__evidence">{scene.evidencePointer}</p>
+    </>
+  );
+};