@cosmicdrift/kumiko-samples 0.338.0

package/packages/bundled-features/src/user-data-rights-defaults/hooks/user.userdata-hook.ts

@@ -0,0 +1,126 @@
+import { createEventStoreExecutor } from "@cosmicdrift/kumiko-framework/db";
+import {
+  createSystemUser,
+  type UserDataDeleteHook,
+  type UserDataExportHook,
+} from "@cosmicdrift/kumiko-framework/engine";
+import {
+  USER_ANONYMIZED_DISPLAY_NAME,
+  USER_ANONYMIZED_EMAIL_DOMAIN,
+  USER_ANONYMIZED_EMAIL_PREFIX,
+  USER_DELETED_DISPLAY_NAME,
+  USER_DELETED_EMAIL_PREFIX,
+  USER_STATUS,
+  userEntity,
+  userTable,
+} from "../../user/index.js";
+
+// Forget writes go through the executor (events), not a raw UPDATE: a
+// projection rebuild replays the events, so the anonymization survives it.
+// A direct write would be wiped on rebuild — the Art.17 hole this fixes.
+const crud = createEventStoreExecutor(userTable, userEntity, { entityName: "user" });
+
+// userData-Hook fuer user-entity (S2.H1).
+//
+// Export-Hook liefert Profil-Daten ohne security-sensitive Felder
+// (passwordHash, roles, status — DSGVO Art. 20 ist Datenportabilitaet
+// fuer das was der User selbst zur Verfuegung gestellt hat, nicht
+// Lifecycle-Metadata oder Authorization-State).
+//
+// Delete-Hook anonymisiert PII + setzt status=deleted. Der eigentliche
+// softDelete-Flag wird ueber drizzle's deletedAt-Column gesetzt; die
+// Row bleibt fuer Audit-Trail erhalten (alle FK-Refs auf user.id
+// bleiben gueltig). DSGVO-konform via PII-Anonymisierung.
+//
+// Strategy:
+//   "delete":    softDelete + email/displayName/passwordHash leeren,
+//                status=deleted (Login geblockt)
+//   "anonymize": email/displayName auf Pseudonym, Row bleibt active
+//                — fuer Cases wo User-Row als FK noch relevant ist
+//                aber PII raus muss (z.B. anonymize mit blockDelete-
+//                Frist auf einer FK-target-Entity)
+
+export const userExportHook: UserDataExportHook = async (ctx) => {
+  const row = await ctx.db.fetchOne<{
+    id: string;
+    email: string;
+    displayName: string;
+    locale: string | null;
+    emailVerified: boolean;
+  }>(userTable, { id: ctx.userId });
+
+  if (!row) return null;
+
+  return {
+    entity: "user",
+    rows: [
+      {
+        id: row.id,
+        email: row.email,
+        displayName: row.displayName,
+        locale: row.locale,
+        emailVerified: row.emailVerified,
+      },
+    ],
+  };
+};
+
+export const userDeleteHook: UserDataDeleteHook = async (ctx, strategy) => {
+  // Idempotent: zweiter Call findet die Row schon anonymized + skipt
+  // implicit (UPDATE mit gleichen Werten). Memory feedback_event_store_
+  // tenant_consistency: ctx.tenantId muss in der user-table-Zeile
+  // korrelieren — user.id ist tenant-agnostic (User kann in mehreren
+  // Tenants Member sein), kein tenantId-Filter noetig.
+
+  // System actor + skipOptimisticLock: the forget pipeline has no read
+  // version and writes privileged identity columns ("system" is privileged).
+  // crud.update extracts the raw connection from ctx.db via tenantDbRunner
+  // and enforces global-entity tenancy itself (isForeignTenantOnGlobalEntity),
+  // so it reaches the row by id regardless of which tenant pass triggered it —
+  // TenantDb's own tenant-scoping narrowing never applies to executor writes.
+  const systemUser = createSystemUser(ctx.tenantId);
+
+  if (strategy === "delete") {
+    // PII raus + status=deleted (Login geblockt) via Event → Rebuild spielt den
+    // Forget mit. KEIN softDelete: user ist systemStream (eine tenant-agnostische
+    // Row), der Forget laeuft pro Tenant — wuerde isDeleted gesetzt, faende der
+    // loadById (isDeleted:false) die Row beim zweiten Tenant nicht mehr
+    // (not_found). status=Deleted blockt Login; die Row bleibt findbar +
+    // idempotent ueber mehrere Tenant-Durchlaeufe (wie der alte raw UPDATE).
+    await crud.update(
+      {
+        id: ctx.userId,
+        changes: {
+          email: `${USER_DELETED_EMAIL_PREFIX}-${ctx.userId}@${USER_ANONYMIZED_EMAIL_DOMAIN}`,
+          displayName: USER_DELETED_DISPLAY_NAME,
+          passwordHash: null,
+          status: USER_STATUS.Deleted,
+          // deleted_at as an audit timestamp only — NOT isDeleted (see above).
+          // Frozen into the event payload, so a rebuild replays the same value.
+          deletedAt: Temporal.Now.instant(),
+        },
+      },
+      systemUser,
+      ctx.db,
+      { skipOptimisticLock: true },
+    );
+  } else {
+    // anonymize: PII raus, aber Row bleibt active (damit FK-References
+    // weiter aufloesbar sind). Account ist effektiv weiter nutzbar
+    // wenn der User sich neu authentifiziert — pragmatisch akzeptabel
+    // weil "anonymize" auf user-entity ein seltener Edge-Case ist
+    // (typisch hard-delete fuer User).
+    await crud.update(
+      {
+        id: ctx.userId,
+        changes: {
+          email: `${USER_ANONYMIZED_EMAIL_PREFIX}-${ctx.userId}@${USER_ANONYMIZED_EMAIL_DOMAIN}`,
+          displayName: USER_ANONYMIZED_DISPLAY_NAME,
+        },
+      },
+      systemUser,
+      ctx.db,
+      { skipOptimisticLock: true },
+    );
+  }
+};

package/packages/bundled-features/src/user-data-rights-defaults/index.ts

@@ -0,0 +1,32 @@
+export { createUserDataRightsDefaultsFeature } from "./feature.js";
+export { apiTokenDeleteHook, apiTokenExportHook } from "./hooks/api-token.userdata-hook.js";
+export {
+  configValueDeleteHook,
+  configValueExportHook,
+} from "./hooks/config-value.userdata-hook.js";
+export {
+  deliveryAttemptDeleteHook,
+  deliveryAttemptExportHook,
+} from "./hooks/delivery-attempt.userdata-hook.js";
+export {
+  fileRefDeleteHook,
+  fileRefExportHook,
+} from "./hooks/file-ref.userdata-hook.js";
+export {
+  inAppMessageDeleteHook,
+  inAppMessageExportHook,
+} from "./hooks/in-app-message.userdata-hook.js";
+export { jobRunDeleteHook, jobRunExportHook } from "./hooks/job-run.userdata-hook.js";
+export {
+  notificationPreferenceDeleteHook,
+  notificationPreferenceExportHook,
+} from "./hooks/notification-preference.userdata-hook.js";
+export {
+  tenantInvitationDeleteHook,
+  tenantInvitationExportHook,
+} from "./hooks/tenant-invitation.userdata-hook.js";
+export { userDeleteHook, userExportHook } from "./hooks/user.userdata-hook.js";
+export {
+  userSessionDeleteHook,
+  userSessionExportHook,
+} from "./hooks/user-session.userdata-hook.js";

package/packages/bundled-features/src/user-profile/changes.json

@@ -0,0 +1,21 @@
+[
+  {
+    "version": "0.243.1",
+    "type": "fix",
+    "title": "Security fix: ChangePasswordSection/ChangeEmailSection no longer nest a <form> inside the host RenderEdit form.",
+    "detail": "Since `profile` became a declarative `projectionDetail` screen (fw#2312), RenderEdit wraps the whole singleton screen in its own host `<form>`. `ChangePasswordSection` and `ChangeEmailSection` were each rendering their own `<Form>` inside that host, creating invalid nested `<form>` DOM. The submit button silently fell back to a native GET submission of the outer form instead of dispatching a write, putting the entered password(s) in the URL query string (browser history, `Referer` header, proxy/server access logs — `ChangePasswordSection` leaked both the old and the new password). Both sections now follow the same no-nested-form pattern `write-form-section.tsx` uses: a plain container with a `type=\"button\"` that calls the write dispatcher directly. testIds are unchanged; Enter-to-submit inside these two sections is an accepted, deliberate trade-off (same one `write-form-section.tsx` already makes)."
+  },
+  {
+    "version": "0.241.0",
+    "type": "breaking",
+    "title": "user-profile now registers its own profile screen (id user-profile:screen:profile); app-side profile screen registrations must be removed (fw#2312).",
+    "detail": "`profile` is now a declarative `projectionDetail` screen bound to `user:query:user:me` instead of a custom React component: change-password and change-email stay `EditExtensionSection` components (re-auth flows a declarative action can't express), account deletion (request/cancel via `user-data-rights`, grace period) is now fully declarative fields + `actions: RowAction[]`, preserving the original confirm dialog and `visible: {field, eq/ne}` toggle 1:1. `userProfileClient()` now registers the two extension-section components via `extensionSectionComponents` instead of exposing a `ProfileScreen` component for apps to place in a `components` map. `ProfileScreen` is a dead export. New exports: `ChangeEmailSection`, `ChangePasswordSection` (the two surviving extension components, importable for tests but not meant to be placed manually). Known UI regression, accepted for this pass (same trade-off as `privacy-center`): the deletion confirm-dialog title is now always the action's `label`; the dynamically composed grace-period banner sentence is gone, replaced by a plain `gracePeriodEnd` date field; there is no cancel-deletion success toast.",
+    "migration": "The bundled feature now registers the `profile` screen itself (id `user-profile:screen:profile`) — an app's own `profile` custom-screen registration collides on boot with a duplicate short-id error. Delete the app-side registration entirely: `r.screen({ id: \"profile\", type: \"custom\", renderer: { react: { __component: \"UserProfileScreen\" } }, access: { openToAll: true } })` has no replacement to write, just remove the call. If you have an `r.nav({ screen: \"profile\" })` (or any other reference to the app-local `profile` screen id), repoint it at `\"user-profile:screen:profile\"`. Also remove `components: { UserProfileScreen: ProfileScreen }` from your renderer/client setup and the now-unused `ProfileScreen` import — the client no longer exposes that component. Known affected consumers (not modified here, out of this PR's scope): `money-horse` (`src/features/money-horse/feature.ts:286-292`) and `offlot-app` (`src/features/account/feature.ts:24-30`) both currently register their own `profile` custom screen this way."
+  },
+  {
+    "version": "0.123.2",
+    "type": "fix",
+    "title": "Consistency: user-profile's ProfileScreen adopts the shared `FormScreenShell` (centered `…",
+    "detail": "Consistency: user-profile's ProfileScreen adopts the shared `FormScreenShell` (centered `max-w-3xl` like all other settings screens, was left-aligned `max-w-5xl`). DataTable now sits on `bg-card` instead of a transparent surface — on themes with a colored page background (e.g. cream) lists previously didn't match the white cards; now they do. - @cosmicdrift/kumiko-renderer-web@0.123.2 - @cosmicdrift/kumiko-framework@0.123.2 - @cosmicdrift/kumiko-dispatcher-live@0.123.2 - @cosmicdrift/kumiko-headless@0.123.2 - @cosmicdrift/kumiko-renderer@0.123.2"
+  }
+]

package/packages/bundled-features/src/user-profile/constants.ts

@@ -0,0 +1,35 @@
+// @runtime client
+// Plain string constants — client-marked so web/profile-screen.tsx can
+// import them; runtime code (handlers/feature) may pull client files anyway.
+
+export const USER_PROFILE_FEATURE = "user-profile" as const;
+
+export const PROFILE_SCREEN_ID = "profile" as const;
+
+// EditExtensionSection `__component` markers (fw#2312) — change-password and
+// change-email stay React components (re-auth flows a declarative action
+// can't express); deletion moved to declarative fields/actions on the screen
+// itself (feature.ts), same split as user-data-rights' privacy-center.
+export const CHANGE_EMAIL_SECTION_EXTENSION_NAME = "UserProfileChangeEmailSection" as const;
+export const CHANGE_PASSWORD_SECTION_EXTENSION_NAME = "UserProfileChangePasswordSection" as const;
+
+export const UserProfileHandlers = {
+  changeEmail: "user-profile:write:change-email",
+} as const;
+
+// Foreign QNs the profile screen dispatches, pinned here instead of as
+// magic strings in the screen (and instead of runtime-barrel imports, which
+// would violate runtime isolation). Drift guard: the integration test
+// compares these against the owning features' original constants.
+export const UserProfileQueries = {
+  me: "user:query:user:me",
+} as const;
+
+export const UserDataRightsHandlers = {
+  requestDeletion: "user-data-rights:write:request-deletion",
+  cancelDeletion: "user-data-rights:write:cancel-deletion",
+} as const;
+
+export const UserProfileErrors = {
+  emailUnchanged: "email_unchanged",
+} as const;

package/packages/bundled-features/src/user-profile/feature.ts

@@ -0,0 +1,154 @@
+import {
+  defineFeature,
+  type FeatureDefinition,
+  i18nKey,
+} from "@cosmicdrift/kumiko-framework/engine";
+import {
+  CHANGE_EMAIL_SECTION_EXTENSION_NAME,
+  CHANGE_PASSWORD_SECTION_EXTENSION_NAME,
+  PROFILE_SCREEN_ID,
+  UserDataRightsHandlers,
+  UserProfileQueries,
+} from "./constants.js";
+import { changeEmailWrite } from "./handlers/change-email.write.js";
+
+export function createUserProfileFeature(): FeatureDefinition {
+  return defineFeature("user-profile", (r) => {
+    r.describe(
+      "Self-service account page (fw#2312: declarative `projectionDetail` bound to " +
+        "the signed-in user's own `me` row) plus its `change-email` write handler " +
+        "(re-auth via current password, uniqueness check, resets emailVerified and " +
+        "expects the app to trigger the verification flow). Change-password and " +
+        "change-email stay custom `EditExtensionSection` components (re-auth flows a " +
+        "declarative action can't express); account deletion (user-data-rights " +
+        "request/cancel with grace period) is declarative fields + actions. Apps " +
+        'place the screen (id "profile") in their logged-in area via r.nav — no ' +
+        '`type: "custom"` / `__component` registration needed on the app side ' +
+        "anymore. Requires `user`, `auth-email-password`, `user-data-rights`, and " +
+        "`user-data-rights-defaults` (so the GDPR boot-validator finds export/delete " +
+        "hooks for `user`'s PII fields once user-data-rights is mounted).",
+    );
+    r.uiHints({
+      displayLabel: "User Profile · Self-Service",
+      category: "identity",
+      recommended: true,
+    });
+    r.requires("user");
+    r.requires("auth-email-password");
+    r.requires("user-data-rights");
+    r.requires("user-data-rights-defaults");
+
+    const handlers = {
+      changeEmail: r.writeHandler(changeEmailWrite),
+    };
+
+    // Boot-validator requires a "screen:<id>.title" key per r.screen(), plus
+    // one entry per i18nKey()-marked dot-form label below — kept inline (not
+    // imported from ./i18n) so feature.ts, part of the server barrel, stays
+    // importable from a server-only sample without a jsx tsconfig (i18n.ts
+    // pulls @cosmicdrift/kumiko-renderer's types, see index.ts). Values are
+    // duplicated in i18n.ts's client bundle.
+    r.translations({
+      keys: {
+        "screen:profile.title": { en: "Profile" },
+        "profile.screen.profile.subtitle": {
+          en: "Change your password or email, or request account deletion.",
+        },
+        "profile.email.title": { en: "Email address" },
+        "profile.password.title": { en: "Password" },
+        "profile.danger.title": { en: "Delete account" },
+        "profile.danger.explainer": {
+          en: "Your account will be permanently deleted after a grace period. Until then you can cancel the deletion at any time.",
+        },
+        "profile.danger.gracePeriodEnd": { en: "Deletion date" },
+        "profile.danger.delete": { en: "Delete account" },
+        "profile.danger.dialogDescription": {
+          en: "After the grace period your data will be permanently deleted. Until then you can cancel.",
+        },
+        "profile.danger.cancelDeletion": { en: "Cancel deletion" },
+      },
+    });
+
+    // Self-service account screen: change-email/change-password stay
+    // self-persisting extension sections (re-auth, own dispatcher writes —
+    // contributesToFormSubmit omitted since projectionDetail has no form
+    // submit of its own, see the boot-validator's check for that). Deletion
+    // is declarative fields + actions, same split as user-data-rights'
+    // privacy-center screen (../user-data-rights/feature.ts) which this
+    // mirrors 1:1 for the confirm/visible semantics. access is openToAll
+    // because no app role name is portable; the per-user handlers enforce
+    // auth server-side.
+    r.screen({
+      id: PROFILE_SCREEN_ID,
+      type: "projectionDetail",
+      query: UserProfileQueries.me,
+      singleton: true,
+      access: {
+        openToAll: {
+          reason:
+            "each signed-in user manages only their own profile: change-email/password " +
+            "re-authenticate the caller, and deletion request/cancel act on the caller's " +
+            "own userId; no app role name is portable enough to gate this",
+        },
+      },
+      // Self-service settings-area screen, placed by the consuming app's own
+      // r.nav() (see samples/apps/use-all-bundled's screens-feature.ts).
+      dormant: true,
+      description: "profile.screen.profile.subtitle",
+      fieldLabels: {
+        gracePeriodEnd: i18nKey("profile.danger.gracePeriodEnd"),
+      },
+      layout: {
+        sections: [
+          {
+            kind: "extension",
+            title: i18nKey("profile.email.title"),
+            component: { react: { __component: CHANGE_EMAIL_SECTION_EXTENSION_NAME } },
+            entityName: "user",
+          },
+          {
+            kind: "extension",
+            title: i18nKey("profile.password.title"),
+            component: { react: { __component: CHANGE_PASSWORD_SECTION_EXTENSION_NAME } },
+            entityName: "user",
+          },
+          {
+            title: i18nKey("profile.danger.title"),
+            description: i18nKey("profile.danger.explainer"),
+            // gracePeriodEnd is only meaningful once a deletion is actually
+            // pending — hide it instead of showing an empty date when status
+            // isn't deletionRequested (same rule as privacy-center).
+            fields: [
+              {
+                field: "gracePeriodEnd",
+                renderer: { format: "date" as const },
+                visible: { field: "status", eq: "deletionRequested" },
+              },
+            ],
+          },
+        ],
+      },
+      actions: [
+        {
+          id: "request-deletion",
+          label: i18nKey("profile.danger.delete"),
+          handler: UserDataRightsHandlers.requestDeletion,
+          confirm: i18nKey("profile.danger.dialogDescription"),
+          visible: { field: "status", ne: "deletionRequested" },
+          style: "danger",
+        },
+        {
+          id: "cancel-deletion",
+          label: i18nKey("profile.danger.cancelDeletion"),
+          handler: UserDataRightsHandlers.cancelDeletion,
+          visible: { field: "status", eq: "deletionRequested" },
+          style: "secondary",
+          // Declared: the id's last segment ("deletion") would otherwise resolve to the destructive trash icon.
+          icon: "x",
+        },
+      ],
+    });
+
+    return { handlers };
+  });
+}

package/packages/bundled-features/src/user-profile/handlers/change-email.write.ts

@@ -0,0 +1,99 @@
+import {
+  access,
+  createSystemUser,
+  defineWriteHandler,
+  SYSTEM_TENANT_ID,
+} from "@cosmicdrift/kumiko-framework/engine";
+import { UnprocessableError, writeFailure } from "@cosmicdrift/kumiko-framework/errors";
+import * as z from "zod";
+import { AuthErrors } from "../../auth-email-password/index.js";
+import { decryptStoredPii, verifyPassword } from "../../shared/index.js";
+import { UserErrors, UserHandlers, UserQueries } from "../../user/index.js";
+import { UserProfileErrors } from "../constants.js";
+
+// Gleiche Failure-Shape wie auth-email-password (anti-enumeration):
+// dessen errors.ts ist nicht Teil des Feature-Barrels, der Reason-Code
+// + i18nKey sind aber stabile Public-API.
+// @wrapper-known error-helper
+function invalidCredentials() {
+  return writeFailure(
+    new UnprocessableError(AuthErrors.invalidCredentials, {
+      i18nKey: "auth.errors.invalidCredentials",
+    }),
+  );
+}
+
+// Change-email — authenticated, self-only. Der User bestätigt mit seinem
+// aktuellen Passwort (Re-Auth wie change-password); die neue Adresse wird
+// via ctx.writeAs(system) gegen den user-update-Handler geschrieben, weil
+// `email` field-level privileged ist und bei Self-Updates sonst silent
+// gestrippt würde. emailVerified flippt auf false — die App triggert
+// anschließend den Verification-Flow (request-email-verification ist
+// public; der ProfileScreen ruft ihn nach Erfolg auf).
+export const changeEmailWrite = defineWriteHandler({
+  name: "change-email",
+  schema: z.object({
+    currentPassword: z.string().min(1),
+    newEmail: z.email(),
+  }),
+  access: { roles: access.authenticated },
+  escapeHatch: {
+    reason:
+      "Reads the caller's own passwordHash via ctx.queryAs(SYSTEM, user:findForAuth), checks " +
+      "email uniqueness the same way, and writes the new email via ctx.writeAs(SYSTEM, " +
+      "user:update) — field-access on passwordHash/email is privileged-only.",
+  },
+  // Payload carries the current password.
+  agent: { expose: false },
+  description:
+    "Replaces the signed-in caller's own email address after re-checking their current password, refusing an unchanged or already-taken address and clearing the verified flag so the app can re-run email verification.",
+  handler: async (event, ctx) => {
+    const systemUser = createSystemUser(event.user.tenantId);
+
+    const me = (await ctx.queryAs(systemUser, UserQueries.findForAuth, {
+      id: event.user.id,
+    })) as { id: string; email: string; passwordHash: string | null; version: number } | null; // @cast-boundary db-runner
+
+    if (!me?.passwordHash) {
+      return invalidCredentials();
+    }
+
+    const passwordOk = await verifyPassword(me.passwordHash, event.payload.currentPassword);
+    if (!passwordOk) {
+      return invalidCredentials();
+    }
+
+    const newEmail = event.payload.newEmail.toLowerCase();
+    const currentEmail = await decryptStoredPii(me.email, "email", "user-profile:change-email");
+    if (newEmail === currentEmail.toLowerCase()) {
+      return writeFailure(
+        new UnprocessableError(UserProfileErrors.emailUnchanged, {
+          i18nKey: "profile.errors.emailUnchanged",
+        }),
+      );
+    }
+
+    const existing = await ctx.queryAs(systemUser, UserQueries.findForAuth, { email: newEmail });
+    if (existing !== null) {
+      return writeFailure(
+        new UnprocessableError(UserErrors.emailAlreadyExists, {
+          i18nKey: "user.errors.emailAlreadyExists",
+        }),
+      );
+    }
+
+    // user ist systemStream (#497): der Event-Stream liegt deterministisch
+    // auf SYSTEM_TENANT_ID. Pre-#497-Streams brauchen einmalig
+    // backfillUserStreamTenants (#762).
+    const writer = createSystemUser(SYSTEM_TENANT_ID);
+
+    const writeRes = await ctx.writeAs(writer, UserHandlers.update, {
+      id: me.id,
+      version: me.version,
+      changes: { email: newEmail, emailVerified: false },
+    });
+    if (!writeRes.isSuccess) return writeRes;
+
+    return { isSuccess: true, data: { kind: "email-changed", email: newEmail } };
+  },
+});

package/packages/bundled-features/src/user-profile/i18n.ts

@@ -0,0 +1,46 @@
+// @runtime client
+// Default bundles for the `profile` screen. userProfileClient() hangs this
+// in the LocaleProvider as a fallback bundle — apps override individual keys
+// via `userProfileClient({ translations })`.
+// `auth.errors.invalidCredentials` + `user.errors.emailAlreadyExists` are
+// duplicated here so the screen stays fully translated even without those
+// features' own bundles.
+
+import type { TranslationsByLocale } from "@cosmicdrift/kumiko-renderer";
+
+export const defaultTranslations: TranslationsByLocale = {
+  en: {
+    "screen:profile.title": "Profile",
+    "profile.screen.profile.subtitle":
+      "Change your password or email, or request account deletion.",
+
+    "profile.email.title": "Email address",
+    "profile.email.current": "Current email",
+    "profile.email.new": "New email",
+    "profile.email.currentPassword": "Current password",
+    "profile.email.submit": "Change email",
+    "profile.email.success": "Email changed. Please confirm your new address.",
+
+    "profile.password.title": "Password",
+    "profile.password.old": "Current password",
+    "profile.password.new": "New password",
+    "profile.password.confirm": "Confirm new password",
+    "profile.password.submit": "Change password",
+    "profile.password.success": "Password changed.",
+    "profile.password.mismatch": "Passwords do not match.",
+
+    "profile.danger.title": "Delete account",
+    "profile.danger.explainer":
+      "Your account will be permanently deleted after a grace period. Until then you can cancel the deletion at any time.",
+    "profile.danger.delete": "Delete account",
+    "profile.danger.dialogDescription":
+      "After the grace period your data will be permanently deleted. Until then you can cancel.",
+    "profile.danger.gracePeriodEnd": "Deletion date",
+    "profile.danger.cancelDeletion": "Cancel deletion",
+
+    "profile.errors.generic": "Something went wrong.",
+    "profile.errors.emailUnchanged": "That is already your email address.",
+    "user.errors.emailAlreadyExists": "This email address is already in use.",
+    "auth.errors.invalidCredentials": "Invalid email or password.",
+  },
+};

package/packages/bundled-features/src/user-profile/index.ts

@@ -0,0 +1,11 @@
+// Bewusst OHNE i18n-Export: das Server-Barrel muss von Server-Samples
+// ohne jsx-tsconfig kompilierbar bleiben (i18n zieht kumiko-renderer →
+// .tsx). Translations kommen via ./web (userProfileClient).
+export {
+  USER_PROFILE_FEATURE,
+  UserDataRightsHandlers,
+  UserProfileErrors,
+  UserProfileHandlers,
+  UserProfileQueries,
+} from "./constants.js";
+export { createUserProfileFeature } from "./feature.js";

package/packages/bundled-features/src/user-profile/web/client-plugin.ts

@@ -0,0 +1,45 @@
+// @runtime client
+import {
+  type ExtensionSectionComponent,
+  mergeTranslations,
+  type TranslationsByLocale,
+} from "@cosmicdrift/kumiko-renderer";
+import type { ComponentType, ReactNode } from "react";
+import {
+  CHANGE_EMAIL_SECTION_EXTENSION_NAME,
+  CHANGE_PASSWORD_SECTION_EXTENSION_NAME,
+} from "../constants.js";
+import { defaultTranslations } from "../i18n.js";
+import { ChangeEmailSection, ChangePasswordSection } from "./profile-screen.js";
+
+export type UserProfileClientOptions = {
+  /** Per-key overrides on top of the default bundles (de/en). */
+  readonly translations?: TranslationsByLocale;
+};
+
+export type UserProfileClientFeature = {
+  readonly name: "user-profile";
+  readonly providers: readonly ComponentType<{ children: ReactNode }>[];
+  readonly gates: readonly ComponentType<{ children: ReactNode }>[];
+  readonly translations: TranslationsByLocale;
+  readonly extensionSectionComponents: Readonly<Record<string, ExtensionSectionComponent>>;
+};
+
+// Supplies the ChangeEmail/ChangePassword extension components for the
+// declarative `profile` projectionDetail screen (fw#2312, ../feature.ts,
+// registered there server-side) plus the default translations. Apps add it
+// via createKumikoApp({ clientFeatures: [userProfileClient()] }) and place
+// the screen (id "profile") via r.nav — the screen itself has no r.nav of
+// its own, same as user-data-rights' privacy-center.
+export function userProfileClient(options?: UserProfileClientOptions): UserProfileClientFeature {
+  return {
+    name: "user-profile",
+    providers: [],
+    gates: [],
+    translations: mergeTranslations(defaultTranslations, options?.translations ?? {}),
+    extensionSectionComponents: {
+      [CHANGE_EMAIL_SECTION_EXTENSION_NAME]: ChangeEmailSection,
+      [CHANGE_PASSWORD_SECTION_EXTENSION_NAME]: ChangePasswordSection,
+    },
+  };
+}

package/packages/bundled-features/src/user-profile/web/index.ts

@@ -0,0 +1,6 @@
+export {
+  type UserProfileClientFeature,
+  type UserProfileClientOptions,
+  userProfileClient,
+} from "./client-plugin.js";
+export { ChangeEmailSection, ChangePasswordSection } from "./profile-screen.js";