create-ailk 0.4.0 → 0.6.0

package/templates/apps/web/app/[locale]/layout.tsx

@@ -4,6 +4,7 @@
 // Chrome extract — Nav + Footer from @working-theory/ui (#1451)
 // Shell/Chrome composition — Nav + Footer wrap via @working-theory/templates MarketingShell (#2820)
 // Session-aware Nav actions — Sign in / Account + Sign out from the server-read session (#4984)
+// Auth route group — the marketing chrome is dropped on the five (auth) paths (#5963)
 // Site-declared theme — `_site.mdx` `theme:` block → token overlay → CSS vars
 //
 // Sits under app/[locale]/ and sets the <html lang> attribute to the
@@ -25,8 +26,10 @@ import "../globals.css";
 import { Telemetry, VerificationMeta } from "@working-theory/analytics";
 import { MarketingShell } from "@working-theory/templates/shells";
 import { themeToCssVarsBothModes } from "@working-theory/theme";
-import { isRtl } from "@working-theory/ui";
+import { Link, isRtl, localeHref } from "@working-theory/ui";
+import { LocaleSwitcherNav } from "@working-theory/ui/blocks";
 import {
+  Banner,
   Footer,
   Nav,
   type NavAction,
@@ -46,9 +49,11 @@ import type { ReactElement, ReactNode } from "react";
 import { auth } from "../../auth";
 import { GoogleAnalytics } from "../../components/google-analytics";
 import { SignOutTrigger } from "../../components/sign-out-trigger";
+import { isAuthPath } from "../../lib/auth-routes";
 import { navItems } from "../../lib/nav-config";
 import { getOgImageUrl } from "../../lib/og";
 import { SITE_NAME, siteLogo } from "../../lib/site-brand";
+import { siteChrome } from "../../lib/site-chrome";
 import { loadSiteBrandTokens } from "../../lib/site-theme";
 import { resolveBaseUrl } from "../../src/lib/routes";
 
@@ -57,6 +62,12 @@ import { resolveBaseUrl } from "../../src/lib/routes";
 const DEFAULT_LOCALE = "en";
 const THEME_COOKIE_NAME =
   process.env.NEXT_PUBLIC_THEME_COOKIE_NAME ?? "ailk-theme";
+/**
+ * The cookie the consent island persists the visitor's choice under (#5557).
+ * Passed to Banner explicitly so the server-side read below and the island's
+ * client-side write name the same cookie by construction.
+ */
+const CONSENT_COOKIE_NAME = "ailk-consent";
 
 type ThemeMode = "light" | "dark";
 
@@ -73,7 +84,9 @@ type ThemeMode = "light" | "dark";
  * has to satisfy the type: one minimal fields-step and a dead `action`.
  */
 const NAV_CLIENT_ACTION_FLOW: NavActionFlow["flow"] = {
-  steps: [{ id: "noop", fields: [{ name: "noop", label: "noop", type: "text" }] }],
+  steps: [
+    { id: "noop", fields: [{ name: "noop", label: "noop", type: "text" }] },
+  ],
   action: "#",
 };
 
@@ -100,6 +113,26 @@ async function resolveThemeMode(): Promise<ThemeMode> {
   }
 }
 
+/**
+ * Whether this visitor has already accepted or declined cookies (#5557).
+ *
+ * Read on the server, not left to the island alone: `BannerConsentIsland`
+ * initialises its `consented` state from `document.cookie`, which makes the
+ * CLIENT render null while the SERVER (no `document`) has already streamed
+ * the banner — React then leaves that server markup in place, un-hydrated, so
+ * a returning visitor sees a dead banner whose buttons do nothing. Deciding
+ * here means a decided visitor gets no banner markup at all, and a fresh one
+ * gets the live island that hides itself on Accept / Reject.
+ */
+async function hasConsentChoice(): Promise<boolean> {
+  try {
+    const cookieStore = await cookies();
+    return cookieStore.get(CONSENT_COOKIE_NAME)?.value !== undefined;
+  } catch {
+    return false;
+  }
+}
+
 /**
  * Blocking inline script that runs synchronously before any styled element.
  *
@@ -177,6 +210,7 @@ export default async function LocaleLayout({
   const { locale } = await params;
   const messages = await getMessages();
   const themeMode = await resolveThemeMode();
+  const consentDecided = await hasConsentChoice();
   // Server-side session read (#4984) — the same `auth.api.getSession` idiom
   // the `(authed)` segment guard uses. Null when signed out or auth is unset.
   const session = await auth.api.getSession({ headers: await headers() });
@@ -187,12 +221,26 @@ export default async function LocaleLayout({
   const navLabels = {
     items: {
       home: tNav("home"),
+      // The Free marketing-site chrome (#5469 D5): the Product flyout's three
+      // entries + descriptions, the top-level items, and the Get started CTA.
+      product: tNav("product"),
+      howItWorks: tNav("howItWorks"),
+      howItWorksDesc: tNav("howItWorksDesc"),
+      features: tNav("features"),
+      featuresDesc: tNav("featuresDesc"),
+      faq: tNav("faq"),
+      faqDesc: tNav("faqDesc"),
+      pricing: tNav("pricing"),
+      about: tNav("about"),
+      getStarted: tNav("getStarted"),
       docs: tNav("docs"),
       blog: tNav("blog"),
-      // The scheduling module's booking page (#4633). Present in the map
-      // unconditionally, like `docs` and `blog`: the map is a label lookup, and
-      // an entry for a surface this site did not scaffold is never reached —
-      // `nav-config.ts` only lists surfaces the declared architecture carries.
+      // The scheduling module's booking page, /meet (#4633; renamed from the
+      // schedule/ route by #5563 — the label key itself keeps its name, D1
+      // R2: it names copy, not a route). Present in the map unconditionally,
+      // like `docs` and `blog`: the map is a label lookup, and an entry for
+      // a surface this site did not scaffold is never reached — `nav-config.ts`
+      // only lists surfaces the declared architecture carries.
       schedule: tNav("schedule"),
       // Session-aware action labels (#4984). `account` carries the signed-in
       // user's display name (name, else email) so the Nav shows WHO is signed
@@ -207,8 +255,13 @@ export default async function LocaleLayout({
     closeMenu: tNav("closeMenu"),
   };
   const navOverflowLabel = tNav("moreLinks");
+  // Cookie-consent copy (#5557). The `consent` namespace ships in every
+  // scaffold's messages file; the Banner below is UI-only — OSS ships no
+  // enforcement, the callbacks are the hook for @working-theory/consent.
+  const tConsent = await getTranslations({ locale, namespace: "consent" });
 
-  // Right-side action cluster (#4984). Signed out → a single outline-strong
+  // Right-side action cluster (#4984). Signed out → the Free template's pair
+  // (#5469 D5): a primary "Get started" → /contact beside the outline-strong
   // "Sign in" link (the operator's auth-pair idiom, #4370, MINUS Sign up —
   // this site offers no sign-up flow). Signed in → the user's name (a
   // non-navigating label) + an outline-strong "Sign out"; both authored as
@@ -224,7 +277,10 @@ export default async function LocaleLayout({
           variant: "outline-strong",
         },
       ]
-    : [{ labelKey: "signIn", path: "/sign-in", variant: "outline-strong" }];
+    : [
+        { labelKey: "getStarted", path: "/contact", variant: "primary" },
+        { labelKey: "signIn", path: "/sign-in", variant: "outline-strong" },
+      ];
 
   // Only compose the flow seam when there is a flow action to compose. This
   // layout is a Server Component and `renderFlowTrigger` is a function, so
@@ -237,8 +293,79 @@ export default async function LocaleLayout({
   // this is the caller half of that contract.
   const hasFlowAction = navActions.some((action) => action.kind === "flow");
 
-  // Shared brand mark injected into both Nav and Footer chrome slots.
+  // Shared brand mark injected into both Nav and Footer chrome slots. The
+  // mark comes from site-brand.tsx (the light/dark pair the /sign-in card
+  // also renders); the Nav adds the shipped wordmark beside it so BrandLogo
+  // composes mark + wordmark on desktop and mark-only below `md` (#5469 D5).
   const brandLogo = siteLogo();
+  const brandWordmark = {
+    src: "/wordmark.svg",
+    alt: SITE_NAME,
+    width: 140,
+    height: 16,
+  };
+
+  // The locales the footer's language switcher offers — the same list the
+  // middleware and hreflang alternates read (NEXT_PUBLIC_ENABLED_LOCALES).
+  const enabledLocales = readLocales();
+
+  // The announcement bar is HOME-ONLY (#5469 D5): its route gate matches the
+  // pathname literally, and under next-intl's `as-needed` prefixing the home
+  // path is `/` for the default locale and `/<locale>` for every other one.
+  const homePath = locale === DEFAULT_LOCALE ? "/" : `/${locale}`;
+
+  // Deck home (#5612 D3): `siteChrome.home === "deck"` only ever applies
+  // `snap="mandatory"` + `deckHero` on the locale-root route — every other
+  // path renders byte-identically regardless of the knob. `x-pathname` is the
+  // same header `generateMetadata` above reads (forwarded by middleware.ts);
+  // Next.js's `headers()` is request-scoped and cheap to call again here.
+  const pathname = (await headers()).get("x-pathname") ?? homePath;
+  const isDeckHome = siteChrome.home === "deck" && pathname === homePath;
+
+  // The (auth) route group's chrome branch (#5963).
+  //
+  // A route group's layout nests INSIDE its parent segment's layout, so
+  // `(auth)/layout.tsx` renders BETWEEN the Nav and the Footer below — a group
+  // changes which siblings share a layout, it does not let a child escape an
+  // ancestor. The only place the marketing frame can be dropped for those five
+  // paths is here, where it is composed.
+  //
+  // Fail-safe direction: `isAuthPath()` answers false for an absent
+  // `x-pathname`, so a missing header can never strip a marketing page's
+  // chrome; the worst case is an auth page rendered WITH chrome, which the
+  // group's own suite catches. The marketing tree is NOT restructured into a
+  // `(marketing)` group — a ~35-directory move for a five-page delta (spec D1).
+  const isAuthRoute = isAuthPath(pathname, enabledLocales);
+
+  // Placeholder social handles + copyright (#5469 D5): `{{COMPANY_HANDLE}}` /
+  // `{{COMPANY_NAME}}` are create-ailk markers substituted at scaffold time
+  // (packages/create-ailk/src/programmatic.ts), so a customer's site never
+  // carries the kit vendor's own identity here. The year is computed, never
+  // typed, so the placeholder does not go stale.
+  const socialLinks = [
+    { platform: "facebook", href: "https://facebook.com/{{COMPANY_HANDLE}}" },
+    { platform: "instagram", href: "https://instagram.com/{{COMPANY_HANDLE}}" },
+    { platform: "x", href: "https://x.com/{{COMPANY_HANDLE}}" },
+    {
+      platform: "linkedin",
+      href: "https://linkedin.com/company/{{COMPANY_HANDLE}}",
+    },
+    { platform: "youtube", href: "https://youtube.com/@{{COMPANY_HANDLE}}" },
+  ] as const;
+  const copyrightText = `© ${new Date().getFullYear()} {{COMPANY_NAME}}`;
+
+  // Footer legal links (#5612 D3). The centered variant folds in FAQ — the
+  // roster's third always-scaffolded core route (`/faq`, alongside `/privacy`
+  // and `/terms`) — since a mark-only nav (its usual pairing, #5589) has
+  // nowhere else on the page linking it. The default `columns` footer keeps
+  // exactly today's two-entry list, byte-identical.
+  const legalLinks = [
+    { label: "Privacy Policy", href: "/privacy" },
+    { label: "Terms of Service", href: "/terms" },
+    ...(siteChrome.footer === "centered"
+      ? [{ label: navLabels.items.faq, href: "/faq" }]
+      : []),
+  ];
 
   // The site's own declared colours, read from `content/_site.mdx`'s `theme:`
   // block and translated from that customer-facing vocabulary onto a token
@@ -257,7 +384,11 @@ export default async function LocaleLayout({
   );
 
   return (
-    <html lang={locale} dir={isRtl(locale) ? "rtl" : "ltr"} data-theme={themeMode}>
+    <html
+      lang={locale}
+      dir={isRtl(locale) ? "rtl" : "ltr"}
+      data-theme={themeMode}
+    >
       <head>
         {/* Flash-prevention: runs synchronously before any styled element */}
         <script
@@ -271,10 +402,24 @@ export default async function LocaleLayout({
         />
         {/* Favicons — single brand mark (theme-independent), PNG fallbacks, ICO legacy */}
         <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
-        <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
-        <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
+        <link
+          rel="icon"
+          type="image/png"
+          sizes="32x32"
+          href="/favicon-32x32.png"
+        />
+        <link
+          rel="icon"
+          type="image/png"
+          sizes="16x16"
+          href="/favicon-16x16.png"
+        />
         <link rel="shortcut icon" href="/favicon.ico" />
-        <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
+        <link
+          rel="apple-touch-icon"
+          sizes="180x180"
+          href="/apple-touch-icon.png"
+        />
         <link rel="manifest" href="/site.webmanifest" />
         <GoogleAnalytics />
         <VerificationMeta />
@@ -292,58 +437,156 @@ export default async function LocaleLayout({
            * emitted unconditionally in OSS forks; paying customers install
            * @working-theory/branding and gate it in their own layout.
            */}
-          <MarketingShell
-            contentOwnsMain
-            nav={
-              <Nav
-                locale={locale}
-                labels={navLabels}
-                navItems={navItems}
-                siteName={SITE_NAME}
-                logo={brandLogo}
-                overflowLabel={navOverflowLabel}
-                actions={navActions}
-                {...(hasFlowAction
-                  ? {
-                      renderFlowTrigger: (action, trigger) =>
-                        action.labelKey === "signOut" ? (
-                          <SignOutTrigger>{trigger}</SignOutTrigger>
-                        ) : (
-                          <span
-                            className="text-body-sm text-(--color-text-muted)"
-                            data-testid="nav-account-name"
-                          >
-                            {navLabels.items.account}
-                          </span>
-                        ),
-                    }
-                  : {})}
-              />
-            }
-            footer={
-              <Footer
-                locale={locale}
-                itemLabels={navLabels.items}
-                navItems={navItems}
-                siteName={SITE_NAME}
-                logo={brandLogo}
-                // #4157 — deliberately left as a literal "Built with AI Launch
-                // Kit" / https://ailaunchkit.ai, not SITE_NAME: this credits
-                // the OSS TEMPLATE this site is built with (a "powered by"
-                // link, unconditional in OSS forks per the comment above),
-                // never the customer's own identity, so it isn't the vendor-
-                // brand-as-default defect #4157 fixes. See
-                // docs/specs/4157-scaffold-brand-defaults-spec.md § Design
-                // Decisions for the fuller reasoning.
-                attribution={{
-                  label: "Built with AI Launch Kit",
-                  href: "https://ailaunchkit.ai",
-                }}
-              />
-            }
-          >
-            {children}
-          </MarketingShell>
+          {isAuthRoute ? (
+            /*
+             * The (auth) branch (#5963): the five auth paths render their own
+             * `(auth)/layout.tsx` — AuthShell — with no Nav and no marketing
+             * Footer above or below it. Everything outside this ternary (the
+             * document, the flash-prevention script, the theme vars, the
+             * favicons, NextIntlClientProvider, the consent Banner and
+             * Telemetry) is shared by both branches and written once.
+             */
+            children
+          ) : (
+            <MarketingShell
+              contentOwnsMain
+              gutters="plain"
+              bannerPlacement="above-nav"
+              {...(siteChrome.announcementBanner
+                ? {
+                    banner: (
+                      <Banner
+                        variant="contrast"
+                        placement="above-nav"
+                        message="Medium length banner heading with link goes here"
+                        action={{
+                          label: "Link",
+                          href: "/pricing",
+                          kind: "link",
+                        }}
+                        routes={{ include: [homePath] }}
+                        dismissible={false}
+                        locale={locale}
+                      />
+                    ),
+                  }
+                : {})}
+              {...(isDeckHome
+                ? { snap: "mandatory" as const, deckHero: true }
+                : {})}
+              nav={
+                <Nav
+                  locale={locale}
+                  labels={navLabels}
+                  navItems={siteChrome.nav === "mark-only" ? [] : navItems}
+                  // Deck home (#5697): the two forwards that join #5426 D4 to a
+                  // real deck. `sticky` pins the bar — MarketingShell renders
+                  // {nav} as a plain child of the scroll container, so under
+                  // `scroll-snap-type: y mandatory` the browser snaps slide 1 to
+                  // the top on load and the unpinned bar is gone before the
+                  // reader touches anything. `deckMorph` is what puts BrandLogo's
+                  // `.ailk-deck-brand-mark` / `.ailk-deck-brand-wordmark` hooks in
+                  // the document for the D4 CSS to key off; it requires both
+                  // `logo` and `wordmark` (Nav.tsx:344), which the layout already
+                  // passes above. Scoped to the SAME `isDeckHome` gate
+                  // MarketingShell's snap/deckHero use, so a non-deck route's
+                  // render is byte-identical to before this branch existed.
+                  {...(isDeckHome ? { sticky: true, deckMorph: true } : {})}
+                  siteName={SITE_NAME}
+                  showThemeToggle={false}
+                  logo={brandLogo}
+                  wordmark={brandWordmark}
+                  overflowLabel={navOverflowLabel}
+                  actions={navActions}
+                  {...(hasFlowAction
+                    ? {
+                        renderFlowTrigger: (action, trigger) =>
+                          action.labelKey === "signOut" ? (
+                            <SignOutTrigger>{trigger}</SignOutTrigger>
+                          ) : (
+                            <span
+                              className="text-body-sm text-(--color-text-muted)"
+                              data-testid="nav-account-name"
+                            >
+                              {navLabels.items.account}
+                            </span>
+                          ),
+                      }
+                    : {})}
+                />
+              }
+              footer={
+                <Footer
+                  locale={locale}
+                  itemLabels={navLabels.items}
+                  navItems={navItems}
+                  siteName={SITE_NAME}
+                  logo={brandLogo}
+                  social={[...socialLinks]}
+                  {...(siteChrome.footer === "centered"
+                    ? { layout: "centered" as const }
+                    : {})}
+                  showThemeToggle
+                  copyrightText={copyrightText}
+                  legalLinks={legalLinks}
+                  languageSwitcher={
+                    <LocaleSwitcherNav
+                      current={locale}
+                      locales={enabledLocales}
+                      pathname={pathname}
+                    />
+                  }
+                  // #4157 — deliberately left as a literal "Built by Working
+                  // Theory Labs" / https://ailaunchkit.ai, not SITE_NAME: this credits
+                  // the OSS TEMPLATE this site is built with (a "powered by"
+                  // link, unconditional in OSS forks per the comment above),
+                  // never the customer's own identity, so it isn't the vendor-
+                  // brand-as-default defect #4157 fixes. See
+                  // docs/specs/4157-scaffold-brand-defaults-spec.md § Design
+                  // Decisions for the fuller reasoning.
+                  attribution={{
+                    label: "Built by Working Theory Labs",
+                    href: "https://ailaunchkit.ai",
+                  }}
+                />
+              }
+            >
+              {children}
+            </MarketingShell>
+          )}
+          {/*
+           * Cookie consent (#5557). Bottom-pinned `info` Banner in consent
+           * mode: `secondaryAction` makes Banner compose BannerConsentIsland,
+           * which reads/writes the `ailk-consent` cookie itself — a fresh
+           * visitor sees it, an accepted/declined one does not, on every
+           * page. Out of the shell's flow (placement `bottom` is a fixed
+           * overlay), so accepting causes no layout shift.
+           */}
+          {consentDecided ? null : (
+            <Banner
+              variant="info"
+              placement="bottom"
+              consentCookieName={CONSENT_COOKIE_NAME}
+              title={tConsent("title")}
+              message={
+                <>
+                  {tConsent("body")}{" "}
+                  <Link
+                    href={localeHref(locale, "/privacy")}
+                    variant="unstyled"
+                    className="font-semibold text-current underline underline-offset-4"
+                  >
+                    {tConsent("policyLinkLabel")}
+                  </Link>
+                </>
+              }
+              dismissible={false}
+              acceptLabel={tConsent("acceptLabel")}
+              secondaryAction={{ label: tConsent("rejectLabel") }}
+              rejectLabel={tConsent("rejectLabel")}
+              locale={locale}
+            />
+          )}
           <Telemetry />
         </NextIntlClientProvider>
       </body>

package/templates/apps/web/app/[locale]/purchase/__tests__/cancel.test.tsx

@@ -0,0 +1,162 @@
+/**
+ * Tests for /[locale]/purchase/cancel (#6084).
+ *
+ * D4 — reads nothing. AC-2 — states nothing was charged, links to
+ * `/services`, noindex, every string from the `purchase` namespace.
+ */
+import React from "react";
+import { render } from "@testing-library/react";
+
+jest.mock("next/navigation", () => ({
+  __esModule: true,
+  notFound: jest.fn(() => {
+    throw new Error("NEXT_NOT_FOUND");
+  }),
+}));
+
+const requestedKeys: string[] = [];
+jest.mock("next-intl/server", () => ({
+  __esModule: true,
+  getTranslations: jest.fn().mockResolvedValue((key: string) => {
+    requestedKeys.push(key);
+    return `copy:${key}`;
+  }),
+}));
+
+const capturedSections: unknown[] = [];
+jest.mock("@working-theory/ui/sections", () => ({
+  __esModule: true,
+  SectionRenderer: ({ sections }: { sections: unknown[] }) => {
+    capturedSections.splice(0, capturedSections.length, ...sections);
+    return React.createElement("div", {
+      "data-testid": "section-renderer",
+      "data-section-count": String(sections.length),
+    });
+  },
+}));
+
+const mockGetSession = jest.fn();
+jest.mock("@working-theory/api-client", () => ({
+  __esModule: true,
+  checkout: { getSession: (...args: unknown[]) => mockGetSession(...args) },
+}));
+
+// Mocks the REAL boundary `resolveCommerceClaim()` itself calls
+// (`checkLicense` from `@working-theory/license`), not the internal wrapper
+// module — matching the eslint "no internal-module mocks" rule (#507).
+const mockCheckLicense = jest.fn();
+jest.mock("@working-theory/license", () => ({
+  __esModule: true,
+  checkLicense: (...args: unknown[]) => mockCheckLicense(...args),
+}));
+
+// `../../../../src/lib/commerce-sections` wraps a lazy, webpack-ignored
+// `import()` of the paid `@working-theory/ui-commerce` package — mocked
+// directly, mirroring `../__tests__/success.test.tsx`'s identical mock.
+const mockEnsureCommerceSectionsRegistered = jest.fn();
+// eslint-disable-next-line no-restricted-syntax -- see the identical exception in success.test.tsx
+jest.mock("../../../../src/lib/commerce-sections", () => ({
+  __esModule: true,
+  ensureCommerceSectionsRegistered: () =>
+    mockEnsureCommerceSectionsRegistered(),
+}));
+
+import { notFound } from "next/navigation";
+
+import Page, { generateMetadata } from "../cancel/page";
+
+const mockNotFound = notFound as jest.MockedFunction<typeof notFound>;
+
+function sectionTypes(): string[] {
+  return capturedSections.map((s) => (s as { type: string }).type);
+}
+
+async function renderPage() {
+  const element = await Page({ params: Promise.resolve({ locale: "en" }) });
+  return render(element);
+}
+
+describe("/purchase/cancel", () => {
+  beforeEach(() => {
+    capturedSections.length = 0;
+    requestedKeys.length = 0;
+    mockGetSession.mockReset();
+    mockCheckLicense.mockReset();
+    mockCheckLicense.mockResolvedValue({ revoked: false, features: ["commerce"] });
+    mockNotFound.mockClear();
+    mockEnsureCommerceSectionsRegistered.mockReset();
+    mockEnsureCommerceSectionsRegistered.mockResolvedValue(true);
+  });
+
+  it("renders payment-receipt(outcome:cancel) → cta, with a primary link to /services (AC-2, D5)", async () => {
+    await renderPage();
+
+    expect(sectionTypes()).toEqual(["payment-receipt", "cta"]);
+    const receipt = capturedSections[0] as {
+      data: Record<string, unknown>;
+    };
+    expect(receipt.data.outcome).toBe("cancel");
+    const cta = capturedSections[1] as { data: Record<string, unknown> };
+    expect((cta.data.primaryCta as { href: string }).href).toBe("/services");
+  });
+
+  it("falls back to content-block instead of payment-receipt when @working-theory/ui-commerce is not installed", async () => {
+    mockEnsureCommerceSectionsRegistered.mockResolvedValue(false);
+
+    await renderPage();
+
+    expect(sectionTypes()).toEqual(["content-block", "cta"]);
+    const fallback = capturedSections[0] as {
+      data: { headline: string; body: string };
+    };
+    expect(fallback.data.headline).toBe("copy:cancel.title");
+    expect(fallback.data.body).toContain("copy:cancel.message");
+  });
+
+  it("reads NOTHING — no API call at all (D4)", async () => {
+    await renderPage();
+    expect(mockGetSession).not.toHaveBeenCalled();
+  });
+
+  it("takes every string from the purchase namespace (D4/AC-2)", async () => {
+    await renderPage();
+    expect(requestedKeys.length).toBeGreaterThan(0);
+    expect(requestedKeys.every((k) => k.startsWith("cancel."))).toBe(true);
+  });
+
+  it("is not indexable", async () => {
+    const metadata = await generateMetadata({
+      params: Promise.resolve({ locale: "en" }),
+    });
+    expect(metadata.robots).toEqual({ index: false, follow: true });
+  });
+
+  it("carries no data-outcome=success and no PaymentComplete string — a cancel is not a payment claim", async () => {
+    await renderPage();
+    const serialized = JSON.stringify(capturedSections);
+    expect(serialized).not.toContain('"outcome":"success"');
+    expect(serialized).not.toContain("PaymentComplete");
+  });
+
+  // ── T-16 / D12 — the request-time commerce-claim gate ───────────────────
+
+  it("answers notFound() when the commerce claim is NOT held (D12)", async () => {
+    mockCheckLicense.mockResolvedValue({ revoked: false, features: [] });
+
+    await expect(renderPage()).rejects.toThrow("NEXT_NOT_FOUND");
+    expect(mockNotFound).toHaveBeenCalledTimes(1);
+  });
+
+  it("fail-closed: answers notFound() when the licence read THROWS", async () => {
+    mockCheckLicense.mockRejectedValue(new Error("licence read blew up"));
+
+    await expect(renderPage()).rejects.toThrow();
+  });
+
+  it("renders normally when the commerce claim IS held", async () => {
+    mockCheckLicense.mockResolvedValue({ revoked: false, features: ["commerce"] });
+    await renderPage();
+    expect(mockNotFound).not.toHaveBeenCalled();
+    expect(sectionTypes()).toEqual(["payment-receipt", "cta"]);
+  });
+});