create-ailk 0.18.0 → 0.19.1

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

@@ -0,0 +1,193 @@
+/**
+ * /[locale]/account/general — User settings › General (#8339 D8; builds on
+ * #8232 D2).
+ *
+ * RSC, outside the account layout's SignedInShell (#8430), in the member's
+ * four-tab settings frame (D7) — standalone, the Admin's shape. Renders the shared
+ * `AccountSettings` composition (@working-theory/templates/account, spec
+ * 8339 D4) — the same General form the Admin renders — through the client
+ * adapter `GeneralSettings` (`profile-form.tsx`). Below the form:
+ *
+ *   - the contact details (`AccountContactDetails`, #8435 D13) — only on the
+ *     member path, seeded from `member.contact` and saved by `saveContact`;
+ *   - Request account deletion (`DeletionRequest`, #8232 D5);
+ *   - any section a module contributes (`accountSettingsSections`);
+ *   - `BillingAnchor`, which forwards a `#billing` fragment to Billing.
+ *
+ * Sign-in moved to Security and cookie settings to Notifications (#8339
+ * C6) — General no longer renders either.
+ *
+ * Whether the profile and deletion go through the member API is
+ * `loadProfileSource` (D3), never a topology test here.
+ */
+
+import { member } from "@working-theory/api-client";
+import {
+  AccountContactDetails,
+  AccountSettingsFrame,
+  AccountSettingsPane,
+  type AccountContact,
+} from "@working-theory/templates/account";
+import { localeHref } from "@working-theory/ui";
+import { Separator, Text } from "@working-theory/ui/primitives";
+import type { Metadata } from "next";
+import { getTranslations } from "next-intl/server";
+import type { ReactElement } from "react";
+
+import { accountSettingsSections } from "../../../../../lib/account-config";
+import { accountSession } from "../account-data";
+import { siteThemeModeCount } from "../settings/theme-modes";
+import { memberSettingsFrame, SettingsSection, type Translate } from "../settings-frame";
+
+import { BillingAnchor } from "./billing-anchor";
+import { saveContact } from "./contact-actions";
+import { DeletionRequest } from "./deletion-request";
+import { GeneralSettings } from "./profile-form";
+import { loadProfileSource } from "./profile-source";
+
+interface Props {
+  params: Promise<{ locale: string }>;
+}
+
+export async function generateMetadata({ params }: Props): Promise<Metadata> {
+  const { locale } = await params;
+  const t = await getTranslations({ locale, namespace: "account" });
+  return { title: t("settings.general.title"), description: t("settings.general.lead") };
+}
+
+export default async function AccountGeneralPage({ params }: Props): Promise<ReactElement> {
+  const { locale } = await params;
+  const t = await getTranslations({ locale, namespace: "account" });
+  const session = await accountSession(locale);
+
+  // Unreachable behind the (authed) gate; a session that expired between
+  // the layout and the page renders the pane's title alone.
+  if (!session) {
+    return (
+      <AccountSettingsFrame {...memberSettingsFrame(locale, t as unknown as Translate, "general")} name="">
+        <AccountSettingsPane
+          id="account-settings-general"
+          title={t("settings.general.title")}
+          lead={t("settings.general.lead")}
+        >
+          {null}
+        </AccountSettingsPane>
+      </AccountSettingsFrame>
+    );
+  }
+
+  const { ctx } = session;
+  const source = await loadProfileSource(ctx);
+
+  // #8435 D13 — the person's confirmed contact on this site. A failed read
+  // renders the section's "unavailable" line, never the form: a form seeded
+  // from nothing would offer to replace details it never showed.
+  let contactRead: { ok: true; contact: AccountContact | null } | { ok: false } | null = null;
+  if (source.via === "member") {
+    try {
+      const res = await member.contact(ctx.init);
+      contactRead = res.ok ? { ok: true, contact: res.body.contact } : { ok: false };
+    } catch {
+      contactRead = { ok: false };
+    }
+  }
+
+  return (
+    <GeneralSettings
+      frame={memberSettingsFrame(locale, t as unknown as Translate, "general")}
+      user={{ name: ctx.user.name ?? "", email: ctx.user.email, image: source.image }}
+      labels={{
+        title: t("settings.general.title"),
+        lead: t("settings.general.lead"),
+        colorMode: t("settings.general.colorMode"),
+        light: t("settings.general.light"),
+        auto: t("settings.general.auto"),
+        dark: t("settings.general.dark"),
+        emailLabel: t("settings.general.email"),
+        nameLabel: t("settings.general.name"),
+        photoLabel: t("settings.general.photo"),
+        photoHint: t("settings.general.photoHint"),
+        photoPlaceholder: t("settings.general.photoPlaceholder"),
+        saveButton: t("settings.general.save"),
+        saving: t("settings.general.saving"),
+        saved: t("settings.general.saved"),
+        saveError: t("settings.general.saveError"),
+        nameRequired: t("settings.general.nameRequired"),
+        photoInvalid: t("settings.general.photoInvalid"),
+        unverified: t("settings.general.unverified"),
+        unavailable: t("settings.general.unavailable"),
+      }}
+      colorMode={
+        siteThemeModeCount() > 1
+          ? { cookieName: process.env.NEXT_PUBLIC_THEME_COOKIE_NAME ?? "ailk-theme" }
+          : null
+      }
+      via={source.via}
+    >
+      {contactRead ? (
+        <>
+          <Separator />
+          <div data-testid="account-contact-section">
+            {contactRead.ok ? (
+              <AccountContactDetails
+                contact={contactRead.contact}
+                onSave={saveContact}
+                labels={{
+                  title: t("settings.general.contact.title"),
+                  lead: t("settings.general.contact.lead"),
+                  givenName: t("settings.general.contact.givenName"),
+                  familyName: t("settings.general.contact.familyName"),
+                  telephone: t("settings.general.contact.telephone"),
+                  address: t("settings.general.contact.address"),
+                  companyName: t("settings.general.contact.companyName"),
+                  jobTitle: t("settings.general.contact.jobTitle"),
+                  save: t("settings.general.contact.save"),
+                  saving: t("settings.general.contact.saving"),
+                  saved: t("settings.general.contact.saved"),
+                  addressIncomplete: t("settings.general.contact.addressIncomplete"),
+                  errors: {
+                    telephone: t("settings.general.contact.errors.telephone"),
+                    invalid: t("settings.general.contact.errors.invalid"),
+                    unverified: t("settings.general.contact.errors.unverified"),
+                    unavailable: t("settings.general.contact.errors.unavailable"),
+                    failed: t("settings.general.contact.errors.failed"),
+                  },
+                }}
+              />
+            ) : (
+              <span data-testid="account-contact-unavailable">
+                <Text as="p" variant="body-sm" tone="muted">
+                  {t("settings.general.contact.unavailable")}
+                </Text>
+              </span>
+            )}
+          </div>
+        </>
+      ) : null}
+      <Separator />
+      <div data-testid="account-deletion">
+        <DeletionRequest
+          via={source.via}
+          supportHref={localeHref(locale, "/account/support")}
+          labels={{
+            lead: t("settings.privacy.deletionLead"),
+            action: t("settings.privacy.deletion"),
+            sentSite: t("settings.privacy.deletionSentSite"),
+            sentHub: t("settings.privacy.deletionSentHub"),
+            unverified: t("settings.privacy.deletionUnverified"),
+            unavailable: t("settings.privacy.deletionUnavailable"),
+            error: t("settings.privacy.deletionError"),
+            viaSupport: t("settings.privacy.deletionViaSupport"),
+            supportLink: t("settings.privacy.deletionSupportLink"),
+          }}
+        />
+      </div>
+      {accountSettingsSections.map((section) => (
+        <SettingsSection key={section.id} id={section.id} title={ctx.t(section.title)}>
+          {section.render(ctx)}
+        </SettingsSection>
+      ))}
+      <BillingAnchor locale={locale} />
+    </GeneralSettings>
+  );
+}

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

@@ -0,0 +1,104 @@
+"use client"; // owns the save call and the router.refresh() that follows it
+
+/**
+ * GeneralSettings — User settings › General's adapter over the shared
+ * `AccountSettings` composition (#8339 D8; builds on #8232 D3, D4).
+ *
+ * Rewritten in place from `ProfileForm` (#7430 → #8232), which rendered its
+ * own form. The form, the color logic and the markup now live in
+ * `@working-theory/templates/account`'s `AccountSettings` (spec 8339 D4);
+ * this file supplies `profile` and `onSave` from `via` (General's
+ * `loadProfileSource`, D3):
+ *
+ *   - `member` — `saveProfile` (`PATCH /v1/member/profile`, D6). `image` is
+ *     sent only when the photo field changed (an untouched field never
+ *     clears a photo, 8232 D4/D6); a refusal keeps both fields as typed.
+ *   - `session` — a build with no member API: the name saves through
+ *     Better Auth's own `updateUser`, and no photo field shows
+ *     (`profile="name-only"`).
+ *   - `none` — a hub-mode spoke whose hub answers no member route: no form,
+ *     the name as read-only text (`profile="read-only"`).
+ *
+ * On success, both paths call `router.refresh()` so the rail's name follows
+ * the save.
+ */
+
+import {
+  AccountSettings,
+  type AccountGeneralLabels,
+  type AccountSaveResult,
+  type AccountSettingsFrameProps,
+} from "@working-theory/templates/account";
+import { createAuthClient } from "better-auth/react";
+import { useRouter } from "next/navigation";
+import type { ReactElement, ReactNode } from "react";
+
+import { saveProfile } from "../profile-actions";
+
+const authClient = createAuthClient();
+
+export interface GeneralSettingsLabels extends AccountGeneralLabels {
+  /** The `saveProfile` refusal lines not already in `AccountGeneralLabels`. */
+  unverified: string;
+  unavailable: string;
+}
+
+export function GeneralSettings({
+  frame,
+  user,
+  labels,
+  colorMode,
+  via,
+  children,
+}: {
+  frame: Omit<AccountSettingsFrameProps, "name" | "children">;
+  user: { name: string; email: string; image: string | null };
+  labels: GeneralSettingsLabels;
+  colorMode: { cookieName: string } | null;
+  via: "member" | "session" | "none";
+  children?: ReactNode;
+}): ReactElement {
+  const router = useRouter();
+
+  async function onSave({
+    name,
+    image,
+    imageChanged,
+  }: {
+    name: string;
+    image: string | null;
+    imageChanged: boolean;
+  }): Promise<AccountSaveResult> {
+    if (via === "session") {
+      const { error } = await authClient.updateUser({ name });
+      if (error) return { ok: false, message: labels.saveError };
+      router.refresh();
+      return { ok: true };
+    }
+    const res = await saveProfile(imageChanged ? { name, image } : { name });
+    if (!res.ok) {
+      if (res.reason === "photo") return { ok: false, field: "photo", message: labels.photoInvalid };
+      if (res.reason === "required") return { ok: false, field: "name", message: labels.nameRequired };
+      if (res.reason === "unverified") return { ok: false, message: labels.unverified };
+      if (res.reason === "unavailable") return { ok: false, message: labels.unavailable };
+      return { ok: false, message: labels.saveError };
+    }
+    router.refresh();
+    // exactOptionalPropertyTypes: omit `name` entirely rather than set it to
+    // `undefined` — AccountSaveResult's `name?: string` has no `undefined` value.
+    return { ok: true, image: res.image, ...(res.name !== null ? { name: res.name } : {}) };
+  }
+
+  return (
+    <AccountSettings
+      frame={frame}
+      user={user}
+      labels={labels}
+      colorMode={colorMode}
+      profile={via === "member" ? "editable" : via === "session" ? "name-only" : "read-only"}
+      {...(via === "none" ? {} : { onSave })}
+    >
+      {children}
+    </AccountSettings>
+  );
+}

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

@@ -0,0 +1,73 @@
+/**
+ * general/profile-source.ts (server code) — who saves User settings ›
+ * General's profile and takes its deletion request, and the photo the
+ * profile form starts with (#8232, spec
+ * docs/specs/8232-member-settings-account-general-and-spec.md D3, C2, C5).
+ *
+ * `via` — whether the member API answers, read once per request from
+ * `member.pieces`, the cheapest member read:
+ *
+ *   - `member` — any answer but a 404: a 2xx, any other refusal, a preflight
+ *     refusal (status 0) or a throw. A refusal of another kind belongs to the
+ *     write, which reports it honestly. A `503 tenant_unresolved` is
+ *     `member` too: the writes answer the same 503, shown as unavailable.
+ *   - on a 404, the sign-in seam (`signInMethod()`, D7) says who holds the
+ *     account. A `site` sign-in gives `session`: this site's own sign-in
+ *     holds it, and the 404 is a build with no tenancy module — every member
+ *     read and write registers in one module block — so the name saves
+ *     through Better Auth as before and deletion points at Support. A `hub`
+ *     sign-in gives `none`: the hub holds the account and answers no member
+ *     route for this spoke, and the spoke has no `/api/auth` of its own, so
+ *     no write can reach the account from here.
+ *
+ * A 404 is a module-presence test, as `read()` in `lib/account-config.ts`
+ * already makes; this file names no topology constant itself.
+ *
+ * `image` — the session's photo, which Better Auth's session carries at run
+ * time though the generated `SiteSession` type does not declare it. A hub
+ * session carries none (C5), so on a spoke the form starts empty.
+ */
+
+import { member } from "@working-theory/api-client";
+import type { AccountContext } from "@working-theory/templates/account";
+import { headers } from "next/headers";
+import { cache } from "react";
+
+import { readSession } from "../../../../../lib/topology.generated";
+import { signInMethod } from "../sign-in-method";
+
+export interface ProfileSource {
+  via: "member" | "session" | "none";
+  image: string | null;
+}
+
+/** `user.image` as a trimmed non-blank string, else `null`. */
+function sessionImage(session: unknown): string | null {
+  if (typeof session !== "object" || session === null) return null;
+  const user = (session as { user?: unknown }).user;
+  if (typeof user !== "object" || user === null) return null;
+  const image = (user as { image?: unknown }).image;
+  return typeof image === "string" && image.trim() !== "" ? image.trim() : null;
+}
+
+async function memberApiAnswers(ctx: AccountContext): Promise<boolean> {
+  try {
+    const res = await member.pieces(ctx.init);
+    return res.ok || res.status !== 404;
+  } catch {
+    return true;
+  }
+}
+
+export const loadProfileSource = cache(async (ctx: AccountContext): Promise<ProfileSource> => {
+  // The photo is optional: a failed session read starts the field empty
+  // rather than failing the page.
+  const [answers, session] = await Promise.all([
+    memberApiAnswers(ctx),
+    headers()
+      .then((h) => readSession(h))
+      .catch(() => null),
+  ]);
+  const via = answers ? "member" : signInMethod().kind === "site" ? "session" : "none";
+  return { via, image: sessionImage(session) };
+});

package/templates/apps/web/app/[locale]/(authed)/account/inbox/message/[id]/file/__tests__/route.test.ts

@@ -12,7 +12,9 @@
  * `forwardedCookieInit()` and streams the bytes back. The api-client's
  * `member.messageFile` is the one external boundary mocked; the seal, the
  * cookie read and the route's decisions are real. Covers:
- *   - a 404 unless the web seam's `SIGN_IN_PROVIDER` is `"hub"`, no hub call;
+ *   - on a single site (`SIGN_IN_PROVIDER` `"site"`) the read carries the
+ *     caller's session cookie to the site's own API, and serves the same
+ *     way (#8231 D9) — the route itself tests no topology;
  *   - the read carries the signed-in caller's own credential, and the bytes
  *     come back with all five hub headers unchanged;
  *   - a hub answer missing any of the five is refused 502 — never bytes on
@@ -36,10 +38,11 @@ jest.mock("../../../../../../../../../lib/topology.generated", () => ({
 }));
 
 const mockHeaders = jest.fn();
+const mockCookies = jest.fn();
 jest.mock("next/headers", () => ({
   __esModule: true,
   headers: (...args: unknown[]) => mockHeaders(...args),
-  cookies: jest.fn().mockResolvedValue({ toString: () => "" }),
+  cookies: (...args: unknown[]) => mockCookies(...args),
 }));
 
 import { seal } from "../../../../../../../../../lib/hub-session/seal";
@@ -102,6 +105,7 @@ beforeEach(() => {
   };
   mockProvider.value = "hub";
   mockHeaders.mockReset().mockResolvedValue(new Headers());
+  mockCookies.mockReset().mockResolvedValue({ toString: () => "" });
   mockMessageFile.mockReset().mockResolvedValue(fileResult());
 });
 
@@ -194,12 +198,18 @@ describe("the member file read on a spoke that signs in through its hub", () =>
   });
 });
 
-describe("on a site that does not sign in through a hub", () => {
-  it.each(["site", "none"] as const)("SIGN_IN_PROVIDER %s answers 404 and calls nothing", async (provider) => {
-    mockProvider.value = provider;
-    signedIn();
+describe("on a single site — its own sign-in (#8231 D9)", () => {
+  it("reads the file with the caller's session cookie and serves it with all five headers unchanged", async () => {
+    mockProvider.value = "site";
+    mockCookies.mockResolvedValue({ toString: () => "session=abc" });
     const res = await get();
-    expect(res.status).toBe(404);
-    expect(mockMessageFile).not.toHaveBeenCalled();
+    expect(mockMessageFile).toHaveBeenCalledWith(ID, { headers: { cookie: "session=abc" } });
+    expect(res.status).toBe(200);
+    expect(res.headers.get("content-type")).toBe(FILE_HEADERS.contentType);
+    expect(res.headers.get("content-disposition")).toBe(FILE_HEADERS.contentDisposition);
+    expect(res.headers.get("x-content-type-options")).toBe(FILE_HEADERS.contentTypeOptions);
+    expect(res.headers.get("content-security-policy")).toBe(FILE_HEADERS.contentSecurityPolicy);
+    expect(res.headers.get("cache-control")).toBe(FILE_HEADERS.cacheControl);
+    await expect(res.text()).resolves.toBe("%PDF-1.7 bytes");
   });
 });

package/templates/apps/web/app/[locale]/(authed)/account/inbox/message/[id]/file/route.ts

@@ -3,8 +3,8 @@
  *
  * A message's file action (the `message` Inbox kind, `lib/account-config.ts`)
  * links here. The browser holds neither the client's hub credential (sealed in
- * the `hub-session` cookie) nor this site's spoke key, so this route reads the
- * hub's `GET /v1/member/messages/:id/file` with `forwardedCookieInit()` — the
+ * the `hub-session` cookie) nor this site's spoke key, so this route reads
+ * `GET /v1/member/messages/:id/file` with `forwardedCookieInit()` — the
  * caller's own credential, so a client only ever gets their own file — and
  * streams the bytes back unread.
  *
@@ -16,8 +16,8 @@
  * A hub answer missing any of the five is refused 502 rather than served
  * without it.
  *
- * Only a spoke that signs in through its hub (`SIGN_IN_PROVIDER === "hub"`,
- * #7894) carries the credential; anywhere else this is a 404 with no call.
+ * On a single site the read carries the caller's session cookie; on a spoke
+ * that signs in through its hub, the client's hub credential (#8231 D9).
  * A refusal has no body: no credential (signed out) is a 401, a hub 4xx keeps
  * its status, and a hub 5xx, a transport the api-client refuses or a hub call
  * that throws is a 502.
@@ -25,7 +25,6 @@
 import { member, type MemberFileHeaders } from "@working-theory/api-client";
 
 import { forwardedCookieInit } from "../../../../../../../../lib/server-api";
-import { SIGN_IN_PROVIDER } from "../../../../../../../../lib/topology.generated";
 
 interface Context {
   params: Promise<{ locale: string; id: string }>;
@@ -55,7 +54,6 @@ function refusalStatus(status: number, body: unknown): number {
 
 // platform-decisions-waiver: api-versioning — a page-scoped download link on the site's own account area, not an API contract; it re-serves the versioned hub route /v1/member/messages/:id/file
 export async function GET(_request: Request, { params }: Context): Promise<Response> {
-  if (SIGN_IN_PROVIDER !== "hub") return refusal(404);
   const { id } = await params;
 
   // The api-client throws, rather than answering `{ ok: false }`, on a

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

@@ -2,9 +2,11 @@
  * The account layout — the base account area's frame (#7430, spec 7423 U4 ·
  * D4, D13; DESIGN.md §2b).
  *
- * RSC. Every `/account` route renders inside `SignedInShell` (through the
- * client `AccountFrame`): the site's logo as the rail's top tile, linking
- * home; Inbox as the rail's only row; a footer of the avatar and ? alone;
+ * RSC. Every `/account` route but the four Settings tabs renders inside
+ * `SignedInShell` (through the client `AccountFrame`; the tabs draw their own
+ * standalone settings frame, #8430): the site's logo as the rail's top tile, linking
+ * home; the rail's rows — Inbox, a Library group holding Artifacts, then
+ * Settings (#8231 D1); 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 · For you · Help (#7469).
@@ -15,6 +17,10 @@
  * area's own "Add your name" item (`loadForYou`, deduped per request with
  * the Inbox's phone For you tab); with no items there is no aside.
  *
+ * #8465 — `SIGN_OUT_ENDPOINT` (set only on a spoke that signs in through its
+ * hub) and `SIGN_IN_PATH` ride down as props; the client frame cannot import
+ * the generated seam, and the signed-in Nav reads it the same way.
+ *
  * 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
  * unframed and degrades on its own.
@@ -25,11 +31,22 @@ import { getTranslations } from "next-intl/server";
 import type { ReactElement, ReactNode } from "react";
 
 import { siteLogo } from "../../../../lib/site-logo";
+import { SIGN_IN_PATH, SIGN_OUT_ENDPOINT } from "../../../../lib/topology.generated";
 
 import { accountSession, loadForYou } from "./account-data";
 import { AccountFrame } from "./account-frame";
 import { forYouLabels } from "./for-you-labels";
 
+/** The value when it parses as an https URL, else undefined: operator config is rendered as an href. */
+function httpsUrl(value: string | undefined): string | undefined {
+  if (!value) return undefined;
+  try {
+    return new URL(value).protocol === "https:" ? value : undefined;
+  } catch {
+    return undefined;
+  }
+}
+
 interface Props {
   children: ReactNode;
   params: Promise<{ locale: string }>;
@@ -46,7 +63,7 @@ export default async function AccountLayout({
   const t = await getTranslations({ locale, namespace: "account" });
   const forYou = await loadForYou(locale);
   const { name, email } = session.ctx.user;
-  const helpCenterUrl = process.env.AILK_HELP_CENTER_URL;
+  const helpCenterUrl = httpsUrl(process.env.AILK_HELP_CENTER_URL);
 
   return (
     <AccountFrame
@@ -64,11 +81,20 @@ export default async function AccountLayout({
           : []),
       ]}
       forYou={{ items: forYou.items, now: forYou.now, labels: forYouLabels(session.ctx.t) }}
+      {...(SIGN_OUT_ENDPOINT
+        ? {
+            signOutEndpoint: SIGN_OUT_ENDPOINT,
+            signInHref: localeHref(locale, SIGN_IN_PATH ?? "/"),
+          }
+        : {})}
       labels={{
         home: t("frame.home"),
         inbox: t("frame.inbox"),
         forYou: t("frame.forYou"),
         settings: t("frame.settings"),
+        library: t("frame.library"),
+        artifacts: t("frame.artifacts"),
+        signOutFailed: t("frame.signOutFailed"),
         signOut: t("frame.signOut"),
         help: t("frame.help"),
         accountMenu: t("frame.accountMenu"),