@open-mercato/core 0.6.8-develop.6983.1.e4f794099e → 0.6.8-develop.6985.1.fb93574faa

package/dist/modules/notifications/frontend/NotificationPreferenceMatrix.js

@@ -0,0 +1,190 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { useT } from "@open-mercato/shared/lib/i18n/context";
+import { Switch } from "@open-mercato/ui/primitives/switch";
+import { SimpleTooltip } from "@open-mercato/ui/primitives/tooltip";
+import { FilterBar } from "@open-mercato/ui/backend/FilterBar";
+import { FilteredEmptyResults } from "@open-mercato/ui/backend/filters/FilteredEmptyResults";
+const PREFERENCE_CHANNELS = [
+  {
+    key: "in_app",
+    labelKey: "notifications.preferences.channels.inApp",
+    labelFallback: "In-app",
+    hintKey: "notifications.preferences.channels.inAppHint",
+    hintFallback: "Notification center and bell."
+  },
+  {
+    key: "email",
+    labelKey: "notifications.preferences.channels.email",
+    labelFallback: "Email",
+    hintKey: "notifications.preferences.channels.emailHint",
+    hintFallback: "Sent to your account email address."
+  },
+  {
+    key: "push",
+    labelKey: "notifications.preferences.channels.push",
+    labelFallback: "Push",
+    hintKey: "notifications.preferences.channels.pushHint",
+    hintFallback: "Mobile push (active once a push channel is connected)."
+  }
+];
+function toChannelDef(item) {
+  return {
+    key: item.id,
+    labelKey: item.labelKey,
+    labelFallback: item.id,
+    hintKey: item.descriptionKey ?? "",
+    hintFallback: ""
+  };
+}
+function preferenceKey(typeId, channel) {
+  return `${typeId}::${channel}`;
+}
+function isChannelDisabledForType(type, channel) {
+  return Array.isArray(type.channels) && !type.channels.includes(channel);
+}
+function buildPreferenceMap(types, stored, channels = PREFERENCE_CHANNELS) {
+  const storedMap = new Map(stored.map((item) => [preferenceKey(item.notificationTypeId, item.channel), item.enabled]));
+  const next = {};
+  for (const type of types) {
+    for (const channel of channels) {
+      const key = preferenceKey(type.id, channel.key);
+      next[key] = isChannelDisabledForType(type, channel.key) ? false : storedMap.get(key) ?? true;
+    }
+  }
+  return next;
+}
+function diffPreferenceItems(types, initial, current, channels = PREFERENCE_CHANNELS) {
+  const items = [];
+  for (const type of types) {
+    for (const channel of channels) {
+      if (isChannelDisabledForType(type, channel.key)) continue;
+      const key = preferenceKey(type.id, channel.key);
+      const before = initial[key] ?? true;
+      const after = current[key] ?? true;
+      if (before !== after) {
+        items.push({ notificationTypeId: type.id, channel: channel.key, enabled: after });
+      }
+    }
+  }
+  return items;
+}
+function NotificationPreferenceMatrix({
+  types,
+  prefs,
+  onToggle,
+  disabled,
+  channels = PREFERENCE_CHANNELS
+}) {
+  const t = useT();
+  const [filterValues, setFilterValues] = React.useState({});
+  const categoryOptions = React.useMemo(() => {
+    const byCategory = /* @__PURE__ */ new Map();
+    for (const type of types) {
+      if (!type.category) continue;
+      if (!byCategory.has(type.category)) byCategory.set(type.category, type.categoryLabel ?? type.category);
+    }
+    return Array.from(byCategory, ([value, label]) => ({ value, label })).sort(
+      (left, right) => left.label.localeCompare(right.label)
+    );
+  }, [types]);
+  const filters = React.useMemo(
+    () => categoryOptions.length > 1 ? [
+      {
+        id: "category",
+        label: t("notifications.preferences.filters.category", "Category"),
+        // `tags` (searchable chips), not a `select` checkbox list: the catalogue grows a
+        // category per module, so the list gets long enough that scanning checkboxes stops
+        // scaling. Mirrors the customer/tag filters in SalesDocumentsTable.
+        type: "tags",
+        options: categoryOptions,
+        placeholder: t("notifications.preferences.filters.categoryPlaceholder", "Search categories"),
+        formatValue: (value) => categoryOptions.find((option) => option.value === value)?.label ?? value
+      }
+    ] : [],
+    [categoryOptions, t]
+  );
+  const selectedCategories = React.useMemo(() => {
+    const raw = filterValues.category;
+    if (Array.isArray(raw)) return raw.filter((value) => typeof value === "string" && value !== "");
+    return typeof raw === "string" && raw !== "" ? [raw] : [];
+  }, [filterValues]);
+  const visibleTypes = React.useMemo(
+    () => selectedCategories.length === 0 ? types : types.filter((type) => type.category != null && selectedCategories.includes(type.category)),
+    [types, selectedCategories]
+  );
+  if (types.length === 0) {
+    return /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: t("notifications.preferences.empty", "No notification types are registered yet.") });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3", children: [
+    filters.length > 0 ? /* @__PURE__ */ jsx(
+      FilterBar,
+      {
+        filters,
+        values: filterValues,
+        onApply: setFilterValues,
+        onClear: () => setFilterValues({})
+      }
+    ) : null,
+    visibleTypes.length === 0 ? /* @__PURE__ */ jsx(
+      FilteredEmptyResults,
+      {
+        entityNamePlural: t("notifications.preferences.entityNamePlural", "notification types"),
+        canRemoveLast: selectedCategories.length > 0,
+        onClearAll: () => setFilterValues({}),
+        onRemoveLast: () => setFilterValues({})
+      }
+    ) : /* @__PURE__ */ jsx("div", { className: "overflow-x-auto rounded-lg border border-border", children: /* @__PURE__ */ jsxs("table", { className: "w-full text-sm", children: [
+      /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { className: "border-b border-border bg-muted/50 text-left", children: [
+        /* @__PURE__ */ jsx("th", { className: "px-4 py-3 font-medium", children: t("notifications.preferences.columns.type", "Notification type") }),
+        channels.map((channel) => /* @__PURE__ */ jsxs("th", { className: "px-4 py-3 font-medium", children: [
+          /* @__PURE__ */ jsx("div", { children: t(channel.labelKey, channel.labelFallback) }),
+          /* @__PURE__ */ jsx("div", { className: "text-xs font-normal text-muted-foreground", children: t(channel.hintKey, channel.hintFallback) })
+        ] }, channel.key))
+      ] }) }),
+      /* @__PURE__ */ jsx("tbody", { children: visibleTypes.map((type) => /* @__PURE__ */ jsxs("tr", { className: "border-b border-border last:border-0", children: [
+        /* @__PURE__ */ jsxs("td", { className: "px-4 py-3", children: [
+          /* @__PURE__ */ jsx("div", { className: "font-medium", children: t(type.labelKey, type.id) }),
+          type.descriptionKey ? /* @__PURE__ */ jsx("div", { className: "text-xs text-muted-foreground", children: t(type.descriptionKey, "") }) : null
+        ] }),
+        channels.map((channel) => {
+          const channelDisabled = isChannelDisabledForType(type, channel.key);
+          const locked = !channelDisabled && type.nonOptOut === true;
+          const cellLabel = `${t(type.labelKey, type.id)} \u2013 ${t(channel.labelKey, channel.labelFallback)}`;
+          const requiredHint = t(
+            "notifications.preferences.requiredHint",
+            "This notification is required and cannot be turned off."
+          );
+          const channelDisabledHint = t(
+            "notifications.preferences.channelDisabledHint",
+            "This channel is turned off for this notification by your administrator."
+          );
+          const lockHint = channelDisabled ? channelDisabledHint : requiredHint;
+          const switchEl = /* @__PURE__ */ jsx(
+            Switch,
+            {
+              checked: channelDisabled ? false : locked ? true : prefs[preferenceKey(type.id, channel.key)] ?? true,
+              disabled: disabled || locked || channelDisabled,
+              onCheckedChange: (checked) => onToggle(type.id, channel.key, checked),
+              "aria-label": locked || channelDisabled ? `${cellLabel} (${lockHint})` : cellLabel
+            }
+          );
+          return /* @__PURE__ */ jsx("td", { className: "px-4 py-3", children: locked || channelDisabled ? /* @__PURE__ */ jsx(SimpleTooltip, { content: lockHint, children: /* @__PURE__ */ jsx("span", { className: "inline-flex", children: switchEl }) }) : switchEl }, channel.key);
+        })
+      ] }, type.id)) })
+    ] }) })
+  ] });
+}
+var NotificationPreferenceMatrix_default = NotificationPreferenceMatrix;
+export {
+  NotificationPreferenceMatrix,
+  PREFERENCE_CHANNELS,
+  buildPreferenceMap,
+  NotificationPreferenceMatrix_default as default,
+  diffPreferenceItems,
+  isChannelDisabledForType,
+  preferenceKey,
+  toChannelDef
+};
+//# sourceMappingURL=NotificationPreferenceMatrix.js.map

package/dist/modules/notifications/frontend/NotificationPreferenceMatrix.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/modules/notifications/frontend/NotificationPreferenceMatrix.tsx"],
+  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { Switch } from '@open-mercato/ui/primitives/switch'\nimport { SimpleTooltip } from '@open-mercato/ui/primitives/tooltip'\nimport { FilterBar, type FilterDef, type FilterValues } from '@open-mercato/ui/backend/FilterBar'\nimport { FilteredEmptyResults } from '@open-mercato/ui/backend/filters/FilteredEmptyResults'\n\nexport type NotificationTypeItem = {\n  id: string\n  labelKey: string\n  descriptionKey?: string | null\n  // Stable grouping key from /api/notifications/types (the declared category, else the type-id\n  // prefix). Filter on this \u2014 never on `categoryLabel`, which changes with the locale.\n  category?: string | null\n  // Server-resolved heading for `category`. Equals `category` when the owning module ships no\n  // `notifications.categories.<key>` translation.\n  categoryLabel?: string | null\n  // When true the type cannot be opted out of; the matrix locks its cells ON (the server drops\n  // opt-out writes for these, so a toggleable switch would silently lie on reload).\n  nonOptOut?: boolean\n  // Effective channel eligibility from /api/notifications/types (operator override, else the\n  // code-declared set; null/absent = every channel). A channel outside the set renders locked\n  // OFF and toggles are refused server-side too, so the lock is enforcement, not presentation.\n  channels?: string[] | null\n}\nexport type PreferenceItem = { notificationTypeId: string; channel: string; enabled: boolean }\n\nexport type ChannelDef = { key: string; labelKey: string; labelFallback: string; hintKey: string; hintFallback: string }\n\n/**\n * Resilient fallback channel list used only while the `/api/notifications/channels` catalogue is\n * loading or when the fetch fails. The authoritative source is the module-registered channel\n * catalogue (see `notification-channels.ts`); callers pass the fetched channels into the helpers\n * and the component. Keep this list minimal \u2014 it is a safety net, not the source of truth.\n */\nexport const PREFERENCE_CHANNELS: ChannelDef[] = [\n  {\n    key: 'in_app',\n    labelKey: 'notifications.preferences.channels.inApp',\n    labelFallback: 'In-app',\n    hintKey: 'notifications.preferences.channels.inAppHint',\n    hintFallback: 'Notification center and bell.',\n  },\n  {\n    key: 'email',\n    labelKey: 'notifications.preferences.channels.email',\n    labelFallback: 'Email',\n    hintKey: 'notifications.preferences.channels.emailHint',\n    hintFallback: 'Sent to your account email address.',\n  },\n  {\n    key: 'push',\n    labelKey: 'notifications.preferences.channels.push',\n    labelFallback: 'Push',\n    hintKey: 'notifications.preferences.channels.pushHint',\n    hintFallback: 'Mobile push (active once a push channel is connected).',\n  },\n]\n\n/** Map a `/api/notifications/channels` item to the UI channel shape. */\nexport function toChannelDef(item: { id: string; labelKey: string; descriptionKey?: string | null }): ChannelDef {\n  return {\n    key: item.id,\n    labelKey: item.labelKey,\n    labelFallback: item.id,\n    hintKey: item.descriptionKey ?? '',\n    hintFallback: '',\n  }\n}\n\nexport function preferenceKey(typeId: string, channel: string): string {\n  return `${typeId}::${channel}`\n}\n\n/** Whether the channel is outside the type's effective eligibility (cell locked off, tenant-wide). */\nexport function isChannelDisabledForType(type: NotificationTypeItem, channel: string): boolean {\n  return Array.isArray(type.channels) && !type.channels.includes(channel)\n}\n\n/** Build the default-on preference map for a catalogue + stored rows; ineligible cells are forced off. */\nexport function buildPreferenceMap(\n  types: NotificationTypeItem[],\n  stored: PreferenceItem[],\n  channels: ChannelDef[] = PREFERENCE_CHANNELS,\n): Record<string, boolean> {\n  const storedMap = new Map(stored.map((item) => [preferenceKey(item.notificationTypeId, item.channel), item.enabled]))\n  const next: Record<string, boolean> = {}\n  for (const type of types) {\n    for (const channel of channels) {\n      const key = preferenceKey(type.id, channel.key)\n      next[key] = isChannelDisabledForType(type, channel.key) ? false : storedMap.get(key) ?? true\n    }\n  }\n  return next\n}\n\n/**\n * Return only the entries whose value differs from the originally-loaded state. The server upserts\n * exactly what it receives (last-write-wins), so sending the diff keeps the payload bounded by the\n * number of toggles \u2014 not the catalogue size \u2014 and avoids materializing redundant default-on rows.\n */\nexport function diffPreferenceItems(\n  types: NotificationTypeItem[],\n  initial: Record<string, boolean>,\n  current: Record<string, boolean>,\n  channels: ChannelDef[] = PREFERENCE_CHANNELS,\n): PreferenceItem[] {\n  const items: PreferenceItem[] = []\n  for (const type of types) {\n    for (const channel of channels) {\n      if (isChannelDisabledForType(type, channel.key)) continue\n      const key = preferenceKey(type.id, channel.key)\n      const before = initial[key] ?? true\n      const after = current[key] ?? true\n      if (before !== after) {\n        items.push({ notificationTypeId: type.id, channel: channel.key, enabled: after })\n      }\n    }\n  }\n  return items\n}\n\nexport type NotificationPreferenceMatrixProps = {\n  types: NotificationTypeItem[]\n  prefs: Record<string, boolean>\n  onToggle: (typeId: string, channel: string, enabled: boolean) => void\n  disabled?: boolean\n  channels?: ChannelDef[]\n}\n\nexport function NotificationPreferenceMatrix({\n  types,\n  prefs,\n  onToggle,\n  disabled,\n  channels = PREFERENCE_CHANNELS,\n}: NotificationPreferenceMatrixProps) {\n  const t = useT()\n  const [filterValues, setFilterValues] = React.useState<FilterValues>({})\n\n  // Options come from the catalogue itself, so a module introducing a new category shows up\n  // without touching this component. Sorted by the localized label, keyed by the stable slug.\n  const categoryOptions = React.useMemo(() => {\n    const byCategory = new Map<string, string>()\n    for (const type of types) {\n      if (!type.category) continue\n      if (!byCategory.has(type.category)) byCategory.set(type.category, type.categoryLabel ?? type.category)\n    }\n    return Array.from(byCategory, ([value, label]) => ({ value, label })).sort((left, right) =>\n      left.label.localeCompare(right.label),\n    )\n  }, [types])\n\n  const filters = React.useMemo<FilterDef[]>(\n    () =>\n      categoryOptions.length > 1\n        ? [\n            {\n              id: 'category',\n              label: t('notifications.preferences.filters.category', 'Category'),\n              // `tags` (searchable chips), not a `select` checkbox list: the catalogue grows a\n              // category per module, so the list gets long enough that scanning checkboxes stops\n              // scaling. Mirrors the customer/tag filters in SalesDocumentsTable.\n              type: 'tags',\n              options: categoryOptions,\n              placeholder: t('notifications.preferences.filters.categoryPlaceholder', 'Search categories'),\n              formatValue: (value: string) =>\n                categoryOptions.find((option) => option.value === value)?.label ?? value,\n            },\n          ]\n        : [],\n    [categoryOptions, t],\n  )\n\n  const selectedCategories = React.useMemo(() => {\n    const raw = filterValues.category\n    if (Array.isArray(raw)) return raw.filter((value): value is string => typeof value === 'string' && value !== '')\n    return typeof raw === 'string' && raw !== '' ? [raw] : []\n  }, [filterValues])\n\n  // Filtering happens at render only. The parent keeps the full `types` array, which\n  // `diffPreferenceItems` walks on save \u2014 narrowing it upstream would silently drop pending\n  // toggles for rows the filter hides.\n  const visibleTypes = React.useMemo(\n    () =>\n      selectedCategories.length === 0\n        ? types\n        : types.filter((type) => type.category != null && selectedCategories.includes(type.category)),\n    [types, selectedCategories],\n  )\n\n  if (types.length === 0) {\n    return (\n      <p className=\"text-sm text-muted-foreground\">\n        {t('notifications.preferences.empty', 'No notification types are registered yet.')}\n      </p>\n    )\n  }\n\n  return (\n    <div className=\"flex flex-col gap-3\">\n      {filters.length > 0 ? (\n        <FilterBar\n          filters={filters}\n          values={filterValues}\n          onApply={setFilterValues}\n          onClear={() => setFilterValues({})}\n        />\n      ) : null}\n      {visibleTypes.length === 0 ? (\n        <FilteredEmptyResults\n          entityNamePlural={t('notifications.preferences.entityNamePlural', 'notification types')}\n          canRemoveLast={selectedCategories.length > 0}\n          onClearAll={() => setFilterValues({})}\n          onRemoveLast={() => setFilterValues({})}\n        />\n      ) : (\n    <div className=\"overflow-x-auto rounded-lg border border-border\">\n      <table className=\"w-full text-sm\">\n        <thead>\n          <tr className=\"border-b border-border bg-muted/50 text-left\">\n            <th className=\"px-4 py-3 font-medium\">{t('notifications.preferences.columns.type', 'Notification type')}</th>\n            {channels.map((channel) => (\n              <th key={channel.key} className=\"px-4 py-3 font-medium\">\n                <div>{t(channel.labelKey, channel.labelFallback)}</div>\n                <div className=\"text-xs font-normal text-muted-foreground\">{t(channel.hintKey, channel.hintFallback)}</div>\n              </th>\n            ))}\n          </tr>\n        </thead>\n        <tbody>\n          {visibleTypes.map((type) => (\n            <tr key={type.id} className=\"border-b border-border last:border-0\">\n              <td className=\"px-4 py-3\">\n                <div className=\"font-medium\">{t(type.labelKey, type.id)}</div>\n                {type.descriptionKey ? (\n                  <div className=\"text-xs text-muted-foreground\">{t(type.descriptionKey, '')}</div>\n                ) : null}\n              </td>\n              {channels.map((channel) => {\n                // Operator hard-off wins over the nonOptOut forced-on lock \u2014 mirrors the gate,\n                // where the tenant-wide channel block runs before the nonOptOut bypass.\n                const channelDisabled = isChannelDisabledForType(type, channel.key)\n                const locked = !channelDisabled && type.nonOptOut === true\n                const cellLabel = `${t(type.labelKey, type.id)} \u2013 ${t(channel.labelKey, channel.labelFallback)}`\n                const requiredHint = t(\n                  'notifications.preferences.requiredHint',\n                  'This notification is required and cannot be turned off.',\n                )\n                const channelDisabledHint = t(\n                  'notifications.preferences.channelDisabledHint',\n                  'This channel is turned off for this notification by your administrator.',\n                )\n                const lockHint = channelDisabled ? channelDisabledHint : requiredHint\n                const switchEl = (\n                  <Switch\n                    checked={channelDisabled ? false : locked ? true : prefs[preferenceKey(type.id, channel.key)] ?? true}\n                    disabled={disabled || locked || channelDisabled}\n                    onCheckedChange={(checked) => onToggle(type.id, channel.key, checked)}\n                    aria-label={locked || channelDisabled ? `${cellLabel} (${lockHint})` : cellLabel}\n                  />\n                )\n                return (\n                  <td key={channel.key} className=\"px-4 py-3\">\n                    {locked || channelDisabled ? (\n                      <SimpleTooltip content={lockHint}>\n                        <span className=\"inline-flex\">{switchEl}</span>\n                      </SimpleTooltip>\n                    ) : (\n                      switchEl\n                    )}\n                  </td>\n                )\n              })}\n            </tr>\n          ))}\n        </tbody>\n      </table>\n    </div>\n      )}\n    </div>\n  )\n}\n\nexport default NotificationPreferenceMatrix\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/modules/notifications/frontend/NotificationPreferencesPageClient.js

@@ -0,0 +1,124 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { useT } from "@open-mercato/shared/lib/i18n/context";
+import { apiCall, readApiResultOrThrow } from "@open-mercato/ui/backend/utils/apiCall";
+import { useGuardedMutation } from "@open-mercato/ui/backend/injection/useGuardedMutation";
+import { flash } from "@open-mercato/ui/backend/FlashMessages";
+import { Button } from "@open-mercato/ui/primitives/button";
+import { LoadingMessage, ErrorMessage } from "@open-mercato/ui/backend/detail";
+import {
+  NotificationPreferenceMatrix,
+  PREFERENCE_CHANNELS,
+  buildPreferenceMap,
+  diffPreferenceItems,
+  preferenceKey,
+  toChannelDef
+} from "./NotificationPreferenceMatrix.js";
+const PREFERENCES_CONTEXT_ID = "notifications-preferences";
+function NotificationPreferencesPageClient() {
+  const t = useT();
+  const [types, setTypes] = React.useState(null);
+  const [channels, setChannels] = React.useState(PREFERENCE_CHANNELS);
+  const [prefs, setPrefs] = React.useState({});
+  const initialPrefs = React.useRef({});
+  const [loading, setLoading] = React.useState(true);
+  const [saving, setSaving] = React.useState(false);
+  const [error, setError] = React.useState(null);
+  const { runMutation, retryLastMutation } = useGuardedMutation({
+    contextId: PREFERENCES_CONTEXT_ID,
+    blockedMessage: t("ui.forms.flash.saveBlocked", "Save blocked by validation")
+  });
+  const fetchData = React.useCallback(async () => {
+    setLoading(true);
+    setError(null);
+    try {
+      const [typesBody, prefsBody, channelsBody] = await Promise.all([
+        readApiResultOrThrow("/api/notifications/types", void 0, {
+          errorMessage: t("notifications.preferences.loadError", "Failed to load notification preferences"),
+          allowNullResult: true
+        }),
+        readApiResultOrThrow("/api/notifications/preferences", void 0, {
+          errorMessage: t("notifications.preferences.loadError", "Failed to load notification preferences"),
+          allowNullResult: true
+        }),
+        readApiResultOrThrow("/api/notifications/channels", void 0, {
+          errorMessage: t("notifications.preferences.loadError", "Failed to load notification preferences"),
+          allowNullResult: true
+        })
+      ]);
+      const typeItems = typesBody?.items ?? [];
+      setTypes(typeItems);
+      const channelDefs = channelsBody?.items?.length ? channelsBody.items.map(toChannelDef) : PREFERENCE_CHANNELS;
+      setChannels(channelDefs);
+      const map = buildPreferenceMap(typeItems, prefsBody?.items ?? [], channelDefs);
+      initialPrefs.current = map;
+      setPrefs(map);
+    } catch (err) {
+      const message = err instanceof Error ? err.message : t("notifications.preferences.loadError", "Failed to load notification preferences");
+      setError(message);
+      flash(message, "error");
+    } finally {
+      setLoading(false);
+    }
+  }, [t]);
+  React.useEffect(() => {
+    fetchData();
+  }, [fetchData]);
+  const togglePref = (typeId, channel, enabled) => {
+    setPrefs((prev) => ({ ...prev, [preferenceKey(typeId, channel)]: enabled }));
+  };
+  const handleSave = async () => {
+    if (!types) return;
+    setSaving(true);
+    try {
+      const preferences = diffPreferenceItems(types, initialPrefs.current, prefs, channels);
+      if (preferences.length === 0) {
+        flash(t("notifications.preferences.saveSuccess", "Notification preferences saved"), "success");
+        return;
+      }
+      const response = await runMutation({
+        // optimistic-lock-exempt: the preference matrix is an idempotent per-cell toggle grid.
+        // The client sends only changed (type, channel) cells (diffPreferenceItems) and the server
+        // upserts them last-write-wins per cell, so there is no lost-update hazard on a shared
+        // aggregate that version-locking would guard.
+        operation: () => apiCall("/api/notifications/preferences", {
+          method: "PUT",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({ preferences })
+        }),
+        context: { formId: PREFERENCES_CONTEXT_ID, resourceKind: "notifications.preference", retryLastMutation },
+        mutationPayload: { preferences }
+      });
+      if (!response.ok) {
+        const message = response.result?.error || t("notifications.preferences.saveError", "Failed to save notification preferences");
+        throw new Error(message);
+      }
+      initialPrefs.current = prefs;
+      flash(t("notifications.preferences.saveSuccess", "Notification preferences saved"), "success");
+    } catch (err) {
+      const message = err instanceof Error ? err.message : t("notifications.preferences.saveError", "Failed to save notification preferences");
+      flash(message, "error");
+    } finally {
+      setSaving(false);
+    }
+  };
+  if (loading || !types) {
+    return /* @__PURE__ */ jsx(LoadingMessage, { label: t("notifications.preferences.loading", "Loading notification preferences...") });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-6", children: [
+    /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("h1", { className: "text-2xl font-semibold", children: t("notifications.preferences.pageTitle", "Notification Preferences") }),
+      /* @__PURE__ */ jsx("p", { className: "text-muted-foreground text-sm", children: t("notifications.preferences.pageDescription", "Choose which channels deliver each notification type. Unset choices stay enabled by default.") })
+    ] }),
+    /* @__PURE__ */ jsx(NotificationPreferenceMatrix, { types, prefs, onToggle: togglePref, channels }),
+    error && /* @__PURE__ */ jsx(ErrorMessage, { label: error }),
+    /* @__PURE__ */ jsx("div", { className: "flex items-center gap-3", children: /* @__PURE__ */ jsx(Button, { type: "button", onClick: handleSave, disabled: saving, children: saving ? t("notifications.preferences.saving", "Saving...") : t("notifications.preferences.save", "Save preferences") }) })
+  ] });
+}
+var NotificationPreferencesPageClient_default = NotificationPreferencesPageClient;
+export {
+  NotificationPreferencesPageClient,
+  NotificationPreferencesPageClient_default as default
+};
+//# sourceMappingURL=NotificationPreferencesPageClient.js.map

package/dist/modules/notifications/frontend/NotificationPreferencesPageClient.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/modules/notifications/frontend/NotificationPreferencesPageClient.tsx"],
+  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { apiCall, readApiResultOrThrow } from '@open-mercato/ui/backend/utils/apiCall'\nimport { useGuardedMutation } from '@open-mercato/ui/backend/injection/useGuardedMutation'\nimport { flash } from '@open-mercato/ui/backend/FlashMessages'\nimport { Button } from '@open-mercato/ui/primitives/button'\nimport { LoadingMessage, ErrorMessage } from '@open-mercato/ui/backend/detail'\nimport {\n  NotificationPreferenceMatrix,\n  PREFERENCE_CHANNELS,\n  buildPreferenceMap,\n  diffPreferenceItems,\n  preferenceKey,\n  toChannelDef,\n  type ChannelDef,\n  type NotificationTypeItem,\n  type PreferenceItem,\n} from './NotificationPreferenceMatrix'\n\ntype TypesResponse = { items?: NotificationTypeItem[] }\ntype PreferencesResponse = { items?: PreferenceItem[] }\ntype ChannelsResponse = { items?: Array<{ id: string; labelKey: string; descriptionKey?: string | null }> }\ntype SaveResponse = { ok?: boolean; error?: string }\n\nconst PREFERENCES_CONTEXT_ID = 'notifications-preferences'\n\nexport function NotificationPreferencesPageClient() {\n  const t = useT()\n  const [types, setTypes] = React.useState<NotificationTypeItem[] | null>(null)\n  const [channels, setChannels] = React.useState<ChannelDef[]>(PREFERENCE_CHANNELS)\n  const [prefs, setPrefs] = React.useState<Record<string, boolean>>({})\n  // The state as last loaded/saved; saves send only the entries that differ from this.\n  const initialPrefs = React.useRef<Record<string, boolean>>({})\n  const [loading, setLoading] = React.useState(true)\n  const [saving, setSaving] = React.useState(false)\n  const [error, setError] = React.useState<string | null>(null)\n\n  const { runMutation, retryLastMutation } = useGuardedMutation<{\n    formId: string\n    resourceKind: string\n    retryLastMutation: () => Promise<boolean>\n  }>({\n    contextId: PREFERENCES_CONTEXT_ID,\n    blockedMessage: t('ui.forms.flash.saveBlocked', 'Save blocked by validation'),\n  })\n\n  const fetchData = React.useCallback(async () => {\n    setLoading(true)\n    setError(null)\n    try {\n      const [typesBody, prefsBody, channelsBody] = await Promise.all([\n        readApiResultOrThrow<TypesResponse>('/api/notifications/types', undefined, {\n          errorMessage: t('notifications.preferences.loadError', 'Failed to load notification preferences'),\n          allowNullResult: true,\n        }),\n        readApiResultOrThrow<PreferencesResponse>('/api/notifications/preferences', undefined, {\n          errorMessage: t('notifications.preferences.loadError', 'Failed to load notification preferences'),\n          allowNullResult: true,\n        }),\n        readApiResultOrThrow<ChannelsResponse>('/api/notifications/channels', undefined, {\n          errorMessage: t('notifications.preferences.loadError', 'Failed to load notification preferences'),\n          allowNullResult: true,\n        }),\n      ])\n      const typeItems = typesBody?.items ?? []\n      setTypes(typeItems)\n      const channelDefs = channelsBody?.items?.length ? channelsBody.items.map(toChannelDef) : PREFERENCE_CHANNELS\n      setChannels(channelDefs)\n      const map = buildPreferenceMap(typeItems, prefsBody?.items ?? [], channelDefs)\n      initialPrefs.current = map\n      setPrefs(map)\n    } catch (err) {\n      const message = err instanceof Error ? err.message : t('notifications.preferences.loadError', 'Failed to load notification preferences')\n      setError(message)\n      flash(message, 'error')\n    } finally {\n      setLoading(false)\n    }\n  }, [t])\n\n  React.useEffect(() => {\n    fetchData()\n  }, [fetchData])\n\n  const togglePref = (typeId: string, channel: string, enabled: boolean) => {\n    setPrefs((prev) => ({ ...prev, [preferenceKey(typeId, channel)]: enabled }))\n  }\n\n  const handleSave = async () => {\n    if (!types) return\n    setSaving(true)\n    try {\n      const preferences = diffPreferenceItems(types, initialPrefs.current, prefs, channels)\n      // Nothing changed since load/last save \u2014 skip the no-op write entirely.\n      if (preferences.length === 0) {\n        flash(t('notifications.preferences.saveSuccess', 'Notification preferences saved'), 'success')\n        return\n      }\n      const response = await runMutation({\n        // optimistic-lock-exempt: the preference matrix is an idempotent per-cell toggle grid.\n        // The client sends only changed (type, channel) cells (diffPreferenceItems) and the server\n        // upserts them last-write-wins per cell, so there is no lost-update hazard on a shared\n        // aggregate that version-locking would guard.\n        operation: () =>\n          apiCall<SaveResponse>('/api/notifications/preferences', {\n            method: 'PUT',\n            headers: { 'Content-Type': 'application/json' },\n            body: JSON.stringify({ preferences }),\n          }),\n        context: { formId: PREFERENCES_CONTEXT_ID, resourceKind: 'notifications.preference', retryLastMutation },\n        mutationPayload: { preferences },\n      })\n      if (!response.ok) {\n        const message = response.result?.error || t('notifications.preferences.saveError', 'Failed to save notification preferences')\n        throw new Error(message)\n      }\n      initialPrefs.current = prefs\n      flash(t('notifications.preferences.saveSuccess', 'Notification preferences saved'), 'success')\n    } catch (err) {\n      const message = err instanceof Error ? err.message : t('notifications.preferences.saveError', 'Failed to save notification preferences')\n      flash(message, 'error')\n    } finally {\n      setSaving(false)\n    }\n  }\n\n  if (loading || !types) {\n    return <LoadingMessage label={t('notifications.preferences.loading', 'Loading notification preferences...')} />\n  }\n\n  return (\n    <div className=\"flex flex-col gap-6\">\n      <div>\n        <h1 className=\"text-2xl font-semibold\">{t('notifications.preferences.pageTitle', 'Notification Preferences')}</h1>\n        <p className=\"text-muted-foreground text-sm\">\n          {t('notifications.preferences.pageDescription', 'Choose which channels deliver each notification type. Unset choices stay enabled by default.')}\n        </p>\n      </div>\n\n      <NotificationPreferenceMatrix types={types} prefs={prefs} onToggle={togglePref} channels={channels} />\n\n      {error && <ErrorMessage label={error} />}\n\n      <div className=\"flex items-center gap-3\">\n        <Button type=\"button\" onClick={handleSave} disabled={saving}>\n          {saving ? t('notifications.preferences.saving', 'Saving...') : t('notifications.preferences.save', 'Save preferences')}\n        </Button>\n      </div>\n    </div>\n  )\n}\n\nexport default NotificationPreferencesPageClient\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/modules/notifications/frontend/NotificationSettingsPageClient.js

@@ -2,7 +2,9 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { useT } from "@open-mercato/shared/lib/i18n/context";
-import { apiCall, readApiResultOrThrow } from "@open-mercato/ui/backend/utils/apiCall";
+import { apiCall, readApiResultOrThrow, withScopedApiRequestHeaders } from "@open-mercato/ui/backend/utils/apiCall";
+import { buildOptimisticLockHeader } from "@open-mercato/ui/backend/utils/optimisticLock";
+import { surfaceRecordConflict } from "@open-mercato/ui/backend/conflicts";
 import { useGuardedMutation } from "@open-mercato/ui/backend/injection/useGuardedMutation";
 import { flash } from "@open-mercato/ui/backend/FlashMessages";
 import { Button } from "@open-mercato/ui/primitives/button";
@@ -30,6 +32,116 @@ function NotificationSettingsPageClient() {
     contextId: SETTINGS_CONTEXT_ID,
     blockedMessage: t("ui.forms.flash.saveBlocked", "Save blocked by validation")
   });
+  const [types, setTypes] = React.useState([]);
+  const [channels, setChannels] = React.useState([]);
+  const [savingTypeCell, setSavingTypeCell] = React.useState(null);
+  const fetchCatalogue = React.useCallback(async () => {
+    try {
+      const [typesBody, channelsBody] = await Promise.all([
+        readApiResultOrThrow("/api/notifications/types", void 0, {
+          errorMessage: t("notifications.settings.types.loadError", "Failed to load notification types"),
+          allowNullResult: true
+        }),
+        readApiResultOrThrow("/api/notifications/channels", void 0, {
+          errorMessage: t("notifications.settings.types.loadError", "Failed to load notification types"),
+          allowNullResult: true
+        })
+      ]);
+      setTypes(typesBody?.items ?? []);
+      setChannels((channelsBody?.items ?? []).map((item) => ({ id: item.id, labelKey: item.labelKey })));
+    } catch (err) {
+      const message = err instanceof Error ? err.message : t("notifications.settings.types.loadError", "Failed to load notification types");
+      flash(message, "error");
+    }
+  }, [t]);
+  React.useEffect(() => {
+    fetchCatalogue();
+  }, [fetchCatalogue]);
+  const saveTypeCell = async (type, cellKey, mutationPayload, operation, resolveSavedFlash) => {
+    setSavingTypeCell(cellKey);
+    try {
+      const response = await runMutation({
+        operation,
+        context: {
+          formId: SETTINGS_CONTEXT_ID,
+          resourceKind: "notifications.settings",
+          resourceId: type.id,
+          retryLastMutation
+        },
+        mutationPayload
+      });
+      if (!response.ok || !response.result?.ok) {
+        if (surfaceRecordConflict({ status: response.status, body: response.result }, t, { onRefresh: fetchCatalogue })) {
+          await fetchCatalogue();
+          return;
+        }
+        const message = response.result?.error || t("notifications.settings.types.saveError", "Failed to save notification type settings");
+        throw new Error(message);
+      }
+      const saved = response.result.item;
+      setTypes(
+        (prev) => prev.map(
+          (item) => item.id === type.id && saved ? {
+            ...item,
+            channels: saved.channels,
+            storedChannels: saved.storedChannels,
+            nonOptOut: saved.nonOptOut,
+            storedNonOptOut: saved.storedNonOptOut,
+            updatedAt: saved.updatedAt
+          } : item
+        )
+      );
+      const savedFlash = saved ? resolveSavedFlash?.(saved) ?? null : null;
+      flash(
+        savedFlash?.message ?? t("notifications.settings.types.saveSuccess", "Notification type settings saved"),
+        savedFlash?.kind ?? "success"
+      );
+    } catch (err) {
+      const message = err instanceof Error ? err.message : t("notifications.settings.types.saveError", "Failed to save notification type settings");
+      flash(message, "error");
+    } finally {
+      setSavingTypeCell(null);
+    }
+  };
+  const patchType = (type, cellKey, payload) => saveTypeCell(
+    type,
+    cellKey,
+    { id: type.id, ...payload },
+    () => withScopedApiRequestHeaders(
+      buildOptimisticLockHeader(type.updatedAt),
+      () => apiCall("/api/notifications/types", {
+        method: "PATCH",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ id: type.id, ...payload })
+      })
+    )
+  );
+  const toggleTypeChannel = (type, cellKey, channel, enabled) => saveTypeCell(
+    type,
+    cellKey,
+    { id: type.id, channel, enabled },
+    () => apiCall(
+      `/api/notifications/types/${encodeURIComponent(type.id)}/channels/${encodeURIComponent(channel)}`,
+      { method: enabled ? "PUT" : "DELETE" }
+    ),
+    // Unchecking the last channel clears the override instead of storing an empty set (which would
+    // black-hole the type), so the code-declared default reapplies and the box the operator just
+    // unticked can come back ticked. The write succeeded, so say what happened rather than letting a
+    // green "saved" sit next to a checkbox that visibly ignored the click.
+    (saved) => !enabled && saved.storedChannels === null && (saved.channels === null || saved.channels.includes(channel)) ? {
+      message: t(
+        "notifications.settings.types.lastChannelRestored",
+        "A notification type must keep at least one channel, so the module default was restored."
+      ),
+      kind: "warning"
+    } : null
+  );
+  const handleTypeChannelToggle = async (type, channelId, enabled) => {
+    await toggleTypeChannel(type, `${type.id}::${channelId}`, channelId, enabled);
+  };
+  const handleTypeNonOptOutToggle = async (type, required) => {
+    await patchType(type, `${type.id}::nonOptOut`, { nonOptOut: required });
+  };
   const fetchSettings = React.useCallback(async () => {
     setLoading(true);
     setError(null);
@@ -216,6 +328,59 @@ function NotificationSettingsPageClient() {
         ] })
       ] })
     ] }),
+    /* @__PURE__ */ jsxs(Card, { children: [
+      /* @__PURE__ */ jsxs(CardHeader, { children: [
+        /* @__PURE__ */ jsx(CardTitle, { children: t("notifications.settings.types.title", "Delivery channels per type") }),
+        /* @__PURE__ */ jsx(CardDescription, { children: t(
+          "notifications.settings.types.description",
+          "Delivery channels per notification type. Turning a channel off disables it completely for that type in your tenant \u2014 it never delivers and users cannot enable it in their preferences. Turning it on lets users opt in or out per type; required (non-opt-out) types always deliver on enabled channels. Your setting overrides the module default."
+        ) })
+      ] }),
+      /* @__PURE__ */ jsx(CardContent, { children: types.length === 0 || channels.length === 0 ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: t("notifications.settings.types.empty", "No notification types are registered yet.") }) : /* @__PURE__ */ jsx("div", { className: "overflow-x-auto rounded-lg border border-border", children: /* @__PURE__ */ jsxs("table", { className: "w-full text-sm", children: [
+        /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { className: "border-b border-border bg-muted/50 text-left", children: [
+          /* @__PURE__ */ jsx("th", { className: "px-4 py-3 font-medium", children: t("notifications.settings.types.typeColumn", "Notification type") }),
+          channels.map((channel) => /* @__PURE__ */ jsx("th", { className: "px-4 py-3 font-medium", children: t(channel.labelKey, channel.id) }, channel.id)),
+          /* @__PURE__ */ jsxs("th", { className: "px-4 py-3 font-medium", children: [
+            /* @__PURE__ */ jsx("div", { children: t("notifications.settings.types.requiredColumn", "Required") }),
+            /* @__PURE__ */ jsx("div", { className: "text-xs font-normal text-muted-foreground", children: t("notifications.settings.types.requiredHint", "Users cannot opt out when on.") })
+          ] })
+        ] }) }),
+        /* @__PURE__ */ jsx("tbody", { children: types.map((type) => /* @__PURE__ */ jsxs("tr", { className: "border-b border-border last:border-0", children: [
+          /* @__PURE__ */ jsxs("td", { className: "px-4 py-3", children: [
+            /* @__PURE__ */ jsx("div", { className: "font-medium", children: t(type.labelKey, type.id) }),
+            type.descriptionKey ? /* @__PURE__ */ jsx("div", { className: "text-xs text-muted-foreground", children: t(type.descriptionKey, "") }) : null
+          ] }),
+          channels.map((channel) => {
+            const cellKey = `${type.id}::${channel.id}`;
+            const channelEnabled = type.channels === null || type.channels.includes(channel.id);
+            return /* @__PURE__ */ jsx("td", { className: "px-4 py-3", children: /* @__PURE__ */ jsxs("span", { className: "relative inline-flex items-center", children: [
+              /* @__PURE__ */ jsx(
+                Switch,
+                {
+                  checked: channelEnabled,
+                  disabled: savingTypeCell !== null,
+                  "aria-label": `${t(type.labelKey, type.id)} \u2013 ${t(channel.labelKey, channel.id)}`,
+                  onCheckedChange: (checked) => handleTypeChannelToggle(type, channel.id, checked)
+                }
+              ),
+              savingTypeCell === cellKey ? /* @__PURE__ */ jsx(Spinner, { size: "sm", className: "absolute left-full ml-2" }) : null
+            ] }) }, channel.id);
+          }),
+          /* @__PURE__ */ jsx("td", { className: "px-4 py-3", children: /* @__PURE__ */ jsxs("span", { className: "relative inline-flex", children: [
+            /* @__PURE__ */ jsx(
+              Switch,
+              {
+                checked: type.nonOptOut === true,
+                disabled: savingTypeCell !== null,
+                "aria-label": `${t(type.labelKey, type.id)} \u2013 ${t("notifications.settings.types.requiredColumn", "Required")}`,
+                onCheckedChange: (checked) => handleTypeNonOptOutToggle(type, checked)
+              }
+            ),
+            savingTypeCell === `${type.id}::nonOptOut` ? /* @__PURE__ */ jsx(Spinner, { size: "sm", className: "absolute left-full ml-2" }) : null
+          ] }) })
+        ] }, type.id)) })
+      ] }) }) })
+    ] }),
     /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
       /* @__PURE__ */ jsx(Button, { type: "button", onClick: handleSave, disabled: saving, children: saving ? t("notifications.settings.saving", "Saving...") : t("notifications.settings.save", "Save settings") }),
       error && /* @__PURE__ */ jsx("span", { className: "text-sm text-destructive", children: error })