create-ailk 0.11.3 → 0.11.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-ailk",
-  "version": "0.11.3",
+  "version": "0.11.4",
   "description": "Scaffolder for AI Launch Kit — `pnpm create ailk@latest <dir>` produces a starter repo consuming @working-theory/* from npm (per ADR 0007).",
   "type": "module",
   "main": "./dist/index.js",
@@ -27,8 +27,8 @@
     "tar": "^7.5.21"
   },
   "devDependencies": {
-    "@working-theory/schema": "0.31.0",
-    "@working-theory/templates": "0.31.0"
+    "@working-theory/schema": "0.32.0",
+    "@working-theory/templates": "0.32.0"
   },
   "repository": {
     "type": "git",

package/templates/apps/web/app/[locale]/(authed)/account/__tests__/layout.test.tsx

@@ -9,11 +9,15 @@
  *      by side); Log out signs out and routes home.
  *   3. ? opens Contact support (→ /account/support) and, only when the site
  *      configures a help URL, Help center.
- *   4. Below md the tab bar reads avatar · Inbox · Help.
+ *   4. Below md the tab bar reads avatar · Inbox · For you · Help, with no
+ *      count on any tab (#7469, DESIGN.md §2b as amended 2026-10-01); For
+ *      you is `?tab=for-you` of the Inbox route, and the frame hands the
+ *      tab to the page (PhoneTabProvider).
  *   5. The For-you items are the aside; none → no aside.
  *   6. No site chrome (Nav, Footer, ThemeToggle) inside the frame.
  */
 import { fireEvent, render, screen, waitFor, within } from "@testing-library/react";
+import type { ReactElement } from "react";
 
 jest.mock("next-intl/server", () => {
   const msgs: unknown = require("../../../../../messages/en.json");
@@ -69,14 +73,23 @@ jest.mock("better-auth/react", () => ({
 const mockPush = jest.fn();
 const mockRefresh = jest.fn();
 let mockPathname = "/account";
+let mockSearch = "";
 jest.mock("next/navigation", () => ({
   __esModule: true,
   useRouter: () => ({ push: mockPush, refresh: mockRefresh }),
   usePathname: () => mockPathname,
+  useSearchParams: () => new URLSearchParams(mockSearch),
 }));
 
+import { usePhoneTab } from "@working-theory/templates/account";
+
 import AccountLayout from "../layout";
 
+/** A page that shows the phone tab the frame hands it. */
+function PhoneTabProbe(): ReactElement {
+  return <p data-testid="phone-tab-probe">{usePhoneTab()}</p>;
+}
+
 const SESSION = {
   user: {
     id: "user_1",
@@ -107,7 +120,12 @@ function openByPointer(trigger: HTMLElement): void {
 
 async function renderLayout(locale = "en"): Promise<void> {
   const element = await AccountLayout({
-    children: <p data-testid="account-child">page</p>,
+    children: (
+      <>
+        <p data-testid="account-child">page</p>
+        <PhoneTabProbe />
+      </>
+    ),
     params: Promise.resolve({ locale }),
   });
   render(element);
@@ -118,6 +136,7 @@ const ORIGINAL_HELP_URL = process.env.AILK_HELP_CENTER_URL;
 beforeEach(() => {
   window.localStorage.clear();
   mockPathname = "/account";
+  mockSearch = "";
   delete process.env.AILK_HELP_CENTER_URL;
   mockGetSession.mockReset().mockResolvedValue(SESSION);
   mockCheckoutsMe.mockReset().mockResolvedValue({ ok: true, body: [] });
@@ -241,22 +260,78 @@ describe("the help menu (D13)", () => {
   });
 });
 
-describe("the phone frame (D13)", () => {
-  it("the tab bar reads avatar · Inbox · Help, and Help opens the same menu", async () => {
+describe("the phone frame (D13; #7469 — the For you tab)", () => {
+  it("the tab bar reads avatar · Inbox · For you · Help, and Help opens the same menu", async () => {
     await renderLayout();
     const bar = screen.getByTestId("bottom-tab-bar");
     const cells = Array.from(bar.children);
-    expect(cells).toHaveLength(3);
+    expect(cells).toHaveLength(4);
     expect(cells[0]).toBe(screen.getByTestId("bottom-tab-bar-leading"));
     expect(cells[1]).toHaveTextContent("Inbox");
+    expect(cells[1]).toHaveAttribute("href", "/account");
     expect(cells[1]).toHaveAttribute("aria-current", "page");
-    expect(cells[2]).toBe(screen.getByTestId("bottom-tab-bar-trailing"));
+    expect(cells[2]).toHaveTextContent("For you");
+    expect(cells[2]).toHaveAttribute("href", "/account?tab=for-you");
+    expect(cells[2]).not.toHaveAttribute("aria-current");
+    expect(cells[3]).toBe(screen.getByTestId("bottom-tab-bar-trailing"));
     openByPointer(screen.getByTestId("frame-bottom-bar-help"));
     expect(
       within(screen.getByTestId("signed-in-shell-help-menu")).getByText("Contact support"),
     ).toBeInTheDocument();
   });
 
+  it("no tab carries a count, even with For-you items waiting", async () => {
+    mockGetSession.mockResolvedValue({
+      user: { ...SESSION.user, name: null, emailVerified: false },
+    });
+    await renderLayout();
+    const bar = screen.getByTestId("bottom-tab-bar");
+    const tabs = within(bar).getAllByRole("link");
+    expect(tabs.map((tab) => tab.textContent)).toEqual(["Inbox", "For you"]);
+  });
+
+  it("a non-default locale prefixes both tabs", async () => {
+    mockPathname = "/fr/account";
+    await renderLayout("fr");
+    const tabs = within(screen.getByTestId("bottom-tab-bar")).getAllByRole("link");
+    expect(tabs.map((tab) => tab.getAttribute("href"))).toEqual([
+      "/fr/account",
+      "/fr/account?tab=for-you",
+    ]);
+  });
+
+  it("on ?tab=for-you, For you is selected, Inbox is not, and the page is handed the tab", async () => {
+    mockSearch = "tab=for-you";
+    await renderLayout();
+    const [inbox, forYou] = within(screen.getByTestId("bottom-tab-bar")).getAllByRole("link");
+    expect(forYou).toHaveAttribute("aria-current", "page");
+    expect(inbox).not.toHaveAttribute("aria-current");
+    expect(screen.getByTestId("phone-tab-probe")).toHaveTextContent("for-you");
+  });
+
+  it("on the Inbox the page is handed the inbox tab", async () => {
+    await renderLayout();
+    expect(screen.getByTestId("phone-tab-probe")).toHaveTextContent("inbox");
+  });
+
+  it("an unknown ?tab= is the Inbox", async () => {
+    mockSearch = "tab=library";
+    await renderLayout();
+    const [inbox] = within(screen.getByTestId("bottom-tab-bar")).getAllByRole("link");
+    expect(inbox).toHaveAttribute("aria-current", "page");
+    expect(screen.getByTestId("phone-tab-probe")).toHaveTextContent("inbox");
+  });
+
+  it("an Inbox item page keeps the Inbox tab selected, whatever ?tab= says", async () => {
+    mockPathname = "/account/inbox/purchase/fc_1";
+    mockSearch = "tab=for-you";
+    await renderLayout();
+    const [inbox, forYou] = within(screen.getByTestId("bottom-tab-bar")).getAllByRole("link");
+    expect(inbox).toHaveAttribute("aria-current", "page");
+    expect(forYou).not.toHaveAttribute("aria-current");
+    expect(screen.getByTestId("phone-tab-probe")).toHaveTextContent("inbox");
+  });
+
   it("the phone top bar carries the site logo, linking home", async () => {
     await renderLayout();
     const logos = screen.getAllByTestId("account-site-logo");

package/templates/apps/web/app/[locale]/(authed)/account/__tests__/page.test.tsx

@@ -8,10 +8,15 @@
  *   2. `result` and `purchase` rows sit under Recents and All, newest first,
  *      each linking to its item page.
  *   3. `email-unverified` and `payment-due` are For-you items (the phone
- *      stack), never Inbox rows.
+ *      For you tab), never Inbox rows.
  *   4. A member with no name gets an "Add your name" For-you item (needs-you,
  *      an Open action) linking to User settings › General.
  *   5. A failed read renders an error row with Retry — never an empty Inbox.
+ *   6. #7469 (DESIGN.md §2b as amended 2026-10-01) — the route is the
+ *      phone's two main tabs. The Inbox tab is the filter tabs and the list
+ *      only: no For-you stack, no bottom sheet, no large title. The For you
+ *      tab lists every For-you item in one inset card, and ✕ dismisses one.
+ *      At `md`+ only the Inbox panel shows (the aside holds For you).
  */
 import { fireEvent, render, screen, within } from "@testing-library/react";
 
@@ -73,6 +78,8 @@ jest.mock("next/navigation", () => ({
   usePathname: () => "/account",
 }));
 
+import { PhoneTabProvider } from "@working-theory/templates/account";
+
 import { accountExperimentKeys } from "../../../../../lib/account-config";
 import Page from "../page";
 
@@ -114,12 +121,24 @@ const NO_SUBSCRIPTION = {
   body: { actionRequired: false, status: null, accessRevokesAt: null, portalAvailable: false },
 };
 
-async function renderPage(locale = "en"): Promise<void> {
+/** Renders the page on a phone tab — the frame's PhoneTabProvider. */
+async function renderPage(locale = "en", tab = "inbox"): Promise<void> {
   const element = await Page({ params: Promise.resolve({ locale }) });
-  render(element);
+  render(<PhoneTabProvider tab={tab}>{element}</PhoneTabProvider>);
 }
 
+const UNVERIFIED_AND_PAST_DUE = (): void => {
+  mockGetSession.mockResolvedValue({
+    user: { ...SESSION.user, emailVerified: false },
+  });
+  mockSubscriptionMe.mockResolvedValue({
+    ok: true,
+    body: { actionRequired: true, status: "past_due", accessRevokesAt: null, portalAvailable: true },
+  });
+};
+
 beforeEach(() => {
+  window.localStorage.clear();
   accountExperimentKeys.length = 0;
   mockGetSession.mockReset().mockResolvedValue(SESSION);
   mockSignupMe.mockReset().mockResolvedValue({ ok: true, body: SIGNUP });
@@ -195,18 +214,11 @@ describe("the Inbox — D6a tabs (AC-7)", () => {
 });
 
 describe("For-you items, not Inbox rows (AC-7, D9 as amended)", () => {
-  it("email-unverified and payment-due are For-you items in the phone stack, never Inbox rows", async () => {
-    mockGetSession.mockResolvedValue({
-      user: { ...SESSION.user, emailVerified: false },
-    });
-    mockSubscriptionMe.mockResolvedValue({
-      ok: true,
-      body: { actionRequired: true, status: "past_due", accessRevokesAt: null, portalAvailable: true },
-    });
-    await renderPage();
-    const forYou = screen.getByTestId("inbox-for-you");
-    expect(forYou).toHaveClass("md:hidden");
-    expect(within(forYou).getByTestId("for-you-stack-count")).toHaveTextContent("2");
+  it("email-unverified and payment-due are For you tab items, never Inbox rows", async () => {
+    UNVERIFIED_AND_PAST_DUE();
+    await renderPage("en", "for-you");
+    const forYou = screen.getByTestId("inbox-panel-for-you");
+    expect(within(forYou).getAllByTestId("for-you-item")).toHaveLength(2);
     const list = screen.getByTestId("inbox-list");
     expect(within(list).queryByText("Email not verified")).not.toBeInTheDocument();
     expect(
@@ -214,15 +226,10 @@ describe("For-you items, not Inbox rows (AC-7, D9 as amended)", () => {
     ).not.toBeInTheDocument();
   });
 
-  it("nothing for you → no For you section", async () => {
-    await renderPage();
-    expect(screen.queryByTestId("inbox-for-you")).not.toBeInTheDocument();
-  });
-
   it("a member with no name sees 'Add your name' (needs-you, Open → User settings › General)", async () => {
     mockGetSession.mockResolvedValue({ user: { ...SESSION.user, name: "" } });
-    await renderPage();
-    const forYou = screen.getByTestId("inbox-for-you");
+    await renderPage("en", "for-you");
+    const forYou = screen.getByTestId("inbox-panel-for-you");
     const item = within(forYou).getByTestId("for-you-item");
     expect(item).toHaveAttribute("data-item-id", "add-name");
     expect(item).toHaveTextContent("Add your name");
@@ -235,6 +242,101 @@ describe("For-you items, not Inbox rows (AC-7, D9 as amended)", () => {
   });
 });
 
+describe("the phone Inbox tab (#7469, DESIGN.md §2b · §5.15)", () => {
+  it("holds the filter tabs and the list only — no For-you stack and no bottom sheet", async () => {
+    UNVERIFIED_AND_PAST_DUE();
+    await renderPage();
+    const inbox = screen.getByTestId("inbox-panel-inbox");
+    expect(within(inbox).getByTestId("inbox-list")).toBeInTheDocument();
+    expect(screen.queryByTestId("for-you-stack")).not.toBeInTheDocument();
+    expect(screen.queryByTestId("for-you-stack-count")).not.toBeInTheDocument();
+    expect(screen.queryByTestId("for-you-sheet")).not.toBeInTheDocument();
+    expect(screen.queryByTestId("inbox-for-you")).not.toBeInTheDocument();
+  });
+
+  it("shows on the phone and at md+, while the For you panel stays hidden", async () => {
+    UNVERIFIED_AND_PAST_DUE();
+    await renderPage();
+    expect(screen.getByTestId("inbox-panel-inbox")).not.toHaveClass("hidden");
+    expect(screen.getByTestId("inbox-panel-inbox")).not.toHaveClass("md:hidden");
+    expect(screen.getByTestId("inbox-panel-for-you")).toHaveClass("hidden");
+  });
+
+  it("the phone has no large title or lead — both stay at md+", async () => {
+    await renderPage();
+    expect(screen.getByRole("heading", { level: 1 })).toHaveClass("max-md:sr-only");
+    expect(screen.getByRole("heading", { level: 1 })).not.toHaveClass("hidden");
+    expect(screen.getByText("What changed, and what's coming.")).toHaveClass("hidden", "md:block");
+  });
+
+  it("the list sits in a bordered card, inset by the canvas on every side", async () => {
+    accountExperimentKeys.push("ailk-founder-diagnostic");
+    await renderPage();
+    // The shell's main slot insets the canvas (p-4 below md); the page adds
+    // no full-bleed escape, and the list is RowGroup's bordered box.
+    const page = screen.getByTestId("account-inbox");
+    expect(page.className).not.toMatch(/-mx-|w-screen/);
+    expect(screen.getByTestId("inbox-panel-inbox").className ?? "").not.toMatch(/-mx-|w-screen/);
+  });
+});
+
+describe("the phone For you tab (#7469, DESIGN.md §2b · §5.15)", () => {
+  it("lists every item with its type tag, title, Open or View, and ✕", async () => {
+    UNVERIFIED_AND_PAST_DUE();
+    mockGetSession.mockResolvedValue({
+      user: { ...SESSION.user, name: "", emailVerified: false },
+    });
+    await renderPage("en", "for-you");
+    const panel = screen.getByTestId("inbox-panel-for-you");
+    // Phone-only: shown below md, hidden at md+ where the aside holds it.
+    expect(panel).toHaveClass("md:hidden");
+    expect(panel).not.toHaveClass("hidden");
+    // The Inbox panel is hidden on the phone but still shows at md+.
+    expect(screen.getByTestId("inbox-panel-inbox")).toHaveClass("hidden", "md:block");
+    const card = within(panel).getByTestId("for-you-list-card");
+    const items = within(card).getAllByTestId("for-you-item");
+    expect(items).toHaveLength(3);
+    for (const item of items) {
+      expect(within(item).getByTestId("for-you-tag")).toBeInTheDocument();
+      expect(
+        within(item).queryByTestId("for-you-open") ?? within(item).queryByTestId("for-you-view"),
+      ).not.toBeNull();
+      expect(within(item).getByTestId("for-you-dismiss")).toHaveAccessibleName(/^Dismiss/);
+    }
+    expect(within(panel).getByText("Add your name")).toBeInTheDocument();
+    expect(within(panel).getByText("Email not verified")).toBeInTheDocument();
+    expect(within(panel).getByText("Your payment didn't go through")).toBeInTheDocument();
+  });
+
+  it("✕ dismisses an item — it leaves the list", async () => {
+    UNVERIFIED_AND_PAST_DUE();
+    await renderPage("en", "for-you");
+    const panel = screen.getByTestId("inbox-panel-for-you");
+    const [first] = within(panel).getAllByTestId("for-you-item");
+    const id = first!.getAttribute("data-item-id");
+    fireEvent.click(within(first!).getByTestId("for-you-dismiss"));
+    const left = within(panel).getAllByTestId("for-you-item");
+    expect(left).toHaveLength(1);
+    expect(left.map((item) => item.getAttribute("data-item-id"))).not.toContain(id);
+  });
+
+  it("the For you tab keeps the page's h1 (visually hidden on the phone)", async () => {
+    await renderPage("en", "for-you");
+    const h1 = screen.getByRole("heading", { level: 1 });
+    expect(h1).toHaveTextContent("Inbox");
+    expect(screen.getByTestId("inbox-panel-inbox")).not.toContainElement(h1);
+  });
+
+  it("with nothing waiting the tab shows its empty line, not a blank page", async () => {
+    await renderPage("en", "for-you");
+    const panel = screen.getByTestId("inbox-panel-for-you");
+    expect(within(panel).queryByTestId("for-you-item")).not.toBeInTheDocument();
+    expect(within(panel).getByTestId("for-you-empty")).toHaveTextContent(
+      "Nothing here right now.",
+    );
+  });
+});
+
 describe("Hub unavailable (D12)", () => {
   it("a failed read renders an error row with Retry, never an empty Inbox", async () => {
     mockCheckoutsMe.mockResolvedValue({ ok: false, status: 500, body: {} });
@@ -250,6 +352,26 @@ describe("Hub unavailable (D12)", () => {
   it("a failed For-you read also shows the error row", async () => {
     mockSubscriptionMe.mockResolvedValue({ ok: false, status: 502, body: {} });
     await renderPage();
-    expect(screen.getByTestId("inbox-error")).toBeInTheDocument();
+    expect(
+      within(screen.getByTestId("inbox-panel-inbox")).getByTestId("inbox-error"),
+    ).toBeInTheDocument();
+  });
+
+  it("on the phone For you tab, a failed For-you read shows the error row above the list (#7469)", async () => {
+    mockSubscriptionMe.mockResolvedValue({ ok: false, status: 502, body: {} });
+    await renderPage("en", "for-you");
+    const panel = screen.getByTestId("inbox-panel-for-you");
+    expect(within(panel).getByTestId("inbox-error")).toHaveTextContent(
+      "We couldn't load everything in your Inbox.",
+    );
+    // Never a silently empty list (D12): the empty line gives way to the error row.
+    expect(within(panel).queryByTestId("for-you-empty")).not.toBeInTheDocument();
+  });
+
+  it("a failed Inbox-kind read leaves the For you tab without an error row", async () => {
+    mockCheckoutsMe.mockResolvedValue({ ok: false, status: 500, body: {} });
+    await renderPage("en", "for-you");
+    const panel = screen.getByTestId("inbox-panel-for-you");
+    expect(within(panel).queryByTestId("inbox-error")).not.toBeInTheDocument();
   });
 });

package/templates/apps/web/app/[locale]/(authed)/account/account-data.ts

@@ -17,7 +17,7 @@
  *     #7418), with the same `failed` flag.
  *
  * `cache()` dedupes the reads within one request: the layout's aside and the
- * Inbox's phone stack render the same items from one set of API calls.
+ * Inbox's phone For you tab render the same items from one set of API calls.
  */
 
 import type {

package/templates/apps/web/app/[locale]/(authed)/account/account-frame.tsx

@@ -9,10 +9,18 @@
  * `createAuthClient()` at module scope is the `sign-in-gate.tsx` idiom. Log
  * out ends the session, then navigates home and refreshes so every RSC under
  * the `(authed)` gate re-reads the (now absent) session.
+ *
+ * #7469 (DESIGN.md §2b as amended 2026-10-01, matching the Admin's §5.15) —
+ * below `md` the bar reads avatar · Inbox · For you · Help, with no count
+ * on any tab. For you is a page of the Inbox route (`?tab=for-you`): the
+ * frame reads the URL and hands the tab to the page (`PhoneTabProvider`),
+ * which shows one panel per tab. At `md`+ nothing changes — For you stays
+ * the aside.
  */
 
 import {
   ForYouPanel,
+  PhoneTabProvider,
   useForYouDismissed,
   type ForYouItem,
   type ForYouLabels,
@@ -25,18 +33,23 @@ import {
 import { localeHref } from "@working-theory/ui";
 import { Link } from "@working-theory/ui/primitives";
 import { createAuthClient } from "better-auth/react";
-import { Inbox, Settings } from "lucide-react";
-import { usePathname, useRouter } from "next/navigation";
+import { Inbox, Settings, Sparkles } from "lucide-react";
+import { usePathname, useRouter, useSearchParams } from "next/navigation";
 import type { ReactElement, ReactNode } from "react";
 
 import { ACCOUNT_PERSIST_KEY } from "./for-you-labels";
 
 const authClient = createAuthClient();
 
+/** The phone For you tab's `?tab=` value (#7469). */
+const FOR_YOU_TAB = "for-you";
+
 export interface AccountFrameLabels extends SignedInShellLabels {
   /** The logo link's accessible name. */
   home: string;
   inbox: string;
+  /** The phone's For you tab label (#7469). */
+  forYou: string;
   settings: string;
 }
 
@@ -62,12 +75,16 @@ export function AccountFrame({
 }: AccountFrameProps): ReactElement {
   const router = useRouter();
   const pathname = usePathname();
+  const searchParams = useSearchParams();
   const [dismissed] = useForYouDismissed(ACCOUNT_PERSIST_KEY);
 
   const homeHref = localeHref(locale, "/");
   const inboxHref = localeHref(locale, "/account");
   // The Inbox row stays selected on an item's own page (/account/inbox/…).
   const onInbox = pathname === inboxHref || pathname.startsWith(`${inboxHref}/inbox/`);
+  // #7469 — the phone tab: For you only on the Inbox route itself.
+  const phoneTab =
+    pathname === inboxHref && searchParams?.get("tab") === FOR_YOU_TAB ? FOR_YOU_TAB : "inbox";
 
   const onSignOut = (): void => {
     void (async () => {
@@ -82,7 +99,7 @@ export function AccountFrame({
     })();
   };
 
-  const { home, inbox, settings, ...shellLabels } = labels;
+  const { home, inbox, forYou: forYouLabel, settings, ...shellLabels } = labels;
 
   // D13 — the logo only: no box, no name, no popover; it links home. The
   // same link is the phone top bar's leading cell.
@@ -105,7 +122,16 @@ export function AccountFrame({
       persistKey={ACCOUNT_PERSIST_KEY}
       locale={locale}
       navItems={[{ labelKey: "inbox", label: inbox, path: "/account", icon: Inbox }]}
-      tabItems={[{ key: "inbox", label: inbox, href: inboxHref, icon: Inbox, isActive: onInbox }]}
+      tabItems={[
+        { key: "inbox", label: inbox, href: inboxHref, icon: Inbox, isActive: onInbox && phoneTab === "inbox" },
+        {
+          key: FOR_YOU_TAB,
+          label: forYouLabel,
+          href: `${inboxHref}?tab=${FOR_YOU_TAB}`,
+          icon: Sparkles,
+          isActive: phoneTab === FOR_YOU_TAB,
+        },
+      ]}
       {...(onInbox ? { activePath: inboxHref } : {})}
       user={user}
       userMenuItems={[
@@ -137,7 +163,7 @@ export function AccountFrame({
         : {})}
       labels={shellLabels}
     >
-      {children}
+      <PhoneTabProvider tab={phoneTab}>{children}</PhoneTabProvider>
     </SignedInShell>
   );
 }

package/templates/apps/web/app/[locale]/(authed)/account/for-you-labels.ts

@@ -1,7 +1,7 @@
 /**
  * for-you-labels.ts — the For-you panel's strings from the `account`
  * namespace (#7430, spec §5.2 i18n), and the frame's persist key. Shared by
- * the layout's aside and the Inbox's phone stack.
+ * the layout's aside and the Inbox's phone For you tab.
  */
 
 import type { AccountTranslate, ForYouLabels } from "@working-theory/templates/account";
@@ -10,7 +10,7 @@ import type { AccountTranslate, ForYouLabels } from "@working-theory/templates/a
  * The account frame's `persistKey`: the shell's remembered collapse
  * (`ailk:shell:account:*`) and the For-you dismissals
  * (`ailk:account:foryou:dismissed`), shared by the aside and the Inbox's
- * phone stack so a dismissal holds on both.
+ * phone For you tab so a dismissal holds on both.
  */
 export const ACCOUNT_PERSIST_KEY = "account";
 

package/templates/apps/web/app/[locale]/(authed)/account/layout.tsx

@@ -7,13 +7,13 @@
  * home; Inbox as the rail's only row; a footer of the avatar and ? alone;
  * the card avatar menu (name, then Settings and Log out); the ? help menu
  * (Contact support, and Help center when `AILK_HELP_CENTER_URL` is set);
- * and below `md` a tab bar reading avatar · Inbox · Help. The locale layout
- * renders no marketing frame and no consent Banner on these paths (D4,
- * `isAccountPath`).
+ * and below `md` a tab bar reading avatar · Inbox · For you · Help (#7469).
+ * The locale layout renders no marketing frame and no consent Banner on
+ * these paths (D4, `isAccountPath`).
  *
  * The aside is the For-you panel, fed by `accountForYouSources` plus the
  * area's own "Add your name" item (`loadForYou`, deduped per request with
- * the Inbox's phone stack); with no items there is no aside.
+ * the Inbox's phone For you tab); with no items there is no aside.
  *
  * The `(authed)` layout above owns the signed-out gate, so a missing session
  * here is a race (it expired between the two layouts): the page renders
@@ -67,6 +67,7 @@ export default async function AccountLayout({
       labels={{
         home: t("frame.home"),
         inbox: t("frame.inbox"),
+        forYou: t("frame.forYou"),
         settings: t("frame.settings"),
         signOut: t("frame.signOut"),
         help: t("frame.help"),

package/templates/apps/web/app/[locale]/(authed)/account/page.tsx

@@ -17,8 +17,18 @@
  *
  * What needs the person is never an Inbox row: `email-unverified`,
  * `payment-due` and "Add your name" are For-you items (D9 as amended). From
- * `md` up they are the layout's aside; below `md` this page shows them inline
- * as the For you stack, between the header and the tabs — absent when empty.
+ * `md` up they are the layout's aside.
+ *
+ * #7469 (DESIGN.md §2b as amended 2026-10-01, matching the Admin's §5.15) —
+ * below `md` the route is the phone's two main tabs, one `PhoneTabPanel`
+ * each (the frame hands the tab over from `?tab=`):
+ *   - Inbox — the filter tabs and the list only, in RowGroup's inset card.
+ *     No For-you stack and no bottom sheet, and no lead on the phone.
+ *   - For you — every For-you item as rows of one inset card, each with its
+ *     type tag, title, Open or View, and ✕; the empty line when none waits,
+ *     and D12's error row above the list when a For-you source failed.
+ * The h1 sits above both panels, visually hidden below `md` (the phone has
+ * no large title). At `md`+ only the Inbox panel shows, lead included.
  *
  * D12 — any read that fails (a kind or a For-you source) renders an error
  * row with Retry above the list; the list then holds what DID load, never a
@@ -26,8 +36,9 @@
  */
 
 import {
-  ForYouStack,
+  ForYouPanel,
   InboxList,
+  PhoneTabPanel,
   type InboxListRow,
 } from "@working-theory/templates/account";
 import { Heading, Text } from "@working-theory/ui/primitives";
@@ -96,52 +107,65 @@ export default async function AccountInboxPage({ params }: Props): Promise<React
   const failed = inbox.failed || forYou.failed;
 
   return (
-    <div className="max-w-3xl py-8" data-testid="account-inbox">
-      <Heading level={1} visual={2}>
+    // The phone's top bar already clears the canvas — no top inset there.
+    <div className="max-w-3xl py-8 max-md:pt-0" data-testid="account-inbox">
+      {/* The page's one h1, on both phone tabs; visually hidden on the phone,
+          which has no large title (§5.15). */}
+      <Heading level={1} visual={2} className="max-md:sr-only">
         {t("inbox.title")}
       </Heading>
-      <Text as="p" variant="body-sm" tone="muted" className="mt-block-tight">
-        {t("inbox.lead")}
-      </Text>
+      <PhoneTabPanel tabs={["inbox"]} desktop data-testid="inbox-panel-inbox">
+        <Text as="p" variant="body-sm" tone="muted" className="mt-block-tight hidden md:block">
+          {t("inbox.lead")}
+        </Text>
+
+        {failed ? (
+          <ErrorRow
+            message={t("inbox.error")}
+            retryLabel={t("inbox.retry")}
+            className="mt-block-loose"
+          />
+        ) : null}
+
+        <InboxList
+          tabs={[
+            { id: "recents", label: t("inbox.tabs.recents"), count: recents.length, rows: recents },
+            { id: "suggested", label: t("inbox.tabs.suggested"), count: 0, rows: [] },
+            {
+              id: "scheduled",
+              label: t("inbox.tabs.scheduled"),
+              count: scheduled.length,
+              rows: scheduled,
+            },
+            { id: "all", label: t("inbox.tabs.all"), count: all.length, rows: all },
+          ]}
+          defaultTab="recents"
+          {...(failed ? {} : { emptyLine: t("inbox.empty") })}
+        />
+      </PhoneTabPanel>
 
-      {/* D6a — below `md` the For you stack sits between the header and the
-          list; absent when empty. From `md` up the same items are the
-          layout's aside (SignedInShell's breakpoint is "md"). */}
-      {forYou.items.length > 0 ? (
-        <div className="mt-block-loose md:hidden" data-testid="inbox-for-you">
-          <ForYouStack
+      {/* #7469 — the phone For you tab: every item, rows of one inset card.
+          At `md`+ the same items are the layout's aside. D12 here too: a
+          failed source shows the error row, and never the empty line alone. */}
+      <PhoneTabPanel tabs={["for-you"]} data-testid="inbox-panel-for-you">
+        {forYou.failed ? (
+          <ErrorRow
+            message={t("inbox.error")}
+            retryLabel={t("inbox.retry")}
+            className="mb-block-loose"
+          />
+        ) : null}
+        {forYou.failed && forYou.items.length === 0 ? null : (
+          <ForYouPanel
+            variant="list"
             items={forYou.items}
             persistKey={ACCOUNT_PERSIST_KEY}
             labels={forYouLabels(translate)}
             locale={locale}
             now={forYou.now}
           />
-        </div>
-      ) : null}
-
-      {failed ? (
-        <ErrorRow
-          message={t("inbox.error")}
-          retryLabel={t("inbox.retry")}
-          className="mt-block-loose"
-        />
-      ) : null}
-
-      <InboxList
-        tabs={[
-          { id: "recents", label: t("inbox.tabs.recents"), count: recents.length, rows: recents },
-          { id: "suggested", label: t("inbox.tabs.suggested"), count: 0, rows: [] },
-          {
-            id: "scheduled",
-            label: t("inbox.tabs.scheduled"),
-            count: scheduled.length,
-            rows: scheduled,
-          },
-          { id: "all", label: t("inbox.tabs.all"), count: all.length, rows: all },
-        ]}
-        defaultTab="recents"
-        {...(failed ? {} : { emptyLine: t("inbox.empty") })}
-      />
+        )}
+      </PhoneTabPanel>
     </div>
   );
 }

package/templates/apps/web/messages/en.json

@@ -550,6 +550,7 @@
     "frame": {
       "home": "Home",
       "inbox": "Inbox",
+      "forYou": "For you",
       "settings": "Settings",
       "signOut": "Log out",
       "help": "Help",

package/templates/database/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @working-theory/database
 
+## 0.32.0
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @working-theory/validation@0.32.0
+
 ## 0.31.0
 
 ### Patch Changes

package/templates/database/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@working-theory/database",
-  "version": "0.31.0",
+  "version": "0.32.0",
   "license": "Apache-2.0",
   "publishConfig": {
     "access": "public"

package/versions.json

@@ -1,52 +1,52 @@
 {
-  "@working-theory/admin-ui": "0.31.0",
-  "@working-theory/aeo": "0.31.0",
-  "@working-theory/agent-context": "0.31.0",
+  "@working-theory/admin-ui": "0.32.0",
+  "@working-theory/aeo": "0.32.0",
+  "@working-theory/agent-context": "0.32.0",
   "@working-theory/agent-contract": "0.1.0",
   "@working-theory/agent-memory": "0.0.0",
   "@working-theory/ai": "0.1.0",
-  "@working-theory/analytics": "0.31.0",
-  "@working-theory/api-client": "0.31.0",
+  "@working-theory/analytics": "0.32.0",
+  "@working-theory/api-client": "0.32.0",
   "@working-theory/cda-filesystem": "0.0.0",
-  "@working-theory/cli": "0.31.0",
-  "@working-theory/common": "0.31.0",
+  "@working-theory/cli": "0.32.0",
+  "@working-theory/common": "0.32.0",
   "@working-theory/consent": "0.1.0",
-  "@working-theory/content-adapters": "0.31.0",
-  "@working-theory/content-projection": "0.31.0",
-  "@working-theory/email": "0.31.0",
+  "@working-theory/content-adapters": "0.32.0",
+  "@working-theory/content-projection": "0.32.0",
+  "@working-theory/email": "0.32.0",
   "@working-theory/env": "0.0.0",
-  "@working-theory/eslint-config": "0.31.0",
-  "@working-theory/fumadocs-schema": "0.31.0",
+  "@working-theory/eslint-config": "0.32.0",
+  "@working-theory/fumadocs-schema": "0.32.0",
   "@working-theory/ids": "0.8.0",
-  "@working-theory/jsonld": "0.31.0",
-  "@working-theory/license": "0.31.0",
-  "@working-theory/metadata": "0.31.0",
-  "@working-theory/observability": "0.31.0",
-  "@working-theory/page-renderer": "0.31.0",
+  "@working-theory/jsonld": "0.32.0",
+  "@working-theory/license": "0.32.0",
+  "@working-theory/metadata": "0.32.0",
+  "@working-theory/observability": "0.32.0",
+  "@working-theory/page-renderer": "0.32.0",
   "@working-theory/plugin-mcp": "0.1.1",
-  "@working-theory/schema": "0.31.0",
-  "@working-theory/schema-pack-registry": "0.31.0",
-  "@working-theory/schema-validator": "0.31.0",
-  "@working-theory/sections-registry": "0.31.0",
-  "@working-theory/site-config": "0.31.0",
-  "@working-theory/stripe-client": "0.31.0",
-  "@working-theory/templates": "0.31.0",
-  "@working-theory/theme": "0.31.0",
-  "@working-theory/ui": "0.31.0",
-  "@working-theory/validation": "0.31.0",
-  "@working-theory/web-i18n": "0.31.0",
+  "@working-theory/schema": "0.32.0",
+  "@working-theory/schema-pack-registry": "0.32.0",
+  "@working-theory/schema-validator": "0.32.0",
+  "@working-theory/sections-registry": "0.32.0",
+  "@working-theory/site-config": "0.32.0",
+  "@working-theory/stripe-client": "0.32.0",
+  "@working-theory/templates": "0.32.0",
+  "@working-theory/theme": "0.32.0",
+  "@working-theory/ui": "0.32.0",
+  "@working-theory/validation": "0.32.0",
+  "@working-theory/web-i18n": "0.32.0",
   "@working-theory/billing-client": "0.0.0",
   "@working-theory/branding": "0.0.0",
   "@working-theory/license-client": "0.0.0",
   "@working-theory/license-manifest": "0.0.0",
   "@working-theory/partner-session": "0.0.0",
   "@working-theory/preview-protocol": "0.0.0",
-  "@working-theory/ui-commerce": "0.23.8",
-  "@working-theory/ui-docs-blog": "0.23.8",
-  "@working-theory/ui-scheduling": "0.23.8",
-  "@working-theory/ui-signal-collectors": "0.24.6",
+  "@working-theory/ui-commerce": "0.23.9",
+  "@working-theory/ui-docs-blog": "0.23.9",
+  "@working-theory/ui-scheduling": "0.23.9",
+  "@working-theory/ui-signal-collectors": "0.24.7",
   "@working-theory/web": "0.0.0",
   "@working-theory/api": "1.0.0",
   "@working-theory/mcp": "0.0.0",
-  "@working-theory/database": "0.31.0"
+  "@working-theory/database": "0.32.0"
 }