create-ailk 0.19.0 → 0.20.0

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

@@ -3,9 +3,12 @@
 /**
  * artifacts/artifact-actions.ts — the review write (#8234, spec
  * docs/specs/8234-member-artifacts-account-artifacts-and-spec.md D6; the
- * write is #8170's `POST /v1/member/artifacts/:pieceId/review`).
+ * write is #8170's `POST /v1/member/artifacts/:pieceId/review`) and a
+ * proposal's payment (#8516, spec
+ * docs/specs/8516-proposals-as-an-artifact-kind-spec.md D19; the write is
+ * `POST /v1/member/artifacts/:pieceId/payment`).
  *
- * One export: `submitArtifactReview`, the review form's action. It posts
+ * `submitArtifactReview`, the review form's action, posts
  * Approve or Request changes on a piece's latest version through
  * `member.reviewArtifact` with `forwardedCookieInit()`'s init as built — the
  * session cookie plus the request's `Origin` on a single site, the hub
@@ -15,22 +18,38 @@
  * `pieceId` and `version` are untrusted: they are shape-checked here, and the
  * API scopes them to the Person the credential resolves.
  *
+ * A proposal's payment (#8516 D19). An approval whose answered artifact owes
+ * a payment (`paymentDue`) goes straight on to it; `payForProposal`, the Pay
+ * now form's action, does the same from the artifact page. Both run the one
+ * private `startProposalPayment`: `member.payArtifact` with the same init,
+ * then `redirect()` — only to a URL `isStripeCheckoutUrl` admits, so the
+ * client is never sent anywhere but Stripe's hosted Checkout page. The
+ * amount is the API's, from the stored proposal; nothing posted here names
+ * one. Any other outcome is `payment_failed`, and the review stays recorded,
+ * so the page offers Pay now. `redirect()` throws `NEXT_REDIRECT` by design,
+ * so it is called outside any try/catch (`../actions.ts`'s idiom).
+ *
  * Not a `*.actions.ts` file and no `*Action`-suffixed export: apps/mcp's
  * parity test reads that suffix, and the member writes have no MCP twin by
  * decision (8170's header). The reads the pages share live in
  * `artifact-data.ts`, never here — every export of this module is a POST
- * endpoint. A log line carries `err.name` only — never the comment or an id.
+ * endpoint. A log line carries `err.name` only — never the comment, an id
+ * or a Checkout URL.
  */
 
 import { member } from "@working-theory/api-client";
 import {
+  isStripeCheckoutUrl,
   memberReviewBodySchema,
   memberReviewParamsSchema,
   type MemberReviewBody,
 } from "@working-theory/validation";
+import { redirect } from "next/navigation";
 
 import { forwardedCookieInit } from "../../../../../lib/server-api";
 
+import { paymentDue } from "./artifact-data";
+
 /** What the review form shows after a submit. */
 export type ArtifactReviewState =
   | { kind: "idle" }
@@ -42,7 +61,8 @@ export type ArtifactReviewState =
         | "closed"
         | "not_latest"
         | "rate_limited"
-        | "failed";
+        | "failed"
+        | "payment_failed";
     };
 
 export type ArtifactReviewReason = Extract<
@@ -50,6 +70,12 @@ export type ArtifactReviewReason = Extract<
   { kind: "error" }
 >["reason"];
 
+/** What the Pay now form shows after a submit that did not leave for Stripe. */
+export type ProposalPayState =
+  { kind: "idle" } | { kind: "error"; reason: "payment_failed" };
+
+const PAYMENT_FAILED = { kind: "error", reason: "payment_failed" } as const;
+
 function error(reason: ArtifactReviewReason): ArtifactReviewState {
   return { kind: "error", reason };
 }
@@ -119,5 +145,40 @@ export async function submitArtifactReview(
     return error("failed");
   }
   if (!res.ok) return error(refusalReason(res.status, res.body));
+  if (body.review === "approved" && paymentDue(res.body.artifact))
+    return startProposalPayment(pieceId);
   return { kind: "reviewed" };
 }
+
+/** Pay now: open the approved proposal's payment and go to it. */
+export async function payForProposal(
+  _prev: ProposalPayState,
+  formData: FormData,
+): Promise<ProposalPayState> {
+  const pieceId = field(formData, "pieceId");
+  if (!memberReviewParamsSchema.safeParse({ pieceId }).success)
+    return PAYMENT_FAILED;
+  return startProposalPayment(pieceId);
+}
+
+/**
+ * Ask the API for the proposal's Stripe Checkout page and redirect there.
+ * Never returns on success; anything short of a Stripe Checkout URL is
+ * `payment_failed`.
+ */
+async function startProposalPayment(
+  pieceId: string,
+): Promise<typeof PAYMENT_FAILED> {
+  let url: string | null = null;
+  try {
+    const res = await member.payArtifact(pieceId, await forwardedCookieInit());
+    if (res.ok && isStripeCheckoutUrl(res.body.url)) url = res.body.url;
+  } catch (err) {
+    console.error(
+      `[account] payment failed errName=${err instanceof Error ? err.name : "unknown"}`,
+    );
+  }
+  if (url === null) return PAYMENT_FAILED;
+  // Outside any try/catch on purpose — see the file header.
+  redirect(url);
+}

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

@@ -64,6 +64,23 @@ export function isReviewable(a: MemberArtifact): boolean {
   return a.approvedAt === null && a.versions[0]?.review === null;
 }
 
+/**
+ * True for a proposal (#8516 D19). An older hub serves no `kind` (D4: the
+ * key is optional), and such an artifact is a deliverable.
+ */
+export function isProposal(a: MemberArtifact): boolean {
+  return a.kind === "proposal";
+}
+
+/**
+ * True while an approved, priced proposal waits on the client's payment
+ * (#8516 D19). The API serves `due` only where a payment surface answers,
+ * so anything else — `null`, `paid` or an older hub's missing key — is not.
+ */
+export function paymentDue(a: MemberArtifact): boolean {
+  return a.payment?.status === "due";
+}
+
 /** The artifact page of one piece. */
 export function artifactHref(locale: string, pieceId: string): string {
   return localeHref(

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.
  *
@@ -17,6 +18,10 @@
  * failed read renders today's error row with Retry and no frame (spec 7423
  * D12). Nothing here tests the topology: the same file serves a single site
  * and a hub-mode spoke.
+ *
+ * A proposal (#8516, spec docs/specs/8516-proposals-as-an-artifact-kind-spec.md
+ * D19) reads "Proposal · Version <n>" in its caption and Latest cell; a
+ * deliverable reads as before.
  */
 
 import {
@@ -35,6 +40,7 @@ import { ErrorRow } from "../error-row";
 import {
   artifactHref,
   artifactState,
+  isProposal,
   loadArtifacts,
   STATE_KEYS,
   type ArtifactState,
@@ -119,14 +125,18 @@ export default async function AccountArtifactsPage({
       timeZone: "UTC",
     }).format(new Date(latest.deliveredAt));
     const reviewWord = t(STATE_KEYS[state]);
+    const versionWord = t("artifacts.version", { version: latest.version });
+    const latestWord = isProposal(artifact)
+      ? `${t("artifacts.proposal.caption")} · ${versionWord}`
+      : versionWord;
     return {
       id: artifact.id,
       title: artifact.title,
       href: artifactHref(locale, artifact.id),
       facet: state,
-      caption: `${t("artifacts.version", { version: latest.version })} · ${reviewWord}`,
+      caption: `${latestWord} · ${reviewWord}`,
       cells: {
-        latest: t("artifacts.version", { version: latest.version }),
+        latest: latestWord,
         delivered,
         review: reviewWord,
       },
@@ -156,12 +166,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

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

@@ -0,0 +1,81 @@
+"use server";
+
+/**
+ * general/contact-actions.ts — User settings › General's contact-details write
+ * (#8435, spec docs/specs/8435-contact-details-on-the-client-spec.md D13; the
+ * route is `PATCH /v1/member/profile/contact`).
+ *
+ * `saveContact` replaces the member's contact details on THIS site —
+ * `member.updateContact`, never the hub account's name and photo
+ * (`profile-actions.ts`'s `saveProfile` is that) and never another site's
+ * record. It sends `forwardedCookieInit()`'s init: on a single site the session
+ * cookie plus the request's `Origin`, which `apps/api`'s cookie CSRF check
+ * needs; on a hub-mode spoke the hub credential. It takes no identity
+ * argument — who comes from the forwarded credential alone.
+ *
+ * It answers `{ ok: true }` or a refusal `reason` the form maps to its own
+ * line: `telephone` (a number that is not E.164, `400 telephone_invalid`),
+ * `invalid` (any other refused body), `unverified` (`403`), `unavailable`
+ * (`404`, `503`, or `409 contact_unavailable` — a Person of that email held by
+ * another account), else `failed`. Logs carry a status or `err.name` only —
+ * never a name, a number, an address or an email.
+ *
+ * Not a `*.actions.ts` file and no `*Action`-suffixed export: the write has no
+ * MCP twin by decision (8435 D12), and apps/mcp's parity test reads that
+ * suffix.
+ */
+
+import { member } from "@working-theory/api-client";
+
+import { forwardedCookieInit } from "../../../../../lib/server-api";
+
+/** PII-safe error identity for logs (the `profile-actions.ts` idiom: `err.name` only). */
+function errorName(err: unknown): string {
+  return err instanceof Error ? err.name : "unknown";
+}
+
+/** The `error.code` of a member write's refusal body, when it has one. */
+function errorCode(body: unknown): string | null {
+  if (typeof body !== "object" || body === null) return null;
+  const error = (body as { error?: unknown }).error;
+  if (typeof error !== "object" || error === null) return null;
+  const code = (error as { code?: unknown }).code;
+  return typeof code === "string" ? code : null;
+}
+
+export type SaveContactResult =
+  | { ok: true }
+  | {
+      ok: false;
+      reason: "telephone" | "invalid" | "unverified" | "unavailable" | "failed";
+    };
+
+export async function saveContact(
+  input: Parameters<typeof member.updateContact>[0],
+): Promise<SaveContactResult> {
+  // Action input is untrusted: a hand-built call may send anything, and the
+  // API's own schema is the validator — a non-object is refused before any call.
+  if (typeof input !== "object" || input === null)
+    return { ok: false, reason: "invalid" };
+
+  try {
+    const res = await member.updateContact(input, await forwardedCookieInit());
+    if (res.ok) return { ok: true };
+    console.error(`[contact-actions] saveContact status=${res.status}`);
+    if (res.status === 400) {
+      return {
+        ok: false,
+        reason:
+          errorCode(res.body) === "telephone_invalid" ? "telephone" : "invalid",
+      };
+    }
+    if (res.status === 403) return { ok: false, reason: "unverified" };
+    if (res.status === 404 || res.status === 409 || res.status === 503) {
+      return { ok: false, reason: "unavailable" };
+    }
+    return { ok: false, reason: "failed" };
+  } catch (err) {
+    console.error(`[contact-actions] saveContact errName=${errorName(err)}`);
+    return { ok: false, reason: "failed" };
+  }
+}

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

@@ -2,26 +2,34 @@
  * /[locale]/account/general — User settings › General (#8339 D8; builds on
  * #8232 D2).
  *
- * RSC, inside the account layout's SignedInShell with the rail visible, in
- * the member's four-tab settings frame (D7). Renders the shared
+ * RSC, outside the account layout's SignedInShell (#8430), in the member's
+ * settings frame (D7; five tabs since #8438 D14) — 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:
  *
- *   - Request account deletion (`DeletionRequest`, #8232 D5);
+ *   - the contact details (`AccountContactDetails`, #8435 D13) — only on the
+ *     member path, seeded from `member.contact` and saved by `saveContact`;
  *   - 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.
+ * Sign-in moved to Security, cookie settings moved to Notifications then to
+ * Privacy (#8339 C6), and Request account deletion moved to Privacy (#8438
+ * D16) — General no longer renders any of the three.
  *
  * Whether the profile and deletion go through the member API is
  * `loadProfileSource` (D3), never a topology test here.
  */
 
-import { AccountSettingsFrame, AccountSettingsPane } from "@working-theory/templates/account";
-import { localeHref } from "@working-theory/ui";
-import { Separator } from "@working-theory/ui/primitives";
+import { member } from "@working-theory/api-client";
+import {
+  AccountContactDetails,
+  AccountSettingsFrame,
+  AccountSettingsPane,
+  type AccountContact,
+} from "@working-theory/templates/account";
+import { Separator, Text } from "@working-theory/ui/primitives";
 import type { Metadata } from "next";
 import { getTranslations } from "next-intl/server";
 import type { ReactElement } from "react";
@@ -32,7 +40,7 @@ import { siteThemeModeCount } from "../settings/theme-modes";
 import { memberSettingsFrame, SettingsSection, type Translate } from "../settings-frame";
 
 import { BillingAnchor } from "./billing-anchor";
-import { DeletionRequest } from "./deletion-request";
+import { saveContact } from "./contact-actions";
 import { GeneralSettings } from "./profile-form";
 import { loadProfileSource } from "./profile-source";
 
@@ -70,6 +78,19 @@ export default async function AccountGeneralPage({ params }: Props): Promise<Rea
   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")}
@@ -102,24 +123,46 @@ export default async function AccountGeneralPage({ params }: Props): Promise<Rea
       }
       via={source.via}
     >
-      <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>
+      {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}
       {accountSettingsSections.map((section) => (
         <SettingsSection key={section.id} id={section.id} title={ctx.t(section.title)}>
           {section.render(ctx)}

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

@@ -2,8 +2,9 @@
  * 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
+ * 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
@@ -16,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.
@@ -26,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 }>;
@@ -47,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
@@ -65,6 +81,12 @@ 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"),
@@ -72,6 +94,7 @@ export default async function AccountLayout({
         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"),

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

@@ -1,23 +1,35 @@
 /**
  * /[locale]/account/notifications — User settings › Notifications (#8339
- * D8, NEW).
+ * D8; #8438 D15 — what we send you).
  *
- * RSC, inside the account layout's SignedInShell with the rail visible, in
- * the member's four-tab settings frame (D7). Holds the former Privacy
- * section's cookie-settings link, moved here verbatim from General (#8339
- * C6) — for now; notification preferences are a later unit's scope.
+ * RSC, outside the account layout's SignedInShell (#8430), in the member's
+ * settings frame (D7) — standalone, the Admin's shape. Always renders
+ * (decision A, operator 2026-10-12): a `ConsentSwitchList` of the site
+ * registry's `area: "communications"` purposes (`consent` and
+ * `preference`), each read from `GET /v1/member/consents`'s OWN state and
+ * `effective` default (no row ⇒ on for a preference, off for a consent).
+ * With none declared, one `account-notifications-empty` line.
+ *
+ * The cookie-settings link moved to Privacy (#8438 D14, C6) — this tab no
+ * longer renders it.
  */
 
-import { AccountSettingsFrame, AccountSettingsPane } from "@working-theory/templates/account";
-import { localeHref } from "@working-theory/ui";
-import { Link } from "@working-theory/ui/primitives";
+import { member } from "@working-theory/api-client";
+import {
+  AccountSettingsFrame,
+  AccountSettingsPane,
+  ConsentSwitchList,
+  type ConsentSwitchRow,
+} from "@working-theory/templates/account";
 import type { Metadata } from "next";
 import { getTranslations } from "next-intl/server";
 import type { ReactElement } from "react";
 
 import { accountSession } from "../account-data";
+import { setConsentAction } from "../privacy/actions";
 import { memberSettingsFrame, type Translate } from "../settings-frame";
 
+
 interface Props {
   params: Promise<{ locale: string }>;
 }
@@ -25,7 +37,7 @@ interface Props {
 export async function generateMetadata({ params }: Props): Promise<Metadata> {
   const { locale } = await params;
   const t = await getTranslations({ locale, namespace: "account" });
-  return { title: t("settings.notifications.title"), description: t("settings.privacy.lead") };
+  return { title: t("settings.notifications.title"), description: t("settings.notifications.lead") };
 }
 
 export default async function AccountNotificationsPage({ params }: Props): Promise<ReactElement> {
@@ -35,23 +47,57 @@ export default async function AccountNotificationsPage({ params }: Props): Promi
   const frame = memberSettingsFrame(locale, t as unknown as Translate, "notifications");
   const name = session?.ctx.user.name || session?.ctx.user.email || "";
 
+  let rows: ConsentSwitchRow[] = [];
+  let unavailable = false;
+  if (session) {
+    try {
+      const res = await member.consents(session.ctx.init, { locale });
+      if (res.ok) {
+        rows = res.body.purposes
+          .filter((purpose) => purpose.area === "communications")
+          .map((purpose) => ({
+            id: purpose.id,
+            label: purpose.statement,
+            granted: purpose.effective,
+            ...(purpose.description ? { description: purpose.description } : {}),
+            ...(purpose.state
+              ? {
+                  dateLine: purpose.state.granted
+                    ? t("settings.privacy.given", { date: formatDate(purpose.state.at, locale) })
+                    : t("settings.privacy.withdrawn", { date: formatDate(purpose.state.at, locale) }),
+                }
+              : {}),
+          }));
+      } else {
+        unavailable = true;
+      }
+    } catch {
+      unavailable = true;
+    }
+  }
+
   return (
     <AccountSettingsFrame {...frame} name={name}>
       <AccountSettingsPane
         id="account-settings-notifications"
         title={t("settings.notifications.title")}
-        lead={t("settings.privacy.lead")}
+        lead={t("settings.notifications.lead")}
       >
-        <div>
-          <Link
-            href={localeHref(locale, "/privacy#cookie-settings")}
-            className="inline-flex min-h-6 items-center"
-            data-testid="account-cookie-settings"
-          >
-            {t("settings.privacy.cookies")}
-          </Link>
-        </div>
+        {unavailable ? (
+          <span data-testid="account-notifications-unavailable">{t("settings.privacy.unavailable")}</span>
+        ) : (
+          <ConsentSwitchList
+            rows={rows}
+            onChange={setConsentAction}
+            emptyLine={t("settings.notifications.empty")}
+            testIdPrefix="account-notifications"
+          />
+        )}
       </AccountSettingsPane>
     </AccountSettingsFrame>
   );
 }
+
+function formatDate(iso: string, locale: string): string {
+  return new Intl.DateTimeFormat(locale, { dateStyle: "medium" }).format(new Date(iso));
+}