From 7df00859c63796802a6b1fe5b7c841bd76e3fcca Mon Sep 17 00:00:00 2001
From: Marcel <marcel@familienarchiv>
Date: Sat, 25 Apr 2026 16:46:58 +0200
Subject: [PATCH] fix(bulk-edit): pluralization, edit-mode CTA, error UI, real
 loading state
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Elicit C1+C3 — bulk-selection count uses ICU-style plural keys
(bulk_edit_n_selected_one / _other) so n=1 reads as "1 Dokument" instead
of "1 Dokumente". Save CTA in edit mode reads "Anwenden" via the existing
bulk_edit_save_button key; UploadSaveBar grew an editMode prop. Multi-
chunk progress text is now visible (not aria-only).

Felix C2 — bulk-edit page wires the backend error code through
parseBackendError + getErrorMessage instead of falling back to a generic
internal_error.

Felix C5 — editAllMatching no longer swallows fetch failures: the button
shows an inline error with the backend-mapped message (e.g. when the
filter cap is exceeded).

Leonie C8 — replace the literal "…" loading glyph on /documents/bulk-edit
with a spinner + role=status + aria-live=polite + visible "Loading
documents…" text.

Leonie C9 — partial-failure card and bulk-edit page error card now use
the design-system `text-danger` / `bg-danger/10` / `border-danger/40`
tokens (dark-mode safe) instead of raw red palette values.

Leonie C10 + C13 — German plural fixed; EN badges retensed
("+ added" → "+ will be added", "replaced" → "will replace") to match
the future-tense intent of DE/ES.

Refs #225, PR #331

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 frontend/messages/de.json                     |  7 +++-
 frontend/messages/en.json                     | 11 ++++--
 frontend/messages/es.json                     |  7 +++-
 .../document/BulkDocumentEditLayout.svelte    |  3 +-
 .../document/BulkSelectionBar.svelte          |  2 +-
 .../components/document/UploadSaveBar.svelte  | 28 +++++++++++--
 frontend/src/routes/documents/+page.svelte    | 19 +++++++--
 .../routes/documents/bulk-edit/+page.svelte   | 39 +++++++++++++++++--
 8 files changed, 94 insertions(+), 22 deletions(-)

diff --git a/frontend/messages/de.json b/frontend/messages/de.json
index 8088ef6b..cd9e60d8 100644
--- a/frontend/messages/de.json
+++ b/frontend/messages/de.json
@@ -875,7 +875,8 @@
 	"bulk_title_single": "Neues Dokument",
 	"bulk_title_multi": "Neue Dokumente",
 	"bulk_edit_button": "Massenbearbeitung",
-	"bulk_edit_n_selected": "{count} Dokumente ausgewählt",
+	"bulk_edit_n_selected_one": "1 Dokument ausgewählt",
+	"bulk_edit_n_selected_other": "{count} Dokumente ausgewählt",
 	"bulk_edit_clear_all": "Alles aufheben",
 	"bulk_edit_all_x": "Alle {count} editieren",
 	"bulk_edit_select_document": "Dokument {title} auswählen",
@@ -893,5 +894,7 @@
 	"form_label_archive_folder": "Mappe",
 	"form_helper_archive_folder": "Welche Mappe innerhalb des Kartons?",
 	"bulk_edit_clear_selection": "Auswahl aufheben",
-	"bulk_edit_clear_hint_keyboard": "Esc: Auswahl aufheben"
+	"bulk_edit_clear_hint_keyboard": "Esc: Auswahl aufheben",
+	"bulk_edit_loading": "Dokumente werden geladen…",
+	"bulk_edit_all_x_failed": "Filter konnte nicht abgerufen werden — bitte erneut versuchen."
 }
diff --git a/frontend/messages/en.json b/frontend/messages/en.json
index d5796dbf..9c505a67 100644
--- a/frontend/messages/en.json
+++ b/frontend/messages/en.json
@@ -875,13 +875,14 @@
 	"bulk_title_single": "New Document",
 	"bulk_title_multi": "New Documents",
 	"bulk_edit_button": "Bulk edit",
-	"bulk_edit_n_selected": "{count} documents selected",
+	"bulk_edit_n_selected_one": "1 document selected",
+	"bulk_edit_n_selected_other": "{count} documents selected",
 	"bulk_edit_clear_all": "Clear all",
 	"bulk_edit_all_x": "Edit all {count}",
 	"bulk_edit_select_document": "Select document {title}",
 	"bulk_edit_hint": "Only filled fields are applied. Tags and receivers are added, not replaced.",
-	"bulk_edit_badge_additive": "+ added",
-	"bulk_edit_badge_replace": "replaced",
+	"bulk_edit_badge_additive": "+ will be added",
+	"bulk_edit_badge_replace": "will replace",
 	"bulk_edit_save_progress": "Batch {done} of {total} processed",
 	"bulk_edit_save_partial": "{done} of {total} saved",
 	"bulk_edit_retry": "Retry",
@@ -893,5 +894,7 @@
 	"form_label_archive_folder": "Folder",
 	"form_helper_archive_folder": "Which folder inside the box?",
 	"bulk_edit_clear_selection": "Clear selection",
-	"bulk_edit_clear_hint_keyboard": "Esc: clear selection"
+	"bulk_edit_clear_hint_keyboard": "Esc: clear selection",
+	"bulk_edit_loading": "Loading documents…",
+	"bulk_edit_all_x_failed": "Could not load filter results — please retry."
 }
diff --git a/frontend/messages/es.json b/frontend/messages/es.json
index 2678eee0..fdd5dd22 100644
--- a/frontend/messages/es.json
+++ b/frontend/messages/es.json
@@ -875,7 +875,8 @@
 	"bulk_title_single": "Nuevo Documento",
 	"bulk_title_multi": "Nuevos Documentos",
 	"bulk_edit_button": "Edición masiva",
-	"bulk_edit_n_selected": "{count} documentos seleccionados",
+	"bulk_edit_n_selected_one": "1 documento seleccionado",
+	"bulk_edit_n_selected_other": "{count} documentos seleccionados",
 	"bulk_edit_clear_all": "Limpiar todo",
 	"bulk_edit_all_x": "Editar los {count}",
 	"bulk_edit_select_document": "Seleccionar documento {title}",
@@ -893,5 +894,7 @@
 	"form_label_archive_folder": "Carpeta",
 	"form_helper_archive_folder": "¿Qué carpeta dentro de la caja?",
 	"bulk_edit_clear_selection": "Limpiar selección",
-	"bulk_edit_clear_hint_keyboard": "Esc: limpiar selección"
+	"bulk_edit_clear_hint_keyboard": "Esc: limpiar selección",
+	"bulk_edit_loading": "Cargando documentos…",
+	"bulk_edit_all_x_failed": "No se pudieron cargar los resultados del filtro; vuelve a intentarlo."
 }
diff --git a/frontend/src/lib/components/document/BulkDocumentEditLayout.svelte b/frontend/src/lib/components/document/BulkDocumentEditLayout.svelte
index 57d21dd9..6dd18490 100644
--- a/frontend/src/lib/components/document/BulkDocumentEditLayout.svelte
+++ b/frontend/src/lib/components/document/BulkDocumentEditLayout.svelte
@@ -495,7 +495,7 @@ async function retrySave() {
 					<div
 						role="alert"
 						data-testid="bulk-edit-partial-failure"
-						class="rounded-sm border border-red-300 bg-red-50 px-4 py-3 text-sm text-red-700"
+						class="rounded-sm border border-danger/40 bg-danger/10 px-4 py-3 text-sm text-danger"
 					>
 						<p class="font-medium">
 							{m.bulk_edit_save_partial({
@@ -521,6 +521,7 @@ async function retrySave() {
 				onSave={save}
 				onDiscard={handleDiscard}
 				disabled={saving}
+				editMode={mode === 'edit'}
 			/>
 		</div>
 	</div>
diff --git a/frontend/src/lib/components/document/BulkSelectionBar.svelte b/frontend/src/lib/components/document/BulkSelectionBar.svelte
index 14e02c45..5cd06cc8 100644
--- a/frontend/src/lib/components/document/BulkSelectionBar.svelte
+++ b/frontend/src/lib/components/document/BulkSelectionBar.svelte
@@ -40,7 +40,7 @@ function onEscape(e: KeyboardEvent) {
 				aria-live="polite"
 				aria-atomic="true"
 			>
-				{m.bulk_edit_n_selected({ count })}
+				{count === 1 ? m.bulk_edit_n_selected_one() : m.bulk_edit_n_selected_other({ count })}
 			</span>
 			<span class="hidden font-sans text-xs text-ink-3 sm:inline">
 				{m.bulk_edit_clear_hint_keyboard()}
diff --git a/frontend/src/lib/components/document/UploadSaveBar.svelte b/frontend/src/lib/components/document/UploadSaveBar.svelte
index d404e864..adeca383 100644
--- a/frontend/src/lib/components/document/UploadSaveBar.svelte
+++ b/frontend/src/lib/components/document/UploadSaveBar.svelte
@@ -6,14 +6,21 @@ let {
 	chunkProgress,
 	onSave,
 	onDiscard,
-	disabled = false
+	disabled = false,
+	editMode = false
 }: {
 	fileCount: number;
 	chunkProgress?: { done: number; total: number };
 	onSave: () => void;
 	onDiscard: () => void | Promise<void>;
 	disabled?: boolean;
+	editMode?: boolean;
 } = $props();
+
+const saveCta = $derived.by(() => {
+	if (editMode) return m.bulk_edit_save_button();
+	return fileCount === 1 ? m.bulk_save_cta_one() : m.bulk_save_cta({ count: fileCount });
+});
 </script>
 
 <div class="shrink-0 border-t border-line bg-surface px-4 py-3">
@@ -24,9 +31,22 @@ let {
 			aria-valuenow={chunkProgress.done}
 			aria-valuemin={0}
 			aria-valuemax={chunkProgress.total}
-			aria-label={m.bulk_upload_progress({ done: chunkProgress.done, total: chunkProgress.total })}
-			class="[&::-webkit-progress-bar]:bg-brand-sand mb-3 h-1 w-full rounded-full [&::-webkit-progress-bar]:rounded-full [&::-webkit-progress-value]:rounded-full [&::-webkit-progress-value]:bg-accent"
+			aria-label={editMode
+				? m.bulk_edit_save_progress({ done: chunkProgress.done, total: chunkProgress.total })
+				: m.bulk_upload_progress({ done: chunkProgress.done, total: chunkProgress.total })}
+			class="[&::-webkit-progress-bar]:bg-brand-sand mb-2 h-1 w-full rounded-full [&::-webkit-progress-bar]:rounded-full [&::-webkit-progress-value]:rounded-full [&::-webkit-progress-value]:bg-accent"
 		></progress>
+		{#if editMode && chunkProgress.total > 1}
+			<!-- Visible progress text for sighted users on multi-chunk PATCH
+				 (Elicit S3 — the unitless bar isn't enough for a 30-second op). -->
+			<p
+				class="mb-2 font-sans text-xs text-ink-2"
+				aria-live="polite"
+				data-testid="bulk-edit-chunk-progress-text"
+			>
+				{m.bulk_edit_save_progress({ done: chunkProgress.done, total: chunkProgress.total })}
+			</p>
+		{/if}
 	{/if}
 	<div class="flex items-center justify-between gap-3">
 		<button
@@ -43,7 +63,7 @@ let {
 			onclick={onSave}
 			class="min-h-[44px] rounded-sm bg-primary px-6 text-sm font-bold tracking-widest text-primary-fg uppercase transition-opacity hover:opacity-90 disabled:opacity-40"
 		>
-			{fileCount === 1 ? m.bulk_save_cta_one() : m.bulk_save_cta({ count: fileCount })}
+			{saveCta}
 		</button>
 	</div>
 </div>
diff --git a/frontend/src/routes/documents/+page.svelte b/frontend/src/routes/documents/+page.svelte
index 82effc6f..40e9db49 100644
--- a/frontend/src/routes/documents/+page.svelte
+++ b/frontend/src/routes/documents/+page.svelte
@@ -8,6 +8,7 @@ import DocumentList from '../DocumentList.svelte';
 import Pagination from '$lib/components/Pagination.svelte';
 import BulkSelectionBar from '$lib/components/document/BulkSelectionBar.svelte';
 import { bulkSelectionStore } from '$lib/stores/bulkSelection.svelte';
+import { getErrorMessage, parseBackendError } from '$lib/errors';
 import * as m from '$lib/paraglide/messages.js';
 
 let { data } = $props();
@@ -141,16 +142,18 @@ $effect(() => {
 });
 
 let editingAll = $state(false);
+let editAllError = $state<string | null>(null);
 
 /**
  * Fast path: replace the current selection with every document matching the
  * active filter (across all pages) and jump to the bulk-edit screen. The
- * /api/documents/ids endpoint is uncapped — chunking happens at PATCH time
- * inside the bulk-edit page's save handler.
+ * /api/documents/ids endpoint is hard-capped (5000 results); on cap overflow
+ * the backend returns BULK_EDIT_TOO_MANY_IDS, which we surface inline.
  */
 async function editAllMatching() {
 	if (editingAll) return;
 	editingAll = true;
+	editAllError = null;
 	try {
 		const params = buildSearchParams({
 			q: data.q || '',
@@ -168,12 +171,15 @@ async function editAllMatching() {
 		params.delete('dir');
 		const res = await fetch(`/api/documents/ids?${params.toString()}`);
 		if (!res.ok) {
-			editingAll = false;
+			const backend = await parseBackendError(res);
+			editAllError = getErrorMessage(backend?.code);
 			return;
 		}
 		const ids: string[] = await res.json();
 		bulkSelectionStore.setAll(ids);
 		await goto('/documents/bulk-edit');
+	} catch {
+		editAllError = m.bulk_edit_all_x_failed();
 	} finally {
 		editingAll = false;
 	}
@@ -229,7 +235,7 @@ $effect(() => {
 	/>
 
 	{#if data.canWrite && data.totalElements > 0}
-		<div class="mb-2 flex justify-end">
+		<div class="mb-2 flex flex-col items-end gap-1">
 			<button
 				type="button"
 				onclick={editAllMatching}
@@ -239,6 +245,11 @@ $effect(() => {
 			>
 				{m.bulk_edit_all_x({ count: data.totalElements })}
 			</button>
+			{#if editAllError}
+				<p role="alert" class="text-xs text-danger" data-testid="bulk-edit-all-x-error">
+					{editAllError}
+				</p>
+			{/if}
 		</div>
 	{/if}
 
diff --git a/frontend/src/routes/documents/bulk-edit/+page.svelte b/frontend/src/routes/documents/bulk-edit/+page.svelte
index b4018b8e..ba57e0e4 100644
--- a/frontend/src/routes/documents/bulk-edit/+page.svelte
+++ b/frontend/src/routes/documents/bulk-edit/+page.svelte
@@ -5,6 +5,7 @@ import { bulkSelectionStore } from '$lib/stores/bulkSelection.svelte';
 import BulkDocumentEditLayout, {
 	type BulkEditEntry
 } from '$lib/components/document/BulkDocumentEditLayout.svelte';
+import { getErrorMessage, parseBackendError } from '$lib/errors';
 import { m } from '$lib/paraglide/messages.js';
 
 let entries = $state<BulkEditEntry[]>([]);
@@ -14,6 +15,9 @@ let error = $state<string | null>(null);
 onMount(async () => {
 	const ids = Array.from(bulkSelectionStore.ids);
 	if (ids.length === 0) {
+		// Skip the loading flash on the empty-store redirect path — the user
+		// is bouncing back to /documents in the next tick.
+		loading = false;
 		await goto('/documents');
 		return;
 	}
@@ -24,14 +28,15 @@ onMount(async () => {
 			body: JSON.stringify({ ids })
 		});
 		if (!res.ok) {
-			error = m.error_internal_error();
+			const backend = await parseBackendError(res);
+			error = getErrorMessage(backend?.code);
 			loading = false;
 			return;
 		}
 		const summaries = (await res.json()) as BulkEditEntry[];
 		entries = summaries;
 	} catch {
-		error = m.error_internal_error();
+		error = getErrorMessage(undefined);
 	} finally {
 		loading = false;
 	}
@@ -43,9 +48,35 @@ onMount(async () => {
 </svelte:head>
 
 {#if loading}
-	<div class="flex h-full items-center justify-center p-12 text-sm text-ink-2">…</div>
+	<div
+		class="flex h-full items-center justify-center gap-3 p-12 text-sm text-ink-2"
+		role="status"
+		aria-live="polite"
+		data-testid="bulk-edit-loading"
+	>
+		<svg
+			class="h-5 w-5 animate-spin text-ink-3"
+			xmlns="http://www.w3.org/2000/svg"
+			fill="none"
+			viewBox="0 0 24 24"
+			aria-hidden="true"
+		>
+			<circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"
+			></circle>
+			<path
+				class="opacity-75"
+				fill="currentColor"
+				d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
+			></path>
+		</svg>
+		<span>{m.bulk_edit_loading()}</span>
+	</div>
 {:else if error}
-	<div class="m-6 rounded-sm border border-red-300 bg-red-50 p-4 text-sm text-red-700">
+	<div
+		role="alert"
+		class="m-6 rounded-sm border border-danger/40 bg-danger/10 p-4 text-sm text-danger"
+		data-testid="bulk-edit-page-error"
+	>
 		{error}
 	</div>
 {:else if entries.length > 0}