@antelopejs/dms 0.12.1 → 0.13.0

package/frontend-vue/layers/dms-layout/app/composables/page/useModuleStoreActions.ts

@@ -1,4 +1,3 @@
-import { isString } from "../../../../dms-core/app/utils/type-check";
 import type { Ref, VNode } from "vue";
 import ModuleStoreDependencyPicker from "../../build/components/pages/modules/ModuleStoreDependencyPicker.vue";
 import {
@@ -22,12 +21,6 @@ import type {
 } from "#dms-core/app/types/module-store";
 import type { useModuleStore } from "./useModuleStore";
 
-/** What a refused store request carries: the server's error key, if any. */
-interface StoreRequestError {
-  data?: unknown;
-  message?: string;
-}
-
 /** What the frontend banner says while it lags behind the backend. */
 export interface StoreFrontendNotice {
   key: "dev" | "production" | "unknown";
@@ -65,18 +58,9 @@ export const useModuleStoreActions = (
 ) => {
   const { t } = useI18n();
   const { processI18n } = useTranslation();
-  const toast = useToast();
+  const { presentError } = useApiErrorPresenter();
   const { confirm } = useConfirm();
 
-  // oxlint-disable-next-line anti-slop/no-unknown-parameters -- Store requests can reject with arbitrary JavaScript values; the store's Promise contract has no rejection owner type.
-  function resolveStoreError(error: unknown): string {
-    // oxlint-disable-next-line anti-slop/require-safety-comment-for-type-assertion -- This existing unchecked optional-property view is not validation of a StoreRequestError; inference cannot establish that rejected values have this shape, and parsing would change malformed-error behavior.
-    const details = error as StoreRequestError | undefined;
-    const key = isString(details?.data) ? details.data : undefined;
-    if (!key) return details?.message ?? "";
-    return t(`modules.store.errors.${key.replace("error.", "")}`);
-  }
-
   /**
    * Runs `kind` from a dialog: a refusal is worded as the toast words it and
    * shown in the dialog, which stays open.
@@ -89,12 +73,15 @@ export const useModuleStoreActions = (
     try {
       await moduleStore.run(kind, entry, body);
     } catch (error) {
-      throw new ConfirmActionError({
-        title: t("modules.store.action_failed", {
-          module: processI18n(entry.title),
-        }),
-        description: resolveStoreError(error),
-      });
+      throw new ConfirmActionError(
+        {
+          fallbackKey: "modules.store.action_failed",
+          params: {
+            module: processI18n(entry.title),
+          },
+        },
+        { cause: error },
+      );
     }
   }
 
@@ -165,11 +152,9 @@ export const useModuleStoreActions = (
     try {
       await moduleStore.run(kind, entry);
     } catch (error) {
-      toast.add({
-        color: "error",
-        icon: "i-ph-warning-circle",
-        title: t("modules.store.action_failed", { module: title }),
-        description: resolveStoreError(error),
+      presentError(error, {
+        fallbackKey: "modules.store.action_failed",
+        params: { module: title },
       });
     }
   }

package/frontend-vue/layers/dms-layout/app/custom-pages/modules-store.vue

@@ -178,10 +178,10 @@ const skeletonItems = Array.from(
            while the frontend restarts keeps the tiles and tries again. -->
       <DmsBanner
         v-else-if="moduleStore.loadingError.value && !storeListing"
-        tone="error"
+        :tone="moduleStore.loadingNotice.value?.severity ?? 'error'"
         size="sm"
         icon="i-ph-plugs"
-        :title="t('modules.store.load_error')"
+        :title="moduleStore.loadingNotice.value?.message"
       >
         <template #actions>
           <UButton

package/frontend-vue/layers/dms-layout/app/custom-pages/settings/roles.vue

@@ -26,6 +26,8 @@ import { REQUIRED_MESSAGE } from "#dms-core/app/composables/useFormValidation";
 import { useUnsavedChanges } from "#dms-ui/app/composables/unsaved-changes/useUnsavedChanges";
 import { useActionConfirm } from "#dms-ui/app/entries/composables/confirm/useActionConfirm";
 
+const { presentError } = useApiErrorPresenter();
+
 interface RoleEditorHandle {
   inputOf: (field: RoleEditorField) => HTMLInputElement | undefined;
 }
@@ -152,7 +154,7 @@ async function runMutation(
     await mutation();
     toast.add({ title: t(successKey), color: "success" });
   } catch (error) {
-    useApiError(error);
+    presentError(error, { fallbackKey: "error.500.description" });
   }
 }
 
@@ -181,7 +183,8 @@ async function save(): Promise<void> {
       color: "success",
     });
   } catch (error) {
-    if (!(await fieldErrors.applyApiError(error))) useApiError(error);
+    if (!(await fieldErrors.applyApiError(error)))
+      presentError(error, { fallbackKey: "error.500.description" });
   } finally {
     isSaving.value = false;
   }

package/frontend-vue/layers/dms-layout/app/plugins/command-palette-session.client.ts

@@ -34,6 +34,7 @@ export default defineDmsPlugin(() => {
   const { $i18n: i18n } = useDmsApp();
   const { t } = getAppTranslation();
   const toast = useToast();
+  const { presentError } = useApiErrorPresenter();
   const { logout } = useLogout();
   const { changeLanguage } = useUserLanguage();
   const { copy } = useClipboard({ legacy: true });
@@ -51,10 +52,9 @@ export default defineDmsPlugin(() => {
     try {
       await copy(window.location.href);
       toast.add({ title: t("commandPalette.session.urlCopied") });
-    } catch {
-      toast.add({
-        title: t("commandPalette.session.copyFailed"),
-        color: "error",
+    } catch (error) {
+      presentError(error, {
+        fallbackKey: "commandPalette.session.copyFailed",
       });
     }
   }

package/frontend-vue/layers/dms-layout/i18n/locales/layout-en-GB.json

@@ -875,10 +875,6 @@
           "title": "Builder",
           "description": "Edits the project’s pages, tables and forms, writing only code that compiles."
         },
-        "cicd": {
-          "title": "Publishing",
-          "description": "Versions, environments and deploys of your project through git."
-        },
         "database": {
           "title": "Database",
           "description": "Schemas, data browser, schema diagram and an AQL query workspace."

package/frontend-vue/layers/dms-layout/i18n/locales/layout-fr-FR.json

@@ -875,10 +875,6 @@
           "title": "Builder",
           "description": "Modifie les pages, tableaux et formulaires du projet, en n’écrivant que du code qui compile."
         },
-        "cicd": {
-          "title": "Publication",
-          "description": "Versions, environnements et déploiements de votre projet via git."
-        },
         "database": {
           "title": "Base de données",
           "description": "Schémas, explorateur de données, diagramme et espace de requêtes AQL."

package/frontend-vue/layers/dms-ui/app/build/components/blocks/BlockStatus.vue

@@ -45,6 +45,7 @@ const VARIANTS = {
 } as const;
 
 const { t } = useI18n();
+const { resolveError } = useApiErrorPresenter();
 const { processI18n } = useTranslation();
 
 const translate = (text: string | undefined) =>
@@ -52,7 +53,7 @@ const translate = (text: string | undefined) =>
 
 const notFoundState = computed(() => {
   const answered = props.notFound?.emptyState ?? {};
-  const defaults = notFoundTexts(props.notFound, t);
+  const defaults = notFoundTexts(props.notFound, t, resolveError);
   return {
     title: translate(answered.title) ?? defaults.title,
     description: translate(answered.description) ?? defaults.description,

package/frontend-vue/layers/dms-ui/app/build/composables/actions/actionTargetRequests.ts

@@ -37,12 +37,8 @@ export function createExportJobHandler(
           successMessage: target.labels.successMessage
             ? processI18n(target.labels.successMessage)
             : undefined,
-          errorTitle: target.labels.errorTitle
-            ? processI18n(target.labels.errorTitle)
-            : undefined,
-          retry: target.labels.retry
-            ? processI18n(target.labels.retry)
-            : undefined,
+          errorTitle: target.labels.errorTitle,
+          retry: target.labels.retry,
         }
       : undefined;
     const statusUrlTemplate = target.statusUrl;
@@ -121,19 +117,19 @@ export function createActionRequests(
   const handleApiTarget = async (
     target: ActionTarget & { type: "api" },
     url: string,
-    label: string,
+    _label: string,
     rowData?: Data,
     selection?: BulkSelection,
   ) => {
     try {
       await requestApiTarget(target, url, rowData, {}, selection);
     } catch (error: unknown) {
-      handleApiError(error, label ? processI18n(label, rowData) : undefined);
+      handleApiError(error);
     }
   };
   const handleDownloadTarget = async (
     target: ActionTarget & { type: "download" },
-    label: string,
+    _label: string,
     rowData?: Data,
   ) => {
     try {
@@ -145,7 +141,7 @@ export function createActionRequests(
         fetchRaw,
       );
     } catch (error: unknown) {
-      handleApiError(error, label ? processI18n(label, rowData) : undefined);
+      handleApiError(error);
     }
   };
   return { requestApiTarget, handleApiTarget, handleDownloadTarget };

package/frontend-vue/layers/dms-ui/app/build/composables/chart/groupPoints.ts

@@ -13,7 +13,18 @@ function isGroupPoint(
 }
 
 function isSeries(entry: ChartSeries | ChartGroupPoint): entry is ChartSeries {
-  return "data" in entry;
+  return "data" in entry && Array.isArray(entry.data);
+}
+
+/**
+ * The series of a fetched answer that carry their points. The answer comes
+ * from a route, so one answering another shape leaves its chart empty rather
+ * than failing the page the chart sits on.
+ */
+export function drawableSeries(
+  series: ReadonlyArray<ChartSeries | ChartGroupPoint>,
+): ChartSeries[] {
+  return series.filter(isSeries);
 }
 
 /**
@@ -31,7 +42,7 @@ export function responseSeries(
 ): ChartSeries[] {
   const entries: Array<ChartSeries | ChartGroupPoint> = series;
   if (entries.length === 0 || !entries.every(isGroupPoint))
-    return entries.filter(isSeries);
+    return drawableSeries(entries);
   const labelled = xaxisType === "category";
   const data = entries
     .filter(isGroupPoint)

package/frontend-vue/layers/dms-ui/app/build/composables/confirm/actionError.ts

@@ -1,150 +1,21 @@
-import {
-  isObject as isObjectType,
-  isString,
-} from "../../../../../dms-core/app/utils/type-check";
-import {
-  readTranslationKey,
-  type I18nTranslate,
-} from "#dms-core/app/composables/translation/useTranslation";
-import { describeFieldErrors } from "#dms-core/app/composables/useFieldErrors";
+import type { I18nTranslate } from "#dms-core/app/composables/translation/useTranslation";
 
-/** Shown when the request never reached the server (offline, DNS, CORS…). */
+/** Legacy fallback key for requests that could not reach the server. */
 export const ACTION_ERROR_NETWORK_KEY = "error.network.description";
-/** Shown for a 401/403 whose body is not a user-facing message. */
+/** Legacy fallback key for permission refusals. */
 export const ACTION_ERROR_FORBIDDEN_KEY = "dms.action_error.forbidden";
-/** Shown when the server's message is missing or not meant for users. */
+/** Fallback key for actions without a more specific context. */
 export const ACTION_ERROR_GENERIC_KEY = "dms.action_error.generic";
 
-const HTTP_UNAUTHORIZED = 401;
-const HTTP_FORBIDDEN = 403;
-const HTTP_SERVER_ERROR = 500;
-
-const MAX_MESSAGE_LENGTH = 300;
-
-const KEY_PATTERN = /^\$?[\w-]+(\.[\w-]+)+$/;
-
-const TECHNICAL_PATTERNS = [
-  /^\s*[[{<]/,
-  /\n\s*at\s/,
-  /^\s*[A-Z]\w*Error\b/,
-  /<no response>/,
-];
-
-const NETWORK_MESSAGES = [/failed to fetch/i, /networkerror/i, /load failed/i];
-
-interface FetchErrorLike {
-  name?: string;
-  message?: string;
-  statusCode?: number;
-  status?: number;
-  response?: { status?: number };
-  data?: unknown;
-}
-
-// oxlint-disable-next-line anti-slop/no-unsafe-dictionary-type -- Error bodies are untrusted; property values remain unknown until their individual checks.
-const isObject = (value: unknown): value is Record<string, unknown> =>
-  isObjectType(value) && value !== null;
-
-const isFetchError = (error: unknown): error is FetchErrorLike =>
-  isObject(error) &&
-  (error.name === "FetchError" ||
-    "statusCode" in error ||
-    "response" in error ||
-    "data" in error);
-
-const statusOf = (error: FetchErrorLike): number | undefined =>
-  error.statusCode ?? error.status ?? error.response?.status;
-
-/** The message the server put in the error body, when it sent one. */
-const serverMessageOf = (error: FetchErrorLike): string | undefined => {
-  const { data } = error;
-  if (isString(data)) return data;
-  // oxlint-disable-next-line anti-slop/no-known-value-widening -- The object guard accepts all untrusted error data; only an actual string message is returned.
-  if (isObject(data) && isString(data.message)) return data.message;
-  return undefined;
-};
-
-const isTechnical = (text: string) =>
-  text.length > MAX_MESSAGE_LENGTH ||
-  TECHNICAL_PATTERNS.some((pattern) => pattern.test(text));
-
-/**
- * `text` as the user should read it: a translated i18n key, or plain prose
- * as it came. Undefined when it is not user-facing (an untranslated key, JSON,
- * a stack trace…), for the caller to fall back on a generic message.
- */
-export const userFacingText = (
-  text: string | undefined,
-  translate: I18nTranslate,
-): string | undefined => {
-  const trimmed = text?.trim();
-  if (!trimmed) return undefined;
-  const { key } = readTranslationKey(trimmed);
-  if (KEY_PATTERN.test(trimmed)) {
-    const translated = translate(key, {});
-    return translated !== key ? translated : undefined;
-  }
-  return isTechnical(trimmed) ? undefined : trimmed;
-};
-
-const translateKey = (translate: I18nTranslate, key: string) =>
-  translate(key, {});
-
-/**
- * The message telling a user why an action failed, from whatever the request
- * threw: the server's own message when it is user-facing (an i18n key, or
- * plain text on a 4xx), else a translated fallback: the request never got
- * through, it was refused for lack of permission, or something went wrong.
- * Never a stack trace, raw JSON or an ofetch error line. A body the data API
- * refused for some fields names them by `labelOf` ("Loss reason is
- * required."): a table view's write passes its column labels.
- */
+/** @deprecated Capture useApiErrorPresenter().resolveError during setup instead. */
 export function resolveActionError(
-  // oxlint-disable-next-line anti-slop/no-unknown-parameters -- The request's catch value is decoded here and may be any thrown JavaScript value.
   error: unknown,
-  translate: I18nTranslate,
-  labelOf: (field: string) => string | undefined = () => undefined,
+  _translate: I18nTranslate,
+  _labelOf?: (field: string) => string | undefined,
 ): string {
-  if (isFetchError(error)) {
-    const status = statusOf(error);
-    if (status === undefined) {
-      return translateKey(translate, ACTION_ERROR_NETWORK_KEY);
-    }
-    const raw = serverMessageOf(error);
-    const isForbidden =
-      status === HTTP_UNAUTHORIZED || status === HTTP_FORBIDDEN;
-
-    if (isForbidden || status >= HTTP_SERVER_ERROR) {
-      const translated =
-        raw && KEY_PATTERN.test(raw.trim())
-          ? userFacingText(raw, translate)
-          : undefined;
-      return (
-        translated ??
-        translateKey(
-          translate,
-          isForbidden ? ACTION_ERROR_FORBIDDEN_KEY : ACTION_ERROR_GENERIC_KEY,
-        )
-      );
-    }
-    return (
-      describeFieldErrors(error, translate, labelOf) ??
-      userFacingText(raw, translate) ??
-      translateKey(translate, ACTION_ERROR_GENERIC_KEY)
-    );
-  }
-
-  const message =
-    error instanceof Error
-      ? error.message
-      : isString(error)
-        ? error
-        : undefined;
-  if (message && NETWORK_MESSAGES.some((pattern) => pattern.test(message))) {
-    return translateKey(translate, ACTION_ERROR_NETWORK_KEY);
-  }
   return (
-    userFacingText(message, translate) ??
-    translateKey(translate, ACTION_ERROR_GENERIC_KEY)
+    useApiErrorPresenter().resolveError(error, {
+      fallbackKey: ACTION_ERROR_GENERIC_KEY,
+    })?.message ?? ""
   );
 }

package/frontend-vue/layers/dms-ui/app/build/composables/confirm/useActionConfirm.ts

@@ -3,7 +3,6 @@ import type {
   ConfirmDialog,
 } from "#dms-core/app/types/confirm-dialog";
 import { isConfirmFrom } from "#dms-core/app/types/confirm-dialog";
-import { resolveActionError } from "./actionError";
 import type {
   ConfirmOptions,
   ConfirmPartialOutcome,
@@ -43,8 +42,7 @@ export function useActionConfirm() {
   const { confirm } = useConfirm();
   const { $authFetch } = useAuthFetch();
   const { t } = useI18n();
-  const toast = useToast();
-  const consumeReadOnlyRefusal = useReadOnlyRefusal();
+  const { presentError } = useApiErrorPresenter();
   const runSecondaryTarget = secondaryTargetRunner($authFetch.raw);
 
   const loadDialog = async (
@@ -62,13 +60,7 @@ export function useActionConfirm() {
     try {
       return await $authFetch<ConfirmDialog>(url);
     } catch (error) {
-      if (consumeReadOnlyRefusal(error)) return undefined;
-      toast.add({
-        color: Color.error,
-        icon: "i-ph-warning-circle",
-        title: t("dms.form.error_title"),
-        description: resolveActionError(error, t),
-      });
+      presentError(error, { fallbackKey: "dms.action_error.generic" });
       return undefined;
     }
   };

package/frontend-vue/layers/dms-ui/app/build/composables/form/formState.ts

@@ -16,7 +16,6 @@ import {
 } from "../../utils/urlVariables";
 import { apiErrorStatus } from "#dms-core/app/composables/useFieldErrors";
 import { HTTP_NOT_FOUND } from "#dms-core/app/utils/http-status";
-import { isString } from "#dms-core/app/utils/type-check";
 import { sameFormValue } from "../unsaved-changes/formValue";
 import {
   type FieldValueComparer,
@@ -135,12 +134,11 @@ function createFormState(props: FormProps) {
 /** @internal */
 export function createFormFields(props: FormProps) {
   const context = createFormState(props);
+  const { presentError } = useApiErrorPresenter();
   const {
-    toast,
     $authFetch,
     getDataType,
     processI18n,
-    processApiMessage,
     route,
     initialValues,
     disabledFields,
@@ -205,15 +203,7 @@ export function createFormFields(props: FormProps) {
   };
 
   const showFetchErrorToast = (error: Parameters<typeof apiErrorStatus>[0]) => {
-    // oxlint-disable-next-line anti-slop/require-safety-comment-for-type-assertion -- Rejections are arbitrary; keep direct data access, primitive boxing and nullish throws rather than treating this unchecked error projection as validated.
-    const err = error as Error & { data?: string };
-    toast.add({
-      title: processI18n("$dms.form.fetch_error_title"),
-      description: isString(err.data)
-        ? processApiMessage(err.data)
-        : processI18n("$dms.form.fetch_error_unknown"),
-      color: Color.error,
-    });
+    presentError(error, { fallbackKey: "dms.form.fetch_error_unknown" });
   };
 
   const baseSchema = createBaseValidationSchema(props.schema);

package/frontend-vue/layers/dms-ui/app/build/composables/table/useTableConfigClipboard.ts

@@ -51,6 +51,7 @@ export const useTableConfigClipboard = <T extends Data>() => {
     injectLocal<ShallowRef<TableSharedData<T>>>("tableSharedData");
   const toast = useToast();
   const { t } = useI18n();
+  const { presentError } = useApiErrorPresenter();
 
   const buildConfig = (): SerializedTableConfig | null => {
     const data = tableSharedData?.value;
@@ -97,11 +98,9 @@ export const useTableConfigClipboard = <T extends Data>() => {
         title: t("dms.table.export_config_copied"),
         duration: TOAST_DURATION_MS,
       });
-    } catch {
-      toast.add({
-        color: "error",
-        title: t("dms.table.export_config_failed"),
-        description: code,
+    } catch (error) {
+      presentError(error, {
+        fallbackKey: "dms.table.export_config_failed",
       });
     }
   };
@@ -117,11 +116,9 @@ export const useTableConfigClipboard = <T extends Data>() => {
         duration: TOAST_DURATION_MS,
       });
       return true;
-    } catch {
-      toast.add({
-        color: "error",
-        title: t("dms.table.import_config_invalid"),
-        duration: TOAST_DURATION_MS,
+    } catch (error) {
+      presentError(error, {
+        fallbackKey: "dms.table.import_config_invalid",
       });
       return false;
     }

package/frontend-vue/layers/dms-ui/app/build/composables/table-view/tableRowActionBulkRequests.ts

@@ -17,9 +17,8 @@ import {
   type ConfirmPartialOutcome,
 } from "../../../composables/confirm/types";
 import { getErrorPayload } from "./tableRowActionValues";
-import type { describeTableWriteError } from "./utils/writeError";
 export type TableRowActionErrorHandler = (
-  error: Parameters<typeof describeTableWriteError>[0],
+  error: unknown,
   title?: string,
 ) => void;
 const createBulkRequest = (config: TableRowActionsConfig) => {
@@ -92,7 +91,8 @@ export const createTableRowBulkOutcomes = (
   services: TableRowActionServices,
   handleApiError: TableRowActionErrorHandler,
 ) => {
-  const { toast, t } = services;
+  const { t } = services;
+  const { presentError } = useApiErrorPresenter();
   const requestBulkAction = createBulkRequest(config);
   const reportBulkSuccess = createBulkReporter(config, services);
   /**
@@ -112,7 +112,10 @@ export const createTableRowBulkOutcomes = (
       const outcome = await requestBulkAction(ids, bulkConfig, values);
       const shortfall = bulkActionShortfall(bulkConfig.kind, outcome, t);
       if (outcome.processed === 0 && shortfall) {
-        throw new ConfirmActionError(shortfall);
+        throw new ConfirmActionError({
+          fallbackKey: `dms.table.bulk_refused.${bulkConfig.kind}`,
+          params: { count: outcome.skipped },
+        });
       }
       reportBulkSuccess(outcome.processed, actionConfig, bulkConfig);
       if (shortfall) return { partial: shortfall };
@@ -131,16 +134,14 @@ export const createTableRowBulkOutcomes = (
     try {
       outcome = await requestBulkAction(ids, bulkConfig);
     } catch (error) {
-      handleApiError(error, t(bulkConfig.errorKey));
+      handleApiError(error, bulkConfig.errorKey);
       return false;
     }
     const shortfall = bulkActionShortfall(bulkConfig.kind, outcome, t);
     if (outcome.processed === 0) {
-      toast.add({
-        color: Color.error,
-        icon: "i-ph-warning-circle",
-        title: shortfall?.title ?? t(bulkConfig.errorKey),
-        description: shortfall?.description,
+      presentError(null, {
+        fallbackKey: `dms.table.bulk_refused.${bulkConfig.kind}`,
+        params: { count: outcome.skipped },
       });
       return false;
     }

package/frontend-vue/layers/dms-ui/app/build/composables/table-view/tableRowActionValues.ts

@@ -1,5 +1,4 @@
 import { get } from "@nuxt/ui/runtime/utils/index.js";
-import type { describeTableWriteError } from "./utils/writeError";
 export const DEFAULT_ROW_ID_KEY = "_id";
 
 export const getItemId = (
@@ -9,9 +8,7 @@ export const getItemId = (
   return get(item, idKey) ?? item._id ?? item.id;
 };
 
-export const getErrorPayload = (
-  error: Parameters<typeof describeTableWriteError>[0],
-) => {
+export const getErrorPayload = (error: unknown) => {
   // oxlint-disable-next-line anti-slop/require-safety-comment-for-type-assertion -- Rejections may be arbitrary JavaScript values, not EventError instances. Its owner describes only the fields forwarded here; inference cannot prove them, and validation would change primitive and malformed-error payloads.
   const err = error as EventError;
   return err?.data || err?.message;

package/frontend-vue/layers/dms-ui/app/build/composables/table-view/tableViewGrouping.ts

@@ -3,7 +3,7 @@ import {
   CARDS_DISPLAY_ID,
 } from "../../../composables/table-view/types";
 import { KANBAN_DISPLAY_BRIDGE_KEY } from "../../../composables/table-view/kanban";
-import { describeTableWriteError } from "./utils/writeError";
+import { tableWriteErrorOptions } from "./utils/writeError";
 import { buildTableQuery, isFilterEffective } from "./utils/tableQuery";
 import { useGroupedRows } from "./useGroupedRows";
 import { useTableReorder } from "./useTableReorder";
@@ -32,10 +32,9 @@ export function useTableViewReorder<T extends Data>(
   const { effectiveColumnFilters, effectiveGlobalFilter } = scope.querySorting;
   const { activeTabFilters, t } = scope.tabs;
   const { activeDisplayId } = scope.displayOptions;
-  const { toast } = scope.sortRecovery;
   const { processI18n } = scope.arrival;
   const { props } = scope;
-  const consumeReadOnlyRefusal = useReadOnlyRefusal();
+  const { presentError } = useApiErrorPresenter();
   const ORDERED_DISPLAY_IDS = new Set([TABLE_DISPLAY_ID, CARDS_DISPLAY_ID]);
   const { reorderState } = useTableReorder<T>({
     reorder: reorderConfig,
@@ -55,18 +54,16 @@ export function useTableViewReorder<T extends Data>(
     ),
     refresh: () => refresh(),
     onError: (failure) => {
-      if (consumeReadOnlyRefusal(failure)) return;
-      toast.add({
-        title: t("dms.table.reorder.error"),
-        description: describeTableWriteError(
+      presentError(
+        failure,
+        tableWriteErrorOptions(
           failure,
           t,
           allColumns,
           processI18n,
+          "dms.table.reorder.error",
         ),
-        color: Color.error,
-        icon: "i-ph-warning-circle",
-      });
+      );
     },
   });
   return { reorderState };

package/frontend-vue/layers/dms-ui/app/build/composables/table-view/useExpandedRowDetails.ts

@@ -18,6 +18,7 @@ export function useExpandedRowDetails<T>(
   getRow: (id: string) => Promise<T | undefined>,
 ) {
   const entries = ref<Record<string, ExpandedRowDetailEntry<T>>>({});
+  const { presentError } = useApiErrorPresenter();
   let generation = 0;
 
   const setEntry = (id: string, entry: ExpandedRowDetailEntry<T>) => {
@@ -30,7 +31,9 @@ export function useExpandedRowDetails<T>(
     let row: T | undefined;
     try {
       row = await getRow(id);
-    } catch {
+    } catch (error) {
+      if (loadedFor !== generation) return;
+      presentError(error, { fallbackKey: "dms.table.load_error_title" });
       row = undefined;
     }
     if (loadedFor !== generation) return;