create-ailk 0.1.0 → 0.2.0

package/templates/apps/web/app/[locale]/contact/__tests__/ConversationalIntakeWrapper.test.tsx

@@ -0,0 +1,242 @@
+/**
+ * Tests for ConversationalIntakeWrapper (#4534, epic #4521's integration
+ * leg).
+ *
+ * AC1 (integration test) — a completed conversation lands a lead through
+ *   the EXISTING lead-capture endpoint. Only the outermost network
+ *   boundary is mocked (`@working-theory/api-client`'s `leads.submit`) —
+ *   the REAL `ConversationalIntake` block (#4543) and its engine (#4532),
+ *   the REAL `captureLeadAction` (the SAME action `<ContactForm/>` already
+ *   uses), and the REAL `submitLeadInputSchema` validation all run, proving
+ *   the whole chain end to end. No file under apps/api is imported, mocked,
+ *   or touched by this test or by the wiring it exercises.
+ * AC2 — Skip renders the existing form, carrying over answers already
+ *   captured as `initialValues`.
+ * AC3 — per-turn abandonment analytics: `recordIntakeTurn`
+ *   (`./intake-analytics.ts`, mocked at the `track()` boundary) fires once
+ *   per turn with an increasing `turnIndex`, plus one terminal call tagging
+ *   the outcome.
+ */
+import { act, fireEvent, render, screen } from "@testing-library/react";
+
+jest.mock("next-intl", () => ({
+  useTranslations: () => (key: string) => key,
+  useLocale: () => "en",
+  useMessages: () => ({}),
+}));
+
+jest.mock("@working-theory/api-client", () => ({
+  leads: {
+    submit: jest.fn(),
+  },
+}));
+
+jest.mock("@working-theory/analytics/server", () => ({
+  track: jest.fn().mockResolvedValue(undefined),
+}));
+
+// ConversationalIntakeWrapper's own responsibility under test here is the
+// submission/skip/analytics wiring around the block — not ContactForm's own
+// rendering, which apps/web's existing tests already document as crashing
+// in jsdom (useFormState/useFormStatus; see page-renderer-migration.test.tsx).
+// Narrow internal-module mock, same precedent as that file's ContactForm stub.
+// eslint-disable-next-line no-restricted-syntax -- test-seam mock required; ContactForm uses useFormState/useFormStatus which crash in jsdom (see page-renderer-migration.test.tsx); narrowest possible scope
+jest.mock("../ContactForm", () => ({
+  ContactForm: (props: { initialValues?: Record<string, string> }) =>
+    require("react").createElement("div", {
+      "data-testid": "contact-form-stub",
+      "data-initial-values": JSON.stringify(props.initialValues ?? {}),
+    }),
+}));
+
+import { leads } from "@working-theory/api-client";
+import { track } from "@working-theory/analytics/server";
+
+import { ConversationalIntakeWrapper } from "../ConversationalIntakeWrapper.js";
+
+const mockSubmit = leads.submit as jest.Mock;
+const mockTrack = track as jest.Mock;
+
+const TEST_ID = "contact-conversational-intake";
+
+beforeEach(() => {
+  jest.useFakeTimers();
+});
+
+afterEach(() => {
+  act(() => {
+    jest.runOnlyPendingTimers();
+  });
+  jest.useRealTimers();
+  jest.clearAllMocks();
+});
+
+/** Advances past the thinking pause (600–900ms) and flushes the reveal. */
+function advanceThinking(): void {
+  act(() => {
+    jest.advanceTimersByTime(1000);
+  });
+}
+
+/**
+ * Flushes the microtask queue — needed after a turn transition that
+ * triggers an async Server Action call (`onComplete`'s `await
+ * captureLeadAction(...)`), whose own state updates (fallback to the form,
+ * the submit-error message) land a tick after the timer-driven reveal
+ * `advanceThinking()` already flushed.
+ */
+async function flushMicrotasks(): Promise<void> {
+  await act(async () => {
+    await Promise.resolve();
+    await Promise.resolve();
+  });
+}
+
+function answer(text: string): void {
+  const input = screen.getByTestId(`${TEST_ID}-free-text-input`);
+  fireEvent.change(input, { target: { value: text } });
+  fireEvent.click(screen.getByTestId(`${TEST_ID}-free-text-submit`));
+}
+
+describe("ConversationalIntakeWrapper — completion (AC1)", () => {
+  it("submits through the existing lead-capture endpoint's api-client surface", () => {
+    mockSubmit.mockResolvedValue({
+      ok: true,
+      body: { id: "lead_abc123", persisted: "db" },
+    });
+
+    render(<ConversationalIntakeWrapper />);
+    advanceThinking(); // turn 1 (name) revealed
+
+    answer("Jane Smith");
+    advanceThinking(); // turn 2 (message) revealed
+
+    answer("I'd like a demo.");
+    advanceThinking(); // turn 3 (email) revealed
+
+    answer("jane@example.com");
+    advanceThinking(); // completion revealed, onComplete fires
+
+    expect(mockSubmit).toHaveBeenCalledTimes(1);
+    const body = mockSubmit.mock.calls[0][0] as {
+      siteId: string;
+      source: string;
+      email: string;
+      payload: { name: string; message?: string };
+    };
+    expect(body.siteId).toBe("default");
+    expect(body.source).toBe("conversational-intake");
+    expect(body.email).toBe("jane@example.com");
+    expect(body.payload.name).toBe("Jane Smith");
+    expect(body.payload.message).toBe("I'd like a demo.");
+
+    // The block stays mounted on success — its own completion message is
+    // already the confirmation; no fallback form appears.
+    expect(screen.queryByTestId("contact-form-stub")).toBeNull();
+  });
+
+  it("falls back to the existing form, prefilled, when the submit fails", async () => {
+    mockSubmit.mockResolvedValue({ ok: false, status: 503, body: {} });
+
+    render(<ConversationalIntakeWrapper />);
+    advanceThinking();
+    answer("Jane Smith");
+    advanceThinking();
+    answer("I'd like a demo.");
+    advanceThinking();
+    answer("jane@example.com");
+    advanceThinking();
+    await flushMicrotasks();
+
+    const stub = screen.getByTestId("contact-form-stub");
+    const initialValues = JSON.parse(
+      stub.getAttribute("data-initial-values") ?? "{}",
+    );
+    expect(initialValues).toMatchObject({
+      name: "Jane Smith",
+      email: "jane@example.com",
+      message: "I'd like a demo.",
+    });
+    expect(
+      screen.getByTestId("contact-intake-submit-error"),
+    ).toBeInTheDocument();
+  });
+});
+
+describe("ConversationalIntakeWrapper — Skip (AC2)", () => {
+  it("renders the existing form on Skip, carrying over the answers captured so far", () => {
+    render(<ConversationalIntakeWrapper />);
+    advanceThinking(); // turn 1 (name) revealed
+
+    answer("Jane Smith");
+    advanceThinking(); // turn 2 (message) revealed
+
+    fireEvent.click(screen.getByTestId(`${TEST_ID}-skip`));
+    advanceThinking(); // skip message revealed, onSkip fires
+
+    const stub = screen.getByTestId("contact-form-stub");
+    const initialValues = JSON.parse(
+      stub.getAttribute("data-initial-values") ?? "{}",
+    );
+    expect(initialValues).toMatchObject({ name: "Jane Smith" });
+    expect(mockSubmit).not.toHaveBeenCalled();
+  });
+});
+
+describe("ConversationalIntakeWrapper — per-turn abandonment analytics (AC3)", () => {
+  it("fires one in_progress event per turn, then a terminal completed event, with increasing turnIndex", () => {
+    mockSubmit.mockResolvedValue({
+      ok: true,
+      body: { id: "lead_abc123", persisted: "db" },
+    });
+
+    render(<ConversationalIntakeWrapper />);
+    advanceThinking();
+    answer("Jane Smith");
+    advanceThinking();
+    answer("I'd like a demo.");
+    advanceThinking();
+    answer("jane@example.com");
+    advanceThinking();
+
+    const calls = mockTrack.mock.calls.map(([name, props]) => ({
+      name,
+      ...(props as { turnIndex: number; status: string; locale: string }),
+    }));
+
+    expect(calls.every((c) => c.name === "intake-turn-abandonment")).toBe(
+      true,
+    );
+    const inProgress = calls.filter((c) => c.status === "in_progress");
+    expect(inProgress.map((c) => c.turnIndex)).toEqual([1, 2, 3, 4]);
+
+    const terminal = calls[calls.length - 1];
+    expect(terminal).toMatchObject({ status: "completed", turnIndex: 4 });
+
+    // PII-free: only turnIndex/status/locale ever leave the client.
+    for (const call of mockTrack.mock.calls) {
+      const props = call[1] as Record<string, unknown>;
+      expect(Object.keys(props).sort()).toEqual(
+        ["turnIndex", "status", "locale"].sort(),
+      );
+    }
+  });
+
+  it("tags an abandoned (skipped) session with the turn it stopped at", () => {
+    render(<ConversationalIntakeWrapper />);
+    advanceThinking();
+    answer("Jane Smith");
+    advanceThinking();
+
+    fireEvent.click(screen.getByTestId(`${TEST_ID}-skip`));
+    advanceThinking();
+
+    const calls = mockTrack.mock.calls.map(([, props]) => props) as Array<{
+      status: string;
+      turnIndex: number;
+    }>;
+    const terminal = calls[calls.length - 1];
+    expect(terminal).toMatchObject({ status: "skipped" });
+    expect(terminal?.turnIndex).toBeGreaterThan(0);
+  });
+});

package/templates/apps/web/app/[locale]/contact/__tests__/contact.actions.test.ts

@@ -149,4 +149,33 @@ describe("captureLeadAction — API error", () => {
       message: expect.any(String),
     });
   });
+
+  // #4042 — the catch-all previously discarded a thrown error silently,
+  // leaving zero server-side trace of a production integration failure.
+  it("logs the thrown error server-side with a [captureLeadAction] prefix, with no PII from the submitted fields", async () => {
+    const thrown = new Error("Network error");
+    mockSubmit.mockRejectedValueOnce(thrown);
+    const consoleErrorSpy = jest
+      .spyOn(console, "error")
+      .mockImplementation(() => undefined);
+
+    const result = await captureLeadAction(
+      INITIAL_STATE,
+      makeFormData(VALID_FIELDS),
+    );
+
+    expect(consoleErrorSpy).toHaveBeenCalledWith("[captureLeadAction]", thrown);
+    const loggedArgs = consoleErrorSpy.mock.calls.flat();
+    for (const value of Object.values(VALID_FIELDS)) {
+      for (const arg of loggedArgs) {
+        expect(String(arg)).not.toContain(value);
+      }
+    }
+    expect(result).toMatchObject({
+      kind: "error",
+      message: expect.any(String),
+    });
+
+    consoleErrorSpy.mockRestore();
+  });
 });

package/templates/apps/web/app/[locale]/contact/__tests__/intake-analytics.test.ts

@@ -0,0 +1,51 @@
+/**
+ * Tests for intake-analytics.ts's recordIntakeTurn (#4534, epic #4521's
+ * integration leg).
+ *
+ * Acceptance criteria verified here:
+ * - recordIntakeTurn calls track() with the turn index + status + locale.
+ * - Never leaks answer text (PII-free per AC3).
+ */
+
+jest.mock("@working-theory/analytics/server", () => ({
+  track: jest.fn().mockResolvedValue(undefined),
+}));
+
+import { track } from "@working-theory/analytics/server";
+
+import { recordIntakeTurn } from "../intake-analytics.js";
+
+const mockTrack = track as jest.Mock;
+
+afterEach(() => {
+  jest.clearAllMocks();
+});
+
+describe("recordIntakeTurn", () => {
+  it("reports the turn index, status, and locale — nothing else", async () => {
+    await recordIntakeTurn({
+      turnIndex: 2,
+      status: "in_progress",
+      locale: "en",
+    });
+
+    expect(mockTrack).toHaveBeenCalledWith("intake-turn-abandonment", {
+      turnIndex: 2,
+      status: "in_progress",
+      locale: "en",
+    });
+  });
+
+  it("never receives answer text (PII-free)", async () => {
+    await recordIntakeTurn({
+      turnIndex: 3,
+      status: "completed",
+      locale: "en",
+    });
+
+    const props = mockTrack.mock.calls[0][1] as Record<string, unknown>;
+    expect(Object.keys(props).sort()).toEqual(
+      ["turnIndex", "status", "locale"].sort(),
+    );
+  });
+});

package/templates/apps/web/app/[locale]/contact/__tests__/page-renderer-migration.test.tsx

@@ -1,29 +1,50 @@
 /**
  * HTML snapshot regression tests for contact/page.tsx → @working-theory/page-renderer migration.
  *
- * Contact uses sections mode (not bodyMode: "mdx-body") with a ContactForm wrapper:
- *   <>{renderPage output}<ContactForm /></>
+ * Contact uses sections mode (not bodyMode: "mdx-body") with a
+ * ConversationalIntakeWrapper wrapper:
+ *   <>{renderPage output}<ConversationalIntakeWrapper /></>
  *
  * Two-commit strategy:
  *   Commit 1: this file added; snapshots captured against pre-migration route (RED-passing).
  *   Commit 2: route migrated; same snapshots verify diff=0 (GREEN).
  *
+ * #4534 (epic #4521's integration leg) swapped the page's direct
+ * `<ContactForm/>` mount for `<ConversationalIntakeWrapper/>` (which itself
+ * renders the existing ContactForm on Skip or a failed auto-submit — see
+ * that component's own doc-comment). The mock below + the snapshots'
+ * `contact-form-stub` testid moved with it, deliberately — this is the one
+ * legitimate case the file's own "DO NOT regenerate to pass" warning
+ * doesn't cover: the page's actual composition changed, not the renderer.
+ *
  * Two states tested:
- *   - empty: getMdxSource returns null → renderPage empty-state + ContactForm present
- *   - populated: getMdxSource returns populated source → renderPage sections + ContactForm present
+ *   - empty: getMdxSource returns null → renderPage empty-state + wrapper present
+ *   - populated: getMdxSource returns populated source → renderPage sections + wrapper present
  *
- * Note on ContactForm in tests: ContactForm is a "use client" component that uses
- * useFormState/useFormStatus hooks. jsdom does not support these hooks. The component
- * renders as an opaque stub via the next-intl and react-dom mocks below. The snapshot
- * asserts the ContactForm component is present in the output (non-null).
+ * Note on ConversationalIntakeWrapper in tests: it composes ContactForm
+ * (skip/fallback surface), which is a "use client" component using
+ * useFormState/useFormStatus hooks — jsdom does not support these hooks.
+ * The wrapper renders as an opaque stub via the next-intl and react-dom
+ * mocks below. The snapshot asserts the wrapper is present in the output
+ * (non-null).
  *
- * Failure = snapshot diff > 0 bytes. DO NOT regenerate snapshots to pass.
+ * Failure = snapshot diff > 0 bytes beyond the deliberate #4534 rename.
  */
 import React from "react";
 import { render } from "@testing-library/react";
 
 // ── @working-theory/ui mock ─────────────────────────────────────────────────────────────
 jest.mock("@working-theory/ui", () => ({
+  // #4446/#4447: renderPage's own fallback/empty-state title now composes
+  // Heading (mobile type-budget classes, #4417) instead of a bare <h1>.
+  Heading: ({
+    children,
+    level,
+  }: {
+    children: React.ReactNode;
+    level: number;
+  }): React.ReactElement =>
+    React.createElement(`h${level}`, null, children),
   SectionRenderer: ({ sections }: { sections: unknown[] }) =>
     React.createElement("div", {
       "data-testid": "section-renderer",
@@ -31,12 +52,15 @@ jest.mock("@working-theory/ui", () => ({
     }),
 }));
 
-// ── ContactForm mock ──────────────────────────────────────────────────────────
-// ContactForm is "use client" and uses useFormState/useFormStatus. Mock it as a
-// deterministic stub so the snapshot is stable.
-// eslint-disable-next-line no-restricted-syntax -- test-seam mock required; ContactForm uses useFormState/useFormStatus which crash in jsdom; internal-module mock is the narrowest possible scope; tracked in #507
-jest.mock("../ContactForm", () => ({
-  ContactForm: () =>
+// ── ConversationalIntakeWrapper mock ────────────────────────────────────────
+// ConversationalIntakeWrapper composes ContactForm ("use client",
+// useFormState/useFormStatus — crashes in jsdom) as its skip/fallback
+// surface. Mock the wrapper itself as a deterministic stub so the snapshot
+// is stable; the wrapper's own submission/skip/analytics wiring is covered
+// by ConversationalIntakeWrapper.test.tsx.
+// eslint-disable-next-line no-restricted-syntax -- test-seam mock required; composes ContactForm, which uses useFormState/useFormStatus that crash in jsdom; internal-module mock is the narrowest possible scope; tracked in #507
+jest.mock("../ConversationalIntakeWrapper", () => ({
+  ConversationalIntakeWrapper: () =>
     React.createElement("div", { "data-testid": "contact-form-stub" }),
 }));
 

package/templates/apps/web/app/[locale]/contact/contact.actions.ts

@@ -4,13 +4,24 @@
  * captureLeadAction — Server Action paired with ailkCaptureLead MCP tool.
  *
  * Validates contact-form input with submitLeadInputSchema (shared schema per
- * ADR 0013), calls POST /api/leads/submit via @working-theory/api-client, and returns
+ * ADR 0013), calls POST /v1/leads/submit via @working-theory/api-client, and returns
  * a discriminated ActionResult suitable for useFormState.
  *
  * Canonical filename: contact.actions.ts (*.actions.ts per ADR 0013 / U0 spec
  * parity-test regex `ACTION_FILE_RE = /\.actions\.ts$/`).
  *
  * Honeypot + rate-limit enforcement lives in apps/api; no duplication here.
+ *
+ * `source` (#4534, epic #4521's integration leg): an optional hidden
+ * FormData field so `ConversationalIntakeWrapper` can tag leads it submits
+ * as `"conversational-intake"` rather than the plain form's `"web"` —
+ * reusing this SAME action (built imperatively from the conversation's
+ * answers via `new FormData()`, not a real `<form>` submit) instead of a
+ * second `*Action`-suffixed export, which would trip
+ * `apps/mcp/__tests__/parity.test.ts`'s Server-Action↔MCP-tool 1:1 count for
+ * a capability (lead capture) this repo already has an MCP twin for
+ * (`ailkCaptureLead`). Absent (the real `<form>` never sets it) → defaults
+ * to `"web"`, unchanged from before.
  */
 
 import { leads } from "@working-theory/api-client";
@@ -50,9 +61,10 @@ export async function captureLeadAction(
 
   const { name, email, message, phone } = parsed.data;
   const siteId = process.env.AILK_SITE_ID ?? "default";
+  const source = (formData.get("source") as string | null) || "web";
   const body = {
     siteId,
-    source: "web",
+    source,
     email,
     payload: {
       name,
@@ -70,7 +82,13 @@ export async function captureLeadAction(
       };
     }
     return { kind: "success" };
-  } catch {
+  } catch (err) {
+    // Log server-side for observability (#4042, sibling of flow.actions.ts's
+    // #3989 fix). The api-client's post() never attaches the request payload
+    // to a thrown error (packages/api-client/src/http.ts), so logging `err`
+    // itself is safe — no submitted form fields (name/email/message/phone)
+    // are included.
+    console.error("[captureLeadAction]", err);
     return {
       kind: "error",
       message: "Something went wrong, please try again.",

package/templates/apps/web/app/[locale]/contact/intake-analytics.ts

@@ -0,0 +1,49 @@
+"use server";
+
+/**
+ * intake-analytics.ts — per-turn abandonment analytics for
+ * ConversationalIntakeWrapper (#4534, epic #4521's integration leg).
+ *
+ * `recordIntakeTurn` fires `track()` (`@working-theory/analytics/server`,
+ * the same fire-and-forget helper `apps/api/src/routes/leads/index.ts`
+ * already uses for "lead-captured") once per conversation turn, tagged with
+ * the turn index and the engine status as of that turn. A session's last
+ * "intake-turn-abandonment" event with `status: "in_progress"` marks the
+ * turn it stopped progressing past — the standard step-funnel shape for
+ * computing per-turn abandonment, without needing a bespoke "abandoned"
+ * signal (tab-close is indistinguishable from "still reading" client-side;
+ * the downstream analytics consumer infers abandonment from the absence of
+ * a later "completed"/"skipped" event for the session). PII-free by
+ * construction: only the turn index, status, and locale ever leave the
+ * client — never the answer text (honesty-by-design applies to what we
+ * track, too).
+ *
+ * Deliberately NOT named `recordIntakeTurnAction` / kept OUT of a
+ * `*.actions.ts` file: this is telemetry, not a business-capability Server
+ * Action, and `apps/mcp/__tests__/parity.test.ts` counts every
+ * `*.actions.ts` export matching `^[a-z][a-zA-Z0-9]*Action$` as one half of
+ * a Server-Action↔MCP-tool pair it expects to find a twin for — there is no
+ * (and should be no) `ailkRecordIntakeTurn` MCP tool, since this reports a
+ * pageview-shaped web-analytics event, not a capability an agent invokes.
+ */
+
+import { track } from "@working-theory/analytics/server";
+
+/**
+ * The conversation's status as of the turn being reported. `"in_progress"`
+ * fires once per turn while the conversation is ongoing (including turn 1,
+ * on mount); `"completed"`/`"skipped"` fire once, at the terminal turn.
+ */
+export type IntakeTurnStatus = "in_progress" | "completed" | "skipped";
+
+export async function recordIntakeTurn(input: {
+  turnIndex: number;
+  status: IntakeTurnStatus;
+  locale?: string;
+}): Promise<void> {
+  await track("intake-turn-abandonment", {
+    turnIndex: input.turnIndex,
+    status: input.status,
+    locale: input.locale,
+  });
+}

package/templates/apps/web/app/[locale]/contact/intake-script.ts

@@ -0,0 +1,66 @@
+/**
+ * buildContactIntakeScript — the authored `IntakeScript` for the contact
+ * page's `ConversationalIntakeWrapper` (#4534, epic #4521's integration
+ * leg).
+ *
+ * Three open questions, deliberately keyed `name` / `message` / `email` —
+ * the SAME field names `submitLeadInputSchema` (packages/validation)
+ * expects. `ConversationalIntakeWrapper` reads `IntakeEngineState.answers`
+ * by these exact ids to build the `FormData` it hands to the existing
+ * `captureLeadAction` (`./contact.actions.ts`), so the script's question
+ * ids ARE the submission adapter's field-mapping contract; renaming a
+ * question id here requires updating that mapping too.
+ *
+ * Copy is translated (next-intl "contact" namespace, "intake.*" keys —
+ * see apps/web/messages/en.json) rather than hardcoded, consistent with
+ * ContactForm's own `useTranslations("contact")` usage. The wrapper resolves
+ * the strings via its own scoped translator and passes them in as plain
+ * data (`ContactIntakeCopy`) rather than passing the translator function
+ * itself — next-intl's `t` is typed to a specific literal key union per
+ * call site, which doesn't assign cleanly to a generic `(key: string) =>
+ * string` parameter; plain strings sidestep that entirely and keep this
+ * file decoupled from next-intl's types.
+ */
+import { intakeScriptSchema } from "@working-theory/validation";
+import type { IntakeScript } from "@working-theory/validation";
+
+export interface ContactIntakeCopy {
+  nameAck: string;
+  namePrompt: string;
+  messageAck: string;
+  messagePrompt: string;
+  emailAck: string;
+  emailPrompt: string;
+  skipMessage: string;
+  completionMessage: string;
+}
+
+export function buildContactIntakeScript(
+  copy: ContactIntakeCopy,
+): IntakeScript {
+  return intakeScriptSchema.parse({
+    slug: "contact-intake",
+    questions: [
+      {
+        id: "name",
+        kind: "open",
+        acknowledgement: copy.nameAck,
+        prompt: copy.namePrompt,
+      },
+      {
+        id: "message",
+        kind: "open",
+        acknowledgement: copy.messageAck,
+        prompt: copy.messagePrompt,
+      },
+      {
+        id: "email",
+        kind: "open",
+        acknowledgement: copy.emailAck,
+        prompt: copy.emailPrompt,
+      },
+    ],
+    skip: { message: copy.skipMessage },
+    completion: { message: copy.completionMessage },
+  });
+}

package/templates/apps/web/app/[locale]/contact/page.tsx

@@ -1,13 +1,16 @@
 // Contact page. Renders sections via renderPage (sections mode) then appends
-// ContactForm as a wrapper. JSON-LD and translations handled by renderPage.
+// ConversationalIntakeWrapper — the chat-style intake (#4534, epic #4521's
+// integration leg), which itself renders the existing ContactForm on Skip
+// or a failed auto-submit. JSON-LD and translations handled by renderPage.
 import type {
   getMdxSource as defaultGetMdxSource,
   getPageSections as defaultGetPageSections,
 } from "@working-theory/page-renderer";
-import { renderPage } from "@working-theory/page-renderer";
+import { renderPage, renderPageMetadata } from "@working-theory/page-renderer";
+import type { Metadata } from "next";
 import type { ReactElement } from "react";
 
-import { ContactForm } from "./ContactForm";
+import { ConversationalIntakeWrapper } from "./ConversationalIntakeWrapper";
 
 interface Props {
   params: Promise<{ locale: string }>;
@@ -15,6 +18,13 @@ interface Props {
   getPageSections?: typeof defaultGetPageSections;
 }
 
+export async function generateMetadata({
+  params,
+}: Pick<Props, "params">): Promise<Metadata> {
+  const { locale } = await params;
+  return renderPageMetadata({ type: "ContactPage", slug: "contact", locale });
+}
+
 export default async function Page({
   params,
   getMdxSource,
@@ -32,7 +42,7 @@ export default async function Page({
   return (
     <>
       {rendered}
-      <ContactForm />
+      <ConversationalIntakeWrapper />
     </>
   );
 }

package/templates/apps/web/app/[locale]/courses/[slug]/page.tsx

@@ -1,7 +1,12 @@
 // Course detail page. Reads the Course MDX for the given slug, renders via
 // @working-theory/page-renderer, and emits a JSON-LD <script>. Unknown slugs trigger 404.
 import type { getMdxSource as defaultGetMdxSource } from "@working-theory/page-renderer";
-import { getMdxSlugs, renderPage } from "@working-theory/page-renderer";
+import {
+  getMdxSlugs,
+  renderPage,
+  renderPageMetadata,
+} from "@working-theory/page-renderer";
+import type { Metadata } from "next";
 import type { ReactElement } from "react";
 
 interface Props {
@@ -9,6 +14,13 @@ interface Props {
   getMdxSource?: typeof defaultGetMdxSource;
 }
 
+export async function generateMetadata({
+  params,
+}: Pick<Props, "params">): Promise<Metadata> {
+  const { locale, slug } = await params;
+  return renderPageMetadata({ type: "Course", slug, locale });
+}
+
 export async function generateStaticParams({
   params,
 }: {