@cosmicdrift/kumiko-bundled-features 0.255.1 → 0.256.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cosmicdrift/kumiko-bundled-features",
-  "version": "0.255.1",
+  "version": "0.256.0",
   "description": "Built-in features — tenant, user, auth, delivery. The stuff you'd rewrite anyway, already typed.",
   "license": "BUSL-1.1",
   "author": "Marc Frost <marc@cosmicdriftgamestudio.com>",
@@ -130,12 +130,12 @@
     "./workflow-runner": "./src/workflow-runner/index.ts"
   },
   "dependencies": {
-    "@cosmicdrift/kumiko-dispatcher-live": "0.255.1",
-    "@cosmicdrift/kumiko-framework": "0.255.1",
-    "@cosmicdrift/kumiko-headless": "0.255.1",
-    "@cosmicdrift/kumiko-renderer": "0.255.1",
-    "@cosmicdrift/kumiko-renderer-web": "0.255.1",
-    "@cosmicdrift/kumiko-types": "0.255.1",
+    "@cosmicdrift/kumiko-dispatcher-live": "0.256.0",
+    "@cosmicdrift/kumiko-framework": "0.256.0",
+    "@cosmicdrift/kumiko-headless": "0.256.0",
+    "@cosmicdrift/kumiko-renderer": "0.256.0",
+    "@cosmicdrift/kumiko-renderer-web": "0.256.0",
+    "@cosmicdrift/kumiko-types": "0.256.0",
     "@mollie/api-client": "^4.5.0",
     "@node-rs/argon2": "^2.0.2",
     "@types/mailparser": "^3.4.6",
@@ -164,7 +164,7 @@
   "devDependencies": {
     "@testing-library/user-event": "^14.6.1",
     "@types/qrcode": "^1.5.5",
-    "@cosmicdrift/kumiko-locale-de": "0.255.1",
-    "@cosmicdrift/kumiko-locale-es": "0.255.1"
+    "@cosmicdrift/kumiko-locale-de": "0.256.0",
+    "@cosmicdrift/kumiko-locale-es": "0.256.0"
   }
 }

package/src/audit/feature.ts

@@ -2,6 +2,7 @@ import {
   access,
   defineFeature,
   type FeatureDefinition,
+  i18nKey,
 } from "@cosmicdrift/kumiko-framework/engine";
 import { AUDIT_LOG_DETAIL_SCREEN_ID, AUDIT_LOG_SCREEN_ID, AuditQueries } from "./constants";
 import { detailsQuery } from "./handlers/details.query";
@@ -44,9 +45,13 @@ export function createAuditFeature(): FeatureDefinition {
       type: "projectionList",
       query: AuditQueries.list,
       columns: [
-        { field: "createdAt", label: "audit.log.col.when", renderer: { format: "timestamp" } },
-        { field: "type", label: "audit.log.col.type" },
-        { field: "createdBy", label: "audit.log.col.actor" },
+        {
+          field: "createdAt",
+          label: i18nKey("audit.log.col.when"),
+          renderer: { format: "timestamp" },
+        },
+        { field: "type", label: i18nKey("audit.log.col.type") },
+        { field: "createdBy", label: i18nKey("audit.log.col.actor") },
       ],
       searchable: true,
       defaultSort: { field: "createdAt", dir: "desc" },
@@ -54,7 +59,7 @@ export function createAuditFeature(): FeatureDefinition {
         {
           kind: "navigate",
           id: "details",
-          label: "audit.log.details",
+          label: i18nKey("audit.log.details"),
           screen: AUDIT_LOG_DETAIL_SCREEN_ID,
           entityId: "id",
           rowClick: true,
@@ -71,14 +76,14 @@ export function createAuditFeature(): FeatureDefinition {
       query: AuditQueries.details,
       idParam: "id",
       fieldLabels: {
-        type: "audit.log.col.type",
-        createdAt: "audit.log.col.when",
-        aggregateType: "audit.log.col.aggregateType",
-        aggregateId: "audit.log.col.aggregateId",
-        createdBy: "audit.log.col.actor",
-        id: "audit.log.detail.field.id",
-        payload: "audit.log.detail.payload",
-        metadata: "audit.log.detail.metadata",
+        type: i18nKey("audit.log.col.type"),
+        createdAt: i18nKey("audit.log.col.when"),
+        aggregateType: i18nKey("audit.log.col.aggregateType"),
+        aggregateId: i18nKey("audit.log.col.aggregateId"),
+        createdBy: i18nKey("audit.log.col.actor"),
+        id: i18nKey("audit.log.detail.field.id"),
+        payload: i18nKey("audit.log.detail.payload"),
+        metadata: i18nKey("audit.log.detail.metadata"),
       },
       layout: {
         sections: [

package/src/delivery/feature.ts

@@ -3,6 +3,7 @@ import {
   access,
   defineFeature,
   type FeatureDefinition,
+  i18nKey,
 } from "@cosmicdrift/kumiko-framework/engine";
 import type { z } from "zod";
 import {
@@ -145,16 +146,16 @@ export function createDeliveryFeature(options?: DeliveryFeatureOptions): Feature
       columns: [
         {
           field: "tenantId",
-          label: "delivery.log.col.tenantId",
+          label: i18nKey("delivery.log.col.tenantId"),
           refEntity: "tenant:tenant",
           refLabelField: "name",
         },
-        { field: "type", label: "delivery.log.col.type" },
-        { field: "channel", label: "delivery.log.col.channel" },
-        { field: "recipient", label: "delivery.log.col.recipient" },
+        { field: "type", label: i18nKey("delivery.log.col.type") },
+        { field: "channel", label: i18nKey("delivery.log.col.channel") },
+        { field: "recipient", label: i18nKey("delivery.log.col.recipient") },
         {
           field: "status",
-          label: "delivery.log.col.status",
+          label: i18nKey("delivery.log.col.status"),
           renderer: { react: { __component: DELIVERY_STATUS_CELL_COMPONENT } },
         },
       ],

package/src/jobs/feature.ts

@@ -1,4 +1,8 @@
-import { defineFeature, type FeatureDefinition } from "@cosmicdrift/kumiko-framework/engine";
+import {
+  defineFeature,
+  type FeatureDefinition,
+  i18nKey,
+} from "@cosmicdrift/kumiko-framework/engine";
 import { JOB_RUN_DETAIL_SCREEN_ID, JOB_RUNS_SCREEN_ID, JobHandlers, JobQueries } from "./constants";
 import { catalogQuery } from "./handlers/catalog.query";
 import { detailQuery } from "./handlers/detail.query";
@@ -119,22 +123,26 @@ export function createJobsFeature(options: JobsFeatureOptions = {}): FeatureDefi
       type: "projectionList",
       query: JobQueries.list,
       columns: [
-        { field: "jobName", label: "jobs.runs.col.job" },
-        { field: "status", label: "jobs.runs.col.status" },
-        { field: "startedAt", label: "jobs.runs.col.started", renderer: { format: "timestamp" } },
-        { field: "duration", label: "jobs.runs.col.duration" },
+        { field: "jobName", label: i18nKey("jobs.runs.col.job") },
+        { field: "status", label: i18nKey("jobs.runs.col.status") },
+        {
+          field: "startedAt",
+          label: i18nKey("jobs.runs.col.started"),
+          renderer: { format: "timestamp" },
+        },
+        { field: "duration", label: i18nKey("jobs.runs.col.duration") },
       ],
       defaultSort: { field: "startedAt", dir: "desc" },
       facets: [
         {
           field: "status",
           type: "select",
-          label: "jobs.runs.filter.status",
+          label: i18nKey("jobs.runs.filter.status"),
           options: [
-            { value: "queued", label: "jobs.runs.filter.queued" },
-            { value: "running", label: "jobs.runs.filter.running" },
-            { value: "completed", label: "jobs.runs.filter.completed" },
-            { value: "failed", label: "jobs.runs.filter.failed" },
+            { value: "queued", label: i18nKey("jobs.runs.filter.queued") },
+            { value: "running", label: i18nKey("jobs.runs.filter.running") },
+            { value: "completed", label: i18nKey("jobs.runs.filter.completed") },
+            { value: "failed", label: i18nKey("jobs.runs.filter.failed") },
           ],
         },
       ],
@@ -142,7 +150,7 @@ export function createJobsFeature(options: JobsFeatureOptions = {}): FeatureDefi
         {
           kind: "navigate",
           id: "open",
-          label: "jobs.runs.open",
+          label: i18nKey("jobs.runs.open"),
           screen: JOB_RUN_DETAIL_SCREEN_ID,
           entityId: "id",
           rowClick: true,
@@ -152,7 +160,7 @@ export function createJobsFeature(options: JobsFeatureOptions = {}): FeatureDefi
         {
           kind: "drawer",
           id: "trigger",
-          label: "jobs.trigger.title",
+          label: i18nKey("jobs.trigger.title"),
           screen: "job-trigger",
           style: "primary",
         },
@@ -169,7 +177,7 @@ export function createJobsFeature(options: JobsFeatureOptions = {}): FeatureDefi
         payload: { type: "longText", multiline: true, default: "{}" },
       },
       layout: { sections: [{ fields: ["jobName", "payload"] }] },
-      submitLabel: "jobs.trigger.submit",
+      submitLabel: i18nKey("jobs.trigger.submit"),
       access: systemAdminAccess,
       description: "Manually trigger a job by name with an optional JSON object payload.",
     });
@@ -179,14 +187,14 @@ export function createJobsFeature(options: JobsFeatureOptions = {}): FeatureDefi
       query: JobQueries.details,
       idParam: "runId",
       fieldLabels: {
-        jobName: "jobs.detail.field.job",
-        status: "jobs.detail.field.status",
-        id: "jobs.detail.field.id",
-        startedAt: "jobs.detail.field.started",
-        finishedAt: "jobs.detail.field.finished",
-        duration: "jobs.detail.field.duration",
-        error: "jobs.detail.field.error",
-        logs: "jobs.detail.logs",
+        jobName: i18nKey("jobs.detail.field.job"),
+        status: i18nKey("jobs.detail.field.status"),
+        id: i18nKey("jobs.detail.field.id"),
+        startedAt: i18nKey("jobs.detail.field.started"),
+        finishedAt: i18nKey("jobs.detail.field.finished"),
+        duration: i18nKey("jobs.detail.field.duration"),
+        error: i18nKey("jobs.detail.field.error"),
+        logs: i18nKey("jobs.detail.logs"),
       },
       layout: {
         sections: [
@@ -213,7 +221,7 @@ export function createJobsFeature(options: JobsFeatureOptions = {}): FeatureDefi
         {
           kind: "writeHandler",
           id: "retry",
-          label: "jobs.detail.retry",
+          label: i18nKey("jobs.detail.retry"),
           handler: JobHandlers.retry,
           payload: { map: { runId: "id" } },
           visible: { field: "status", eq: "failed" },

package/src/sessions/screens.ts

@@ -1,5 +1,6 @@
 import {
   access,
+  i18nKey,
   type ProjectionDetailScreenDefinition,
   type ProjectionListScreenDefinition,
 } from "@cosmicdrift/kumiko-framework/engine";
@@ -16,26 +17,26 @@ export const sessionListScreen: ProjectionListScreenDefinition = {
   // be present once the query accepts `sort` (fw#2230).
   defaultSort: { field: "createdAt", dir: "desc" },
   columns: [
-    { field: "id", label: "sessions.list.col.id" },
+    { field: "id", label: i18nKey("sessions.list.col.id") },
     {
       field: "userId",
-      label: "sessions.list.col.userId",
+      label: i18nKey("sessions.list.col.userId"),
       refEntity: "user:user",
       refLabelField: "displayName",
     },
     {
       field: "createdAt",
-      label: "sessions.list.col.createdAt",
+      label: i18nKey("sessions.list.col.createdAt"),
       renderer: { format: "timestamp" },
     },
     {
       field: "expiresAt",
-      label: "sessions.list.col.expiresAt",
+      label: i18nKey("sessions.list.col.expiresAt"),
       renderer: { format: "timestamp" },
     },
     {
       field: "revokedAt",
-      label: "sessions.list.col.revokedAt",
+      label: i18nKey("sessions.list.col.revokedAt"),
       renderer: { format: "timestamp" },
     },
   ],
@@ -43,7 +44,7 @@ export const sessionListScreen: ProjectionListScreenDefinition = {
     {
       kind: "navigate",
       id: "open",
-      label: "sessions.list.action.open",
+      label: i18nKey("sessions.list.action.open"),
       screen: SESSION_DETAIL_SCREEN_ID,
       entityId: "id",
       rowClick: true,
@@ -77,13 +78,13 @@ export const sessionDetailScreen: ProjectionDetailScreenDefinition = {
     ],
   },
   fieldLabels: {
-    id: "sessions.detail.field.id",
-    userId: "sessions.detail.field.userId",
-    createdAt: "sessions.detail.field.createdAt",
-    expiresAt: "sessions.detail.field.expiresAt",
-    revokedAt: "sessions.detail.field.revokedAt",
-    ip: "sessions.detail.field.ip",
-    userAgent: "sessions.detail.field.userAgent",
+    id: i18nKey("sessions.detail.field.id"),
+    userId: i18nKey("sessions.detail.field.userId"),
+    createdAt: i18nKey("sessions.detail.field.createdAt"),
+    expiresAt: i18nKey("sessions.detail.field.expiresAt"),
+    revokedAt: i18nKey("sessions.detail.field.revokedAt"),
+    ip: i18nKey("sessions.detail.field.ip"),
+    userAgent: i18nKey("sessions.detail.field.userAgent"),
   },
   access: listAccess,
 };

package/src/tags/screens.ts

@@ -1,7 +1,8 @@
-import type {
-  AccessRule,
-  EntityEditScreenDefinition,
-  EntityListScreenDefinition,
+import {
+  type AccessRule,
+  type EntityEditScreenDefinition,
+  type EntityListScreenDefinition,
+  i18nKey,
 } from "@cosmicdrift/kumiko-framework/engine";
 import { DEFAULT_TAG_ACCESS, TAGS_EDIT_SCREEN_ID, TAGS_SCREEN_ID } from "./constants";
 
@@ -23,18 +24,18 @@ export function createTagListScreen(
       {
         kind: "navigate",
         id: "edit",
-        label: "kumiko.actions.edit",
+        label: i18nKey("kumiko.actions.edit"),
         screen: TAGS_EDIT_SCREEN_ID,
         entityId: "id",
       },
       {
         kind: "writeHandler",
         id: "delete",
-        label: "kumiko.actions.delete",
+        label: i18nKey("kumiko.actions.delete"),
         // Convention QN — same cascade body as legacy tags:write:delete-tag.
         handler: "tags:write:tag:delete",
         payload: { pick: ["id"] },
-        confirm: "kumiko.actions.delete-confirm",
+        confirm: i18nKey("kumiko.actions.delete-confirm"),
         style: "danger",
       },
     ],

package/src/tags/web/__tests__/tag-picker.test.tsx

@@ -0,0 +1,153 @@
+import { beforeEach, describe, expect, mock, test } from "bun:test";
+import {
+  createStaticLocaleResolver,
+  LocaleProvider,
+  PrimitivesProvider,
+} from "@cosmicdrift/kumiko-renderer";
+import { defaultPrimitives } from "@cosmicdrift/kumiko-renderer-web";
+import { fireEvent, render, screen, waitFor } from "@testing-library/react";
+import { type ReactNode, useState } from "react";
+import { TagsQueries } from "../../constants";
+import { defaultTranslations } from "../i18n";
+import type { TagPicker as TagPickerComponent } from "../tag-picker";
+
+// tag-filter.test.tsx and tag-section.test.tsx register a process-wide
+// mock.module stub on the resolved "../tag-picker" path; the query-string
+// specifier loads the real component past it. It goes through a variable
+// because tsc cannot resolve the suffixed specifier, so the namespace type
+// comes from the type-only import above.
+const REAL_TAG_PICKER_SPECIFIER = "../tag-picker?real=tag-picker-test";
+const { TagPicker } = (await import(REAL_TAG_PICKER_SPECIFIER)) as {
+  readonly TagPicker: typeof TagPickerComponent;
+};
+
+type TagRow = { id: string; name: string; color?: string; scope?: string; version: number };
+type AssignmentRow = { tagId: string };
+
+let catalogRows: readonly TagRow[] = [];
+let assignmentRows: readonly AssignmentRow[] = [];
+
+beforeEach(() => {
+  catalogRows = [
+    { id: "t1", name: "urgent", color: "#ef4444", version: 1 },
+    { id: "t2", name: "later", version: 1 },
+  ];
+  assignmentRows = [];
+  dispatchSpy.mockClear();
+});
+
+const dispatchSpy = mock(async () => ({ isSuccess: true, data: undefined }));
+
+const useQuerySpy = mock((type: string) => {
+  if (type === TagsQueries.tagList) {
+    return {
+      data: { rows: catalogRows },
+      loading: false,
+      error: null,
+      refetch: mock(async () => {}),
+    };
+  }
+  return {
+    data: { rows: assignmentRows },
+    loading: false,
+    error: null,
+    refetch: mock(async () => {}),
+  };
+});
+
+const actual_renderer = await import("@cosmicdrift/kumiko-renderer");
+mock.module("@cosmicdrift/kumiko-renderer", () => ({
+  ...actual_renderer,
+  useDispatcher: mock(() => ({ write: dispatchSpy, query: mock(), batch: mock() })),
+  useQuery: useQuerySpy,
+}));
+
+function Wrapper({ children }: { readonly children: ReactNode }): ReactNode {
+  return (
+    <LocaleProvider resolver={createStaticLocaleResolver()} fallbackBundles={[defaultTranslations]}>
+      <PrimitivesProvider value={defaultPrimitives}>{children}</PrimitivesProvider>
+    </LocaleProvider>
+  );
+}
+
+function Host({
+  initialValue,
+  initialOpen,
+}: {
+  readonly initialValue: readonly string[];
+  readonly initialOpen: boolean;
+}): ReactNode {
+  const [open, setOpen] = useState(initialOpen);
+  const [applied, setApplied] = useState<readonly string[]>(initialValue);
+  const [bump, setBump] = useState(0);
+  const value = applied.map((id) => id);
+  return (
+    <>
+      <button type="button" data-testid="host-open" onClick={() => setOpen(true)}>
+        open
+      </button>
+      <button type="button" data-testid="host-rerender" onClick={() => setBump(bump + 1)}>
+        rerender {bump}
+      </button>
+      <span data-testid="host-applied">{value.join(",")}</span>
+      <TagPicker
+        entityType="note"
+        value={value}
+        onChange={setApplied}
+        open={open}
+        onOpenChange={setOpen}
+      />
+    </>
+  );
+}
+
+describe("TagPicker — open/confirm/cancel sync", () => {
+  test("confirm hands the toggled selection back to the caller", async () => {
+    render(
+      <Wrapper>
+        <Host initialValue={[]} initialOpen={true} />
+      </Wrapper>,
+    );
+
+    fireEvent.click(await screen.findByTestId("tag-manager-toggle-t1"));
+    fireEvent.click(screen.getByTestId("tag-picker-dialog-confirm"));
+
+    await waitFor(() => expect(screen.getByTestId("host-applied").textContent).toBe("t1"));
+  });
+
+  test("cancel discards the buffered selection; reopening starts from the caller's value", async () => {
+    render(
+      <Wrapper>
+        <Host initialValue={["t1"]} initialOpen={true} />
+      </Wrapper>,
+    );
+
+    fireEvent.click(await screen.findByTestId("tag-manager-toggle-t2"));
+    fireEvent.click(screen.getByTestId("tag-picker-dialog-cancel"));
+
+    await waitFor(() => expect(screen.queryByTestId("tag-picker-dialog")).toBeNull());
+    expect(screen.getByTestId("host-applied").textContent).toBe("t1");
+
+    fireEvent.click(screen.getByTestId("host-open"));
+    fireEvent.click(await screen.findByTestId("tag-picker-dialog-confirm"));
+
+    await waitFor(() => expect(screen.getByTestId("host-applied").textContent).toBe("t1"));
+  });
+
+  test("a parent re-render while open keeps the in-flight selection", async () => {
+    render(
+      <Wrapper>
+        <Host initialValue={[]} initialOpen={true} />
+      </Wrapper>,
+    );
+
+    fireEvent.click(await screen.findByTestId("tag-manager-toggle-t1"));
+    expect(screen.getByTestId("tag-manager-toggle-t1").textContent).toBe("✓");
+
+    fireEvent.click(screen.getByTestId("host-rerender"));
+    await waitFor(() => expect(screen.getByTestId("tag-manager-toggle-t1").textContent).toBe("✓"));
+
+    fireEvent.click(screen.getByTestId("tag-picker-dialog-confirm"));
+    await waitFor(() => expect(screen.getByTestId("host-applied").textContent).toBe("t1"));
+  });
+});

package/src/tags/web/tag-picker.tsx

@@ -7,7 +7,7 @@
 // caller's entityType so only global + matching labels are offered.
 
 import { usePrimitives, useTranslation } from "@cosmicdrift/kumiko-renderer";
-import { type ReactNode, useEffect, useState } from "react";
+import { type ReactNode, useState } from "react";
 import { TagManager } from "./tag-manager";
 
 export function TagPicker({
@@ -26,11 +26,14 @@ export function TagPicker({
   const { Dialog } = usePrimitives();
   const t = useTranslation();
   const [buffer, setBuffer] = useState<readonly string[]>(value);
-  // Reset the buffer to the caller's truth every time the modal (re)opens.
-  // kumiko-lint-ignore no-raw-hooks Phase-3 conversion tracked in #2312
-  useEffect(() => {
+  const [wasOpen, setWasOpen] = useState(open);
+  // Syncing on the open transition alone, not on `value`: both call sites derive
+  // `value` freshly each render, so a value-keyed effect discarded the in-flight
+  // selection on every parent re-render.
+  if (open !== wasOpen) {
+    setWasOpen(open);
     if (open) setBuffer(value);
-  }, [open, value]);
+  }
 
   return (
     <Dialog

package/src/tenant/feature.ts

@@ -7,6 +7,7 @@ import {
   defineEntityUpdateHandler,
   defineFeature,
   type FeatureDefinition,
+  i18nKey,
 } from "@cosmicdrift/kumiko-framework/engine";
 import { activeTenantIdsQuery } from "./handlers/active-tenant-ids.query";
 import { addMemberWrite } from "./handlers/add-member.write";
@@ -176,7 +177,7 @@ export function createTenantFeature(options?: TenantFeatureOptions): FeatureDefi
     }
     r.nav({
       id: "members",
-      label: "tenant.nav.members",
+      label: i18nKey("tenant.nav.members"),
       icon: "users",
       screen: "tenant:screen:members",
       order: 20,

package/src/tenant/screens.ts

@@ -3,6 +3,7 @@ import {
   access,
   type EntityEditScreenDefinition,
   type EntityListScreenDefinition,
+  i18nKey,
   type ScreenDefinition,
 } from "@cosmicdrift/kumiko-framework/engine";
 import {
@@ -35,7 +36,7 @@ export const tenantListScreen: EntityListScreenDefinition = {
     {
       kind: "navigate",
       id: "edit",
-      label: "kumiko.actions.edit",
+      label: i18nKey("kumiko.actions.edit"),
       screen: "tenant-edit",
       entityId: "id",
     },
@@ -81,25 +82,25 @@ export function createMembersScreen(options?: {
     type: "projectionList",
     query: TenantQueries.teamList,
     columns: [
-      { field: "email", label: "tenant.members.col.email" },
+      { field: "email", label: i18nKey("tenant.members.col.email") },
       {
         field: "roles",
-        label: "tenant.members.col.roles",
+        label: i18nKey("tenant.members.col.roles"),
         renderer: { react: { __component: MEMBER_ROLES_CELL_COMPONENT } },
       },
       {
         field: "status",
-        label: "tenant.members.col.status",
+        label: i18nKey("tenant.members.col.status"),
         renderer: { react: { __component: MEMBER_STATUS_CELL_COMPONENT } },
       },
       {
         field: "createdAt",
-        label: "tenant.members.col.created",
+        label: i18nKey("tenant.members.col.created"),
         renderer: { format: "timestamp" },
       },
       {
         field: "lastSeenAt",
-        label: "tenant.members.col.lastActivity",
+        label: i18nKey("tenant.members.col.lastActivity"),
         renderer: { format: "timestamp" },
       },
     ],
@@ -109,10 +110,10 @@ export function createMembersScreen(options?: {
       {
         field: "status",
         type: "select",
-        label: "tenant.members.filter.status",
+        label: i18nKey("tenant.members.filter.status"),
         options: [
-          { value: "active", label: "tenant.members.filter.status.option.active" },
-          { value: "pending", label: "tenant.members.filter.status.option.pending" },
+          { value: "active", label: i18nKey("tenant.members.filter.status.option.active") },
+          { value: "pending", label: i18nKey("tenant.members.filter.status.option.pending") },
         ],
       },
     ],
@@ -120,7 +121,7 @@ export function createMembersScreen(options?: {
       {
         kind: "navigate",
         id: "edit-roles",
-        label: "tenant.members.actions.editRoles",
+        label: i18nKey("tenant.members.actions.editRoles"),
         screen: MEMBER_ROLES_EDIT_SCREEN_ID,
         params: { map: { userId: "userId", roles: "roles" } },
         visible: { field: "status", eq: "active" },
@@ -128,10 +129,10 @@ export function createMembersScreen(options?: {
       {
         kind: "writeHandler",
         id: "cancel-invitation",
-        label: "tenant.members.cancel",
+        label: i18nKey("tenant.members.cancel"),
         handler: TenantHandlers.cancelInvitation,
         payload: { map: { invitationId: "id" } },
-        confirm: "tenant.members.cancel.confirm",
+        confirm: i18nKey("tenant.members.cancel.confirm"),
         style: "danger",
         visible: { field: "status", eq: "pending" },
       },
@@ -141,7 +142,7 @@ export function createMembersScreen(options?: {
         {
           kind: "drawer",
           id: "invite",
-          label: "tenant.members.invite.title",
+          label: i18nKey("tenant.members.invite.title"),
           screen: INVITE_CREATE_SCREEN_ID,
           style: "primary",
         },
@@ -168,7 +169,7 @@ export const inviteCreateScreen = {
   layout: {
     sections: [{ fields: ["email", "role"] }],
   },
-  submitLabel: "tenant.members.invite.submit",
+  submitLabel: i18nKey("tenant.members.invite.submit"),
   access: { roles: access.admin },
 } satisfies ScreenDefinition;
 
@@ -190,6 +191,6 @@ export const memberRolesEditScreen = {
     // Prefill userId from rowAction; readOnly so the operator cannot retarget.
     sections: [{ fields: [{ field: "userId", readOnly: true }, "roles"] }],
   },
-  submitLabel: "tenant.members.roles.edit.submit",
+  submitLabel: i18nKey("tenant.members.roles.edit.submit"),
   access: { roles: access.admin },
 } satisfies ScreenDefinition;

package/src/user/screens.ts

@@ -1,6 +1,7 @@
-import type {
-  EntityEditScreenDefinition,
-  EntityListScreenDefinition,
+import {
+  type EntityEditScreenDefinition,
+  type EntityListScreenDefinition,
+  i18nKey,
 } from "@cosmicdrift/kumiko-framework/engine";
 
 // Cross-tenant platform admin view of the user identity. Because the user
@@ -21,7 +22,7 @@ export const userListScreen: EntityListScreenDefinition = {
     {
       kind: "navigate",
       id: "edit",
-      label: "kumiko.actions.edit",
+      label: i18nKey("kumiko.actions.edit"),
       screen: "user-edit",
       entityId: "id",
     },

package/src/user-data-rights/feature.ts

@@ -4,6 +4,7 @@ import {
   defineFeature,
   EXT_USER_DATA,
   type FeatureDefinition,
+  i18nKey,
   SYSTEM_USER_ID,
 } from "@cosmicdrift/kumiko-framework/engine";
 import { validateGdprHookCompleteness, validateGdprPiiHookCoverage } from "./boot-checks";
@@ -300,6 +301,27 @@ export function createUserDataRightsFeature(opts: UserDataRightsOptions = {}): F
     });
 
     r.translations({ keys: USER_DATA_RIGHTS_I18N });
+    // Privacy-center dot-form labels (i18nKey()-marked below), duplicated in
+    // web/i18n.ts's client bundle since privacy-center-screen.tsx renders
+    // them client-side.
+    r.translations({
+      keys: {
+        "userDataRights.privacyCenter.field.status": { en: "Account status" },
+        "userDataRights.privacyCenter.field.gracePeriodEnd": { en: "Scheduled deletion date" },
+        "userDataRights.privacyCenter.export.title": { en: "Export your data (Art. 20)" },
+        "userDataRights.privacyCenter.restriction.title": { en: "Restrict processing (Art. 18)" },
+        "userDataRights.privacyCenter.restriction.restrict": { en: "Restrict account" },
+        "userDataRights.privacyCenter.restriction.dialogDescription": {
+          en: "You will be signed out immediately and cannot sign in again until support lifts the restriction.",
+        },
+        "userDataRights.privacyCenter.deletion.title": { en: "Delete account (Art. 17)" },
+        "userDataRights.privacyCenter.deletion.delete": { en: "Delete account" },
+        "userDataRights.privacyCenter.deletion.cancel": { en: "Cancel deletion" },
+        "userDataRights.privacyCenter.deletion.dialogDescription": {
+          en: "Confirming starts the deletion grace period. You can cancel the deletion until it ends.",
+        },
+      },
+    });
 
     // Self-service screen (Art. 15/17/18/20): export, restriction, deletion
     // in one projectionDetail screen bound to the user's own `me` row. No
@@ -326,14 +348,14 @@ export function createUserDataRightsFeature(opts: UserDataRightsOptions = {}): F
       description:
         "Logged-in GDPR self-service page where a user requests and downloads a data export (Art. 20), restricts processing of their account (Art. 18) and requests its deletion (Art. 17).",
       fieldLabels: {
-        status: "userDataRights.privacyCenter.field.status",
-        gracePeriodEnd: "userDataRights.privacyCenter.field.gracePeriodEnd",
+        status: i18nKey("userDataRights.privacyCenter.field.status"),
+        gracePeriodEnd: i18nKey("userDataRights.privacyCenter.field.gracePeriodEnd"),
       },
       layout: {
         sections: [
           {
             kind: "extension",
-            title: "userDataRights.privacyCenter.export.title",
+            title: i18nKey("userDataRights.privacyCenter.export.title"),
             component: { react: { __component: EXPORT_SECTION_EXTENSION_NAME } },
             entityName: "export-job",
           },
@@ -342,7 +364,7 @@ export function createUserDataRightsFeature(opts: UserDataRightsOptions = {}): F
             // section always on the screen — Deletion is dropped entirely
             // when `showDeletion` is false, and status covers restriction
             // AND deletion state, so it can't hang off the optional section.
-            title: "userDataRights.privacyCenter.restriction.title",
+            title: i18nKey("userDataRights.privacyCenter.restriction.title"),
             description: "userDataRights.privacyCenter.restriction.explainer",
             fields: [
               {
@@ -354,7 +376,7 @@ export function createUserDataRightsFeature(opts: UserDataRightsOptions = {}): F
           ...(showDeletion
             ? [
                 {
-                  title: "userDataRights.privacyCenter.deletion.title",
+                  title: i18nKey("userDataRights.privacyCenter.deletion.title"),
                   description: "userDataRights.privacyCenter.deletion.explainer",
                   // gracePeriodEnd is only meaningful once a deletion is
                   // actually pending — hide it instead of showing an empty
@@ -374,9 +396,9 @@ export function createUserDataRightsFeature(opts: UserDataRightsOptions = {}): F
       actions: [
         {
           id: "restrict",
-          label: "userDataRights.privacyCenter.restriction.restrict",
+          label: i18nKey("userDataRights.privacyCenter.restriction.restrict"),
           handler: UserDataRightsHandlers.restrictAccount,
-          confirm: "userDataRights.privacyCenter.restriction.dialogDescription",
+          confirm: i18nKey("userDataRights.privacyCenter.restriction.dialogDescription"),
           visible: { field: "status", ne: "restricted" },
           style: "danger",
         },
@@ -384,15 +406,15 @@ export function createUserDataRightsFeature(opts: UserDataRightsOptions = {}): F
           ? [
               {
                 id: "request-deletion",
-                label: "userDataRights.privacyCenter.deletion.delete",
+                label: i18nKey("userDataRights.privacyCenter.deletion.delete"),
                 handler: UserDataRightsHandlers.requestDeletion,
-                confirm: "userDataRights.privacyCenter.deletion.dialogDescription",
+                confirm: i18nKey("userDataRights.privacyCenter.deletion.dialogDescription"),
                 visible: { field: "status", ne: "deletionRequested" },
                 style: "danger" as const,
               },
               {
                 id: "cancel-deletion",
-                label: "userDataRights.privacyCenter.deletion.cancel",
+                label: i18nKey("userDataRights.privacyCenter.deletion.cancel"),
                 handler: UserDataRightsHandlers.cancelDeletion,
                 visible: { field: "status", eq: "deletionRequested" },
                 style: "secondary" as const,

package/src/user-data-rights/screens.ts

@@ -2,6 +2,7 @@ import {
   access,
   type EntityEditScreenDefinition,
   type EntityListScreenDefinition,
+  i18nKey,
 } from "@cosmicdrift/kumiko-framework/engine";
 
 // Read-only operator inspector for the GDPR data-rights read-models. All
@@ -23,7 +24,7 @@ export const exportJobListScreen: EntityListScreenDefinition = {
     {
       kind: "navigate",
       id: "view",
-      label: "kumiko.actions.view",
+      label: i18nKey("kumiko.actions.view"),
       screen: "export-job-detail",
       entityId: "id",
     },

package/src/user-profile/feature.ts

@@ -1,4 +1,8 @@
-import { defineFeature, type FeatureDefinition } from "@cosmicdrift/kumiko-framework/engine";
+import {
+  defineFeature,
+  type FeatureDefinition,
+  i18nKey,
+} from "@cosmicdrift/kumiko-framework/engine";
 import {
   CHANGE_EMAIL_SECTION_EXTENSION_NAME,
   CHANGE_PASSWORD_SECTION_EXTENSION_NAME,
@@ -38,12 +42,26 @@ export function createUserProfileFeature(): FeatureDefinition {
       changeEmail: r.writeHandler(changeEmailWrite),
     };
 
-    // Boot-validator requires a "screen:<id>.title" key per r.screen() —
-    // 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). "Profile" is duplicated in i18n.ts's client bundle.
-    r.translations({ keys: { "screen:profile.title": { en: "Profile" } } });
+    // 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.email.title": { en: "Email address" },
+        "profile.password.title": { en: "Password" },
+        "profile.danger.title": { en: "Delete account" },
+        "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 —
@@ -65,24 +83,24 @@ export function createUserProfileFeature(): FeatureDefinition {
         "a verification-mail follow-up), and request or cancel account deletion " +
         "(user-data-rights grace period).",
       fieldLabels: {
-        gracePeriodEnd: "profile.danger.gracePeriodEnd",
+        gracePeriodEnd: i18nKey("profile.danger.gracePeriodEnd"),
       },
       layout: {
         sections: [
           {
             kind: "extension",
-            title: "profile.email.title",
+            title: i18nKey("profile.email.title"),
             component: { react: { __component: CHANGE_EMAIL_SECTION_EXTENSION_NAME } },
             entityName: "user",
           },
           {
             kind: "extension",
-            title: "profile.password.title",
+            title: i18nKey("profile.password.title"),
             component: { react: { __component: CHANGE_PASSWORD_SECTION_EXTENSION_NAME } },
             entityName: "user",
           },
           {
-            title: "profile.danger.title",
+            title: i18nKey("profile.danger.title"),
             description: "profile.danger.explainer",
             // gracePeriodEnd is only meaningful once a deletion is actually
             // pending — hide it instead of showing an empty date when status
@@ -100,15 +118,15 @@ export function createUserProfileFeature(): FeatureDefinition {
       actions: [
         {
           id: "request-deletion",
-          label: "profile.danger.delete",
+          label: i18nKey("profile.danger.delete"),
           handler: UserDataRightsHandlers.requestDeletion,
-          confirm: "profile.danger.dialogDescription",
+          confirm: i18nKey("profile.danger.dialogDescription"),
           visible: { field: "status", ne: "deletionRequested" },
           style: "danger",
         },
         {
           id: "cancel-deletion",
-          label: "profile.danger.cancelDeletion",
+          label: i18nKey("profile.danger.cancelDeletion"),
           handler: UserDataRightsHandlers.cancelDeletion,
           visible: { field: "status", eq: "deletionRequested" },
           style: "secondary",