create-ailk 0.19.0 → 0.19.1

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

@@ -1,15 +1,23 @@
 /**
  * Tests for /[locale]/account/security — User settings › Security (#8339
- * D8, NEW). Moved from general.test.tsx's "Sign-in" cases (#8339 D12):
- * the frame with Security current, and `signInMethod()`'s three branches
- * (#8232 D7) — configured methods, none, and (hub-mode.test.tsx) the hub
- * line.
+ * D8; #8431 D2, D3, AC-2, AC-3, AC-4).
+ *
+ *   - the frame with Security current (#8339);
+ *   - AC-2: a site or hub that can email a password link shows the Password
+ *     row from the session's own accounts, and its button requests a link
+ *     for the person's own address with the server-built `redirectTo`; a
+ *     seam rendered before #8431 degrades to the sentence;
+ *   - AC-3: any other site shows one sentence naming the deployment's
+ *     methods, never a provider list;
+ *   - AC-4 (site half): Log out signs out through Better Auth and lands on
+ *     the sign-in page, and a failed log-out navigates nowhere. The spoke
+ *     half is hub-mode.test.tsx's.
  */
 import { mkdtempSync, rmSync, writeFileSync } from "node:fs";
 import { tmpdir } from "node:os";
 import { join } from "node:path";
 
-import { render, screen, within } from "@testing-library/react";
+import { act, fireEvent, render, screen, within } from "@testing-library/react";
 
 jest.mock("next-intl/server", () => {
   const msgs: unknown = require("../../../../../messages/en.json");
@@ -41,12 +49,32 @@ jest.mock("next/headers", () => ({
 }));
 
 const mockGetSession = jest.fn();
+const mockListUserAccounts = jest.fn();
 // eslint-disable-next-line no-restricted-syntax -- #507: mock-internal rewrite pending; auth.ts's lazy Better-Auth singleton has no HTTP/DB boundary a unit test of the session fields can mock without standing up Prisma.
 jest.mock("../../../../../auth", () => ({
   __esModule: true,
-  auth: { api: { getSession: (...args: unknown[]) => mockGetSession(...args) } },
+  auth: {
+    api: {
+      getSession: (...args: unknown[]) => mockGetSession(...args),
+      listUserAccounts: (...args: unknown[]) => mockListUserAccounts(...args),
+    },
+  },
 }));
 
+/** `stale: true` serves the seam as one rendered before #8431 — no accounts reader (D2b). */
+const mockSeam = { stale: false };
+// eslint-disable-next-line no-restricted-syntax -- #507: the seam is generated per build (#7894 D8); a seam rendered before #8431 (D2b) is the boundary under test, and no env or HTTP surface selects it.
+jest.mock("../../../../../lib/topology.generated", () => {
+  const real = jest.requireActual("../../../../../lib/topology.generated") as Record<string, unknown>;
+  return {
+    ...real,
+    __esModule: true,
+    get readOwnAccounts(): unknown {
+      return mockSeam.stale ? undefined : real.readOwnAccounts;
+    },
+  };
+});
+
 jest.mock("@working-theory/api-client", () => ({
   __esModule: true,
   waitlistSignups: { me: jest.fn() },
@@ -58,9 +86,21 @@ jest.mock("@working-theory/api-client", () => ({
   visitorForwardHeaders: () => null,
 }));
 
+const mockRequestPasswordReset = jest.fn();
+const mockSignOut = jest.fn();
+jest.mock("better-auth/react", () => ({
+  __esModule: true,
+  createAuthClient: () => ({
+    requestPasswordReset: (...args: unknown[]) => mockRequestPasswordReset(...args),
+    signOut: (...args: unknown[]) => mockSignOut(...args),
+  }),
+}));
+
+const mockPush = jest.fn();
+const mockRefresh = jest.fn();
 jest.mock("next/navigation", () => ({
   __esModule: true,
-  useRouter: () => ({ push: jest.fn(), refresh: jest.fn(), replace: jest.fn() }),
+  useRouter: () => ({ push: mockPush, refresh: mockRefresh, replace: jest.fn() }),
   usePathname: () => "/account/security",
   redirect: jest.fn(),
 }));
@@ -77,6 +117,7 @@ const SESSION = {
   },
 };
 
+const BASE_URL = "https://site.example.com";
 const ENV = process.env;
 const ENV_KEYS = [
   "GOOGLE_CLIENT_ID",
@@ -86,6 +127,9 @@ const ENV_KEYS = [
   "AUTH_EMAIL_SERVER",
   "AUTH_EMAIL_FROM",
   "AUTH_EMAIL_WEBHOOK_SECRET",
+  "AILK_AUTH_PASSWORD_RESET",
+  "BETTER_AUTH_URL",
+  "BETTER_AUTH_SECRET",
 ] as const;
 
 let contentRoot: string;
@@ -97,6 +141,12 @@ beforeEach(() => {
   process.env.AILK_CONTENT_ROOT = contentRoot;
   writeFileSync(join(contentRoot, "_site.mdx"), '---\nsiteName: "Test"\n---\n');
   mockGetSession.mockReset().mockResolvedValue(SESSION);
+  mockListUserAccounts.mockReset().mockResolvedValue([]);
+  mockRequestPasswordReset.mockReset().mockResolvedValue({ data: { status: true }, error: null });
+  mockSignOut.mockReset().mockResolvedValue({ data: { success: true }, error: null });
+  mockPush.mockReset();
+  mockRefresh.mockReset();
+  mockSeam.stale = false;
 });
 
 afterEach(() => {
@@ -108,6 +158,26 @@ async function renderPage(locale = "en"): Promise<void> {
   render(await Page({ params: Promise.resolve({ locale }) }));
 }
 
+/** The five `resetSendConfigured()` conjuncts (C1). */
+function enableReset(): void {
+  process.env.AILK_AUTH_PASSWORD_RESET = "true";
+  process.env.AUTH_EMAIL_SERVER = "smtp://x";
+  process.env.AUTH_EMAIL_FROM = "site@example.com";
+  process.env.AUTH_EMAIL_WEBHOOK_SECRET = "w".repeat(32);
+  process.env.BETTER_AUTH_URL = BASE_URL;
+  process.env.BETTER_AUTH_SECRET = "s".repeat(32);
+}
+
+function enableGoogle(): void {
+  process.env.GOOGLE_CLIENT_ID = "id";
+  process.env.GOOGLE_CLIENT_SECRET = "secret";
+}
+
+function enableGitHub(): void {
+  process.env.GITHUB_CLIENT_ID = "id";
+  process.env.GITHUB_CLIENT_SECRET = "secret";
+}
+
 describe("the frame (D7, D8)", () => {
   it("renders in the settings frame with Security current", async () => {
     await renderPage();
@@ -118,22 +188,222 @@ describe("the frame (D7, D8)", () => {
   });
 });
 
-describe("Sign-in — the configured methods (D7, moved from general.test.tsx)", () => {
-  it("lists each configured method as Available", async () => {
-    process.env.GOOGLE_CLIENT_ID = "id";
-    process.env.GOOGLE_CLIENT_SECRET = "secret";
-    process.env.AUTH_EMAIL_SERVER = "smtp://x";
-    process.env.AUTH_EMAIL_FROM = "site@example.com";
+describe("the standalone shape (#8430)", () => {
+  it("takes the screen as the Admin's settings do: the rail column and the pane are the page's own landmarks", async () => {
+    await renderPage();
+    const settings = screen.getByTestId("account-settings");
+    expect(settings).toHaveClass("min-h-screen");
+    const column = within(settings).getByRole("complementary");
+    expect(column.firstElementChild).toBe(screen.getByTestId("account-settings-back"));
+    expect(column).toContainElement(screen.getByTestId("account-settings-rail"));
+    expect(within(settings).getByRole("main")).toContainElement(
+      screen.getByRole("heading", { level: 1 }),
+    );
+  });
+});
+
+describe("AC-2 — a site or hub that can email a password link", () => {
+  beforeEach(enableReset);
+
+  it("with no password: Not set, the create note and Set password — read from the session's own accounts", async () => {
+    await renderPage();
+    expect(screen.getByRole("heading", { level: 2 })).toHaveTextContent("Sign-in methods");
+    expect(screen.getByTestId("account-security-password-status")).toHaveTextContent("Not set");
+    expect(screen.getByTestId("account-security-password-note")).toHaveTextContent(
+      "We'll email ada@example.com a secure link to create your password.",
+    );
+    expect(screen.getByTestId("account-security-password-request")).toHaveTextContent("Set password");
+    expect(mockListUserAccounts).toHaveBeenCalledTimes(1);
+    expect(mockListUserAccounts.mock.calls[0]?.[0]).toEqual({ headers: expect.any(Headers) });
+    expect(document.querySelector('input[type="password"]')).toBeNull();
+    expect(screen.getByTestId("account-security-log-out")).toBeInTheDocument();
+  });
+
+  it("with a credential account: Set, the change note and Change password", async () => {
+    mockListUserAccounts.mockResolvedValue([{ providerId: "google" }, { providerId: "credential" }]);
+    await renderPage();
+    expect(screen.getByTestId("account-security-password-status")).toHaveTextContent("Set");
+    expect(screen.getByTestId("account-security-password-note")).toHaveTextContent(
+      "We'll email ada@example.com a secure link to change your password.",
+    );
+    expect(screen.getByTestId("account-security-password-request")).toHaveTextContent("Change password");
+  });
+
+  it("a failed accounts read renders the error row in the block's place, with Log out still rendered", async () => {
+    const errorSpy = jest.spyOn(console, "error").mockImplementation(() => {});
+    mockListUserAccounts.mockRejectedValue(new TypeError("db down"));
+    await renderPage();
+    expect(within(screen.getByTestId("account-signin-method")).getByTestId("inbox-error")).toHaveTextContent(
+      "We couldn't check your password settings.",
+    );
+    expect(screen.queryByTestId("account-security-password")).not.toBeInTheDocument();
+    expect(screen.getByTestId("account-security-log-out")).toBeInTheDocument();
+    expect(errorSpy.mock.calls.map((args) => args.join(" "))).toEqual([
+      "[account] read failed source=security-password errName=TypeError",
+    ]);
+    errorSpy.mockRestore();
+  });
+
+  it.each([
+    ["en", `${BASE_URL}/reset-password`],
+    ["fr", `${BASE_URL}/fr/reset-password`],
+  ])("Set password (%s) requests a link for the session's own address with the server-built redirectTo", async (locale, redirectTo) => {
+    await renderPage(locale);
+    await act(async () => {
+      fireEvent.click(screen.getByTestId("account-security-password-request"));
+    });
+    expect(mockRequestPasswordReset).toHaveBeenCalledTimes(1);
+    expect(mockRequestPasswordReset).toHaveBeenCalledWith({ email: "ada@example.com", redirectTo });
+    expect(screen.getByTestId("account-security-password-sent")).toBeInTheDocument();
+  });
+
+  it("a refused request shows the error, not the sent line", async () => {
+    mockRequestPasswordReset.mockResolvedValue({ data: null, error: { status: 429 } });
+    await renderPage();
+    await act(async () => {
+      fireEvent.click(screen.getByTestId("account-security-password-request"));
+    });
+    expect(screen.getByTestId("account-security-password-error")).toBeInTheDocument();
+    expect(screen.queryByTestId("account-security-password-sent")).not.toBeInTheDocument();
+  });
+
+  it("with Google configured as well, no provider list renders", async () => {
+    enableGoogle();
+    await renderPage();
+    expect(screen.getByTestId("account-security-password")).toBeInTheDocument();
+    expect(screen.queryByText(/Google/)).not.toBeInTheDocument();
+  });
+
+  it("a seam rendered before #8431 (no accounts reader) degrades to the sentence, never the error row (D2b)", async () => {
+    mockSeam.stale = true;
+    await renderPage();
+    // The five reset conjuncts include the email link's four, so a site that
+    // can email a password link always offers the email link too.
+    expect(screen.getByTestId("account-security-sentence")).toHaveTextContent(
+      "You sign in with a link sent to ada@example.com or your email and password.",
+    );
+    expect(screen.queryByTestId("account-security-password")).not.toBeInTheDocument();
+    expect(screen.queryByTestId("inbox-error")).not.toBeInTheDocument();
+    expect(screen.getByTestId("account-security-log-out")).toBeInTheDocument();
+    expect(mockListUserAccounts).not.toHaveBeenCalled();
+  });
+});
+
+describe("AC-3 — a site that cannot email a password link shows one sentence", () => {
+  it.each([
+    ["Google alone", [enableGoogle], "You sign in with Google."],
+    ["Google and GitHub", [enableGoogle, enableGitHub], "You sign in with Google or GitHub."],
+    [
+      "the email link alone",
+      [
+        () => {
+          process.env.AUTH_EMAIL_WEBHOOK_SECRET = "w".repeat(32);
+          process.env.AUTH_EMAIL_FROM = "site@example.com";
+          process.env.BETTER_AUTH_URL = BASE_URL;
+          process.env.BETTER_AUTH_SECRET = "s".repeat(32);
+        },
+      ],
+      "You sign in with a link sent to ada@example.com.",
+    ],
+    [
+      "the password method without the reset flag",
+      [
+        () => {
+          process.env.AUTH_EMAIL_SERVER = "smtp://x";
+          process.env.AUTH_EMAIL_FROM = "site@example.com";
+        },
+      ],
+      "You sign in with your email and password.",
+    ],
+  ])("%s", async (_label, arrange, sentence) => {
+    for (const step of arrange) step();
+    await renderPage();
+    expect(screen.getByTestId("account-security-sentence")).toHaveTextContent(sentence);
+    expect(screen.queryByText("You're signed in as ada@example.com.")).not.toBeInTheDocument();
+    expect(screen.queryByTestId("account-security-password")).not.toBeInTheDocument();
+    expect(screen.queryByText("Sign-in methods")).not.toBeInTheDocument();
+    expect(screen.queryByText("Available")).not.toBeInTheDocument();
+    expect(mockListUserAccounts).not.toHaveBeenCalled();
+    expect(screen.getByTestId("account-security-log-out")).toBeInTheDocument();
+  });
+
+  it("with no configured method it names the signed-in address (C5)", async () => {
+    await renderPage();
+    expect(screen.getByTestId("account-security-sentence")).toHaveTextContent(
+      "You're signed in as ada@example.com.",
+    );
+  });
+
+  it("the old Sign-in keys are gone and every added key carries its D5 value", () => {
+    const msgs = require("../../../../../messages/en.json") as {
+      account: { settings: { signIn: Record<string, unknown>; security: Record<string, unknown> } };
+    };
+    const { signIn, security } = msgs.account.settings;
+    expect(Object.keys(signIn)).toEqual(["lead"]);
+    expect(security).toEqual({
+      title: "Security",
+      methodsHeading: "Sign-in methods",
+      passwordLabel: "Password",
+      passwordSet: "Set",
+      passwordNotSet: "Not set",
+      setHint: "Add a password so you can also sign in with your email and password.",
+      changeHint: "Change the password you sign in with.",
+      setNote: "We'll email {email} a secure link to create your password.",
+      changeNote: "We'll email {email} a secure link to change your password.",
+      setButton: "Set password",
+      changeButton: "Change password",
+      sending: "Sending…",
+      sent: "Link sent. It works once, for an hour. Saving a password signs you out everywhere.",
+      sendFailed: "We couldn't send the email. Try again in a few minutes.",
+      logOut: "Log out",
+      logOutFailed: "Log out didn't finish. Try again.",
+      signsInWith: "You sign in with {methods}.",
+      signedInAs: "You're signed in as {email}.",
+      methods: {
+        google: "Google",
+        github: "GitHub",
+        magicLink: "a link sent to {email}",
+        password: "your email and password",
+      },
+      managedAt: "Your sign-in is managed at {hub}.",
+      managedUnnamed: "Your sign-in is managed by our main site.",
+      manageOnHub: "Manage sign-in on {hub}",
+      passwordUnavailable: "We couldn't check your password settings.",
+    });
+  });
+});
+
+describe("AC-4 — Log out on a site", () => {
+  it.each([
+    ["en", "/sign-in"],
+    ["fr", "/fr/sign-in"],
+  ])("(%s) signs out through Better Auth once and lands on the sign-in page", async (locale, href) => {
+    enableGoogle();
+    await renderPage(locale);
+    await act(async () => {
+      fireEvent.click(screen.getByTestId("account-security-log-out"));
+    });
+    expect(mockSignOut).toHaveBeenCalledTimes(1);
+    expect(mockPush).toHaveBeenCalledWith(href);
+    expect(mockRefresh).toHaveBeenCalledTimes(1);
+  });
+
+  it("a refused sign-out navigates nowhere and shows the error", async () => {
+    mockSignOut.mockResolvedValue({ data: null, error: { status: 500 } });
     await renderPage();
-    const signIn = screen.getByTestId("account-signin-method");
-    expect(within(signIn).getByTestId("account-signin-google")).toHaveTextContent("Available");
-    expect(within(signIn).getByText("Google")).toBeInTheDocument();
-    expect(within(signIn).getByText("Password")).toBeInTheDocument();
-    expect(within(signIn).queryByText("GitHub")).not.toBeInTheDocument();
+    await act(async () => {
+      fireEvent.click(screen.getByTestId("account-security-log-out"));
+    });
+    expect(mockPush).not.toHaveBeenCalled();
+    expect(screen.getByTestId("account-security-log-out-error")).toBeInTheDocument();
   });
 
-  it("no configured method says so", async () => {
+  it.each([
+    ["password", enableReset],
+    ["sentence", enableGoogle],
+  ])("the %s variant has no 'other devices' control", async (_label, arrange) => {
+    arrange();
     await renderPage();
-    expect(screen.getByTestId("account-signin-method")).toHaveTextContent("No sign-in method is configured.");
+    expect(screen.queryByText(/other devices/i)).toBeNull();
   });
 });

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

@@ -9,6 +9,11 @@
  * for D2–D9. A `#billing` fragment never reaches the server, so the server
  * redirect is to General and `BillingAnchor` forwards the fragment there
  * (`general.test.tsx` § AC-6).
+ *
+ * #8441 — `SETTINGS_ROUTES` (settings-frame.tsx) is the one list of User
+ * settings' routes: the tabs read it, and so does `isSettingsPath`, the
+ * exact, locale-aware membership test the account frame takes the settings
+ * routes out of its shell with (layout.test.tsx renders each route).
  */
 
 const mockRedirect = jest.fn();
@@ -18,6 +23,7 @@ jest.mock("next/navigation", () => ({
 }));
 
 import Page from "../settings/page";
+import { isSettingsPath, memberSettingsFrame, SETTINGS_ROUTES, type Translate } from "../settings-frame";
 
 beforeEach(() => {
   mockRedirect.mockReset();
@@ -35,3 +41,52 @@ describe("AC-6 — /account/settings redirects to /account/general (D8)", () =>
     expect(mockRedirect).toHaveBeenCalledWith("/fr/account/general");
   });
 });
+
+describe("the one list of User settings' routes (#8441)", () => {
+  it("names the four tabs, in the reference's order", () => {
+    expect(SETTINGS_ROUTES.map(({ key, path }) => [key, path])).toEqual([
+      ["general", "/account/general"],
+      ["security", "/account/security"],
+      ["notifications", "/account/notifications"],
+      ["billing", "/account/billing"],
+    ]);
+  });
+
+  it.each(["en", "fr"])("the settings frame's tabs are that list, in %s", (locale) => {
+    const t: Translate = (key) => key;
+    const { tabs } = memberSettingsFrame(locale, t, "security");
+    expect(tabs.map(({ key, href, label }) => [key, href, label])).toEqual(
+      SETTINGS_ROUTES.map(({ key, path, titleKey }) => [
+        key,
+        locale === "en" ? path : `/${locale}${path}`,
+        titleKey,
+      ]),
+    );
+  });
+});
+
+describe("isSettingsPath — an exact, locale-aware match (#8441)", () => {
+  it.each(SETTINGS_ROUTES.map(({ path }) => path))("%s is a settings route, bare or prefixed", (path) => {
+    expect(isSettingsPath(path, "en")).toBe(true);
+    expect(isSettingsPath(`/fr${path}`, "fr")).toBe(true);
+  });
+
+  it.each([
+    ["/account", "en"],
+    ["/account/settings", "en"],
+    ["/account/support", "en"],
+    ["/account/artifacts", "en"],
+    // A sub-route stays inside the shell unless it is listed.
+    ["/account/billing/history", "en"],
+    ["/fr/account/billing/history", "fr"],
+    ["/account/general/", "en"],
+    ["/account/generalx", "en"],
+    // Only the request's own locale is a prefix.
+    ["/fr/account/general", "en"],
+    ["/de/account/general", "fr"],
+    ["/frx/account/general", "fr"],
+    ["", "en"],
+  ])("%s (locale %s) is not", (path, locale) => {
+    expect(isSettingsPath(path, locale)).toBe(false);
+  });
+});

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

@@ -1,4 +1,4 @@
-"use client"; // the shell owns collapse state; sign-out is a client-side Better Auth call + router navigation
+"use client"; // the shell owns collapse state; sign-out is a client-side hub-session POST or Better Auth call + router navigation
 
 /**
  * AccountFrame — the account area's SignedInShell composition (#7430, spec
@@ -7,8 +7,21 @@
  * what only the client has: the current path and the sign-out call.
  *
  * `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.
+ * out ends the session, then navigates and refreshes so every RSC under the
+ * `(authed)` gate re-reads the (now absent) session.
+ *
+ * #8465 — a spoke that signs in through its hub (#7894) holds its session in
+ * a sealed cookie only `POST /api/hub-session/sign-out` clears (it also
+ * revokes the credential at the hub); Better Auth's `signOut()` hits a route
+ * that spoke does not serve. The server layout reads the generated seam's
+ * `SIGN_OUT_ENDPOINT` and hands it down as `signOutEndpoint` — the signed-in
+ * Nav's own pattern, because a client component cannot import the seam. With
+ * an endpoint, Log out POSTs it and navigates to the sign-in page only when
+ * the answer was 2xx; a refused or failed sign-out (a 403 on an Origin
+ * mismatch, a 5xx, a network error) leaves the cookie valid, so the frame
+ * stays on the page and says so, never routing away with a live session.
+ * Without an endpoint (a hub or a single site) nothing changes: Better Auth,
+ * then home.
  *
  * #8231 D1, as amended by #8334 — the rail reads Inbox, a Library group
  * holding Artifacts, and the footer's ?. Settings is not a rail row: it lives
@@ -35,6 +48,15 @@
  * portals to `document.body` (the avatar/help menus, For-you, New, the phone
  * sheets) without the wrapper adding a box — `contents` keeps the shell's own
  * layout (`min-h-screen`) unchanged.
+ *
+ * #8430 — the User settings routes take the screen as the Admin's do: the
+ * frame renders the page alone, inside the marker only — no rail, no Inbox,
+ * no AppShell — and the page draws the shared `AccountSettingsFrame` in its
+ * standalone shape, its own column flush and full height with Back to the
+ * Inbox at its top. The marker stays, so the Admin's tokens still reach the
+ * settings in both modes. Which routes those are is `isSettingsPath` — an
+ * exact match on `SETTINGS_ROUTES`, the list the settings tabs read too
+ * (#8441), so a sub-route stays inside the shell.
  */
 
 import {
@@ -50,7 +72,7 @@ import {
   type SignedInShellProps,
 } from "@working-theory/templates/shells";
 import { localeHref } from "@working-theory/ui";
-import { Link } from "@working-theory/ui/primitives";
+import { InlineMessage, Link } from "@working-theory/ui/primitives";
 import { createAuthClient } from "better-auth/react";
 import { Inbox, Layers, Settings, Sparkles } from "lucide-react";
 import { usePathname, useRouter, useSearchParams } from "next/navigation";
@@ -58,6 +80,7 @@ import { useState, type ReactElement, type ReactNode } from "react";
 
 import { ACCOUNT_PERSIST_KEY } from "./for-you-labels";
 import { NewMenuSlotProvider } from "./new-menu";
+import { isSettingsPath } from "./settings-frame";
 
 const authClient = createAuthClient();
 
@@ -74,6 +97,8 @@ export interface AccountFrameLabels extends SignedInShellLabels {
   /** The rail's Library group heading (#8231 D1). */
   library: string;
   artifacts: string;
+  /** Shown when a hub sign-out is refused or fails (#8465). */
+  signOutFailed: string;
 }
 
 export interface AccountFrameProps {
@@ -84,6 +109,14 @@ export interface AccountFrameProps {
   helpItems: NonNullable<SignedInShellProps["helpItems"]>;
   forYou: { items: readonly ForYouItem[]; now: string; labels: ForYouLabels };
   labels: AccountFrameLabels;
+  /**
+   * Where Log out POSTs on a spoke that signs in through its hub (the seam's
+   * `SIGN_OUT_ENDPOINT`, read by the server layout). Absent or `null`: Better
+   * Auth's client signs out (#8465).
+   */
+  signOutEndpoint?: string | null;
+  /** Where Log out lands after a hub sign-out; defaults to the site home. */
+  signInHref?: string;
   children: ReactNode;
 }
 
@@ -94,6 +127,8 @@ export function AccountFrame({
   helpItems,
   forYou,
   labels,
+  signOutEndpoint,
+  signInHref,
   children,
 }: AccountFrameProps): ReactElement {
   const router = useRouter();
@@ -101,12 +136,23 @@ export function AccountFrame({
   const searchParams = useSearchParams();
   const [dismissed] = useForYouDismissed(ACCOUNT_PERSIST_KEY);
   const [topBarActions, setTopBarActions] = useState<HTMLElement | null>(null);
+  const [signOutFailed, setSignOutFailed] = useState(false);
 
   const homeHref = localeHref(locale, "/");
   const inboxHref = localeHref(locale, "/account");
   const artifactsHref = localeHref(locale, "/account/artifacts");
   const settingsHref = localeHref(locale, "/account/general");
   const within = (href: string): boolean => pathname === href || pathname.startsWith(`${href}/`);
+
+  // #8430 — a Settings page draws its own standalone frame: the marker only.
+  if (isSettingsPath(pathname, locale)) {
+    return (
+      <div className="contents" data-ailk-shell="account" data-testid="account-shell">
+        {children}
+      </div>
+    );
+  }
+
   // The Inbox row stays selected on an item's own page (/account/inbox/…).
   const onInbox = pathname === inboxHref || pathname.startsWith(`${inboxHref}/inbox/`);
   const activePath = onInbox ? inboxHref : within(artifactsHref) ? artifactsHref : undefined;
@@ -118,6 +164,24 @@ export function AccountFrame({
 
   const onSignOut = (): void => {
     void (async () => {
+      setSignOutFailed(false);
+      if (signOutEndpoint) {
+        // A refused or failed sign-out leaves the session cookie valid, so the
+        // page must not pretend otherwise by navigating away (#8465).
+        try {
+          const res = await fetch(signOutEndpoint, { method: "POST", credentials: "same-origin" });
+          if (!res.ok) {
+            setSignOutFailed(true);
+            return;
+          }
+        } catch {
+          setSignOutFailed(true);
+          return;
+        }
+        router.push(signInHref ?? homeHref);
+        router.refresh();
+        return;
+      }
       try {
         await authClient.signOut();
       } catch {
@@ -136,6 +200,7 @@ export function AccountFrame({
     settings,
     library,
     artifacts,
+    signOutFailed: signOutFailedLabel,
     ...shellLabels
   } = labels;
 
@@ -222,6 +287,11 @@ export function AccountFrame({
           : {})}
         labels={shellLabels}
       >
+        {signOutFailed ? (
+          <InlineMessage variant="error" className="px-4 pt-3" data-testid="account-sign-out-error">
+            {signOutFailedLabel}
+          </InlineMessage>
+        ) : null}
         <PhoneTabProvider tab={phoneTab}>
           <NewMenuSlotProvider node={onInboxRoute ? topBarActions : null}>
             {children}

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

@@ -8,7 +8,8 @@
  * page's structure: a second column with an "All artifacts" count and a
  * Review facet group (Ready for review · Changes requested · Approved),
  * each counted over every artifact with zeros kept, and a table of Title ·
- * Latest · Delivered · Review in the read's order — newest delivery first.
+ * Latest · Delivered · Review in the read's order — newest delivery first;
+ * the Review column is wide enough for its longest state label (#8361).
  * Below `md` the column becomes a filter select and the table becomes the
  * phone row list.
  *
@@ -156,12 +157,8 @@ export default async function AccountArtifactsPage({
           width: "1/6",
           minWidth: "28",
         },
-        {
-          key: "review",
-          header: t("artifacts.columns.review"),
-          width: "1/6",
-          minWidth: "32",
-        },
+        // Sized by the frame from the longest state label (#8361).
+        { key: "review", header: t("artifacts.columns.review"), fit: "facets" },
       ]}
       rows={artifacts.map(row)}
       labels={{

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

@@ -2,8 +2,8 @@
  * /[locale]/account/billing — User settings › Billing (#8339 D8; builds on
  * #8232 D9, AC-MAA-19).
  *
- * RSC, inside the account layout's SignedInShell with the rail visible, in
- * the member's four-tab settings frame (D7). Lays out like the Admin's
+ * RSC, outside the account layout's SignedInShell (#8430), in the member's
+ * four-tab settings frame (D7) — standalone, the Admin's shape. Lays out like the Admin's
  * organization Billing page (`OrgBillingPanel`'s `current-plan` layout):
  * the shared `CurrentPlanCard` (@working-theory/templates/account, spec
  * 8339 D5), by `loadBilling()`'s answer (`billing-source.ts`, the billing
@@ -11,7 +11,7 @@
  *
  *   - a subscription — the plan (or `unnamedPlan`), the status plus when
  *     access ends (when set, C4 — `subscription.me` carries no price), the
- *     card on file, then Manage in Stripe when a portal is available;
+ *     card on file, then Manage billing when a portal is available;
  *   - no subscription — the same card shape with the plain line and no
  *     button (C5);
  *   - a failed read — the area's error row with Retry, never a false "you