fix(csrf): send X-XSRF-TOKEN on all client-side mutating fetch calls

hooks.server.ts already forwards the CSRF token for server-side fetch
(form actions, load). Client-side XHR calls bypassed it, causing Spring
Security to return 403 before PermissionAspect even ran.

Adds getCsrfToken/withCsrf/makeCsrfFetch to cookies.ts.
useTranscriptionBlocks wraps its injectable fetchImpl with makeCsrfFetch
(covers all block mutations and saveBlockWithConflictRetry).
useBlockAutoSave, TranscriptionEditView, BulkDocumentEditLayout,
OcrTrainingCard, and SegmentationTrainingCard apply withCsrf inline.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

.gitea/workflows/nightly.yml

@@ -79,6 +79,7 @@ jobs:
           IMPORT_HOST_DIR=/srv/familienarchiv-staging/import
           POSTGRES_USER=archiv
           SENTRY_DSN=${{ secrets.SENTRY_DSN }}
+          VITE_SENTRY_DSN=${{ secrets.VITE_SENTRY_DSN }}
           EOF
 
       - name: Verify backend /import:ro mount is wired

backend/src/main/java/org/raddatz/familienarchiv/document/Document.java

@@ -25,11 +25,14 @@ import java.util.UUID;
 @NamedEntityGraph(name = "Document.full", attributeNodes = {
         @NamedAttributeNode("sender"),
         @NamedAttributeNode("receivers"),
-        @NamedAttributeNode("tags")
+        @NamedAttributeNode("tags"),
+        @NamedAttributeNode("trainingLabels")
 })
 @NamedEntityGraph(name = "Document.list", attributeNodes = {
         @NamedAttributeNode("sender"),
-        @NamedAttributeNode("tags")
+        @NamedAttributeNode("receivers"),
+        @NamedAttributeNode("tags"),
+        @NamedAttributeNode("trainingLabels")
 })
 @Entity
 @Table(name = "documents")

backend/src/main/java/org/raddatz/familienarchiv/document/transcription/TranscriptionBlockController.java

@@ -43,7 +43,7 @@ public class TranscriptionBlockController {
 
     @PostMapping
     @ResponseStatus(HttpStatus.CREATED)
-    @RequirePermission(Permission.WRITE_ALL)
+    @RequirePermission({Permission.ANNOTATE_ALL, Permission.WRITE_ALL})
     public TranscriptionBlock createBlock(
             @PathVariable UUID documentId,
             @Valid @RequestBody CreateTranscriptionBlockDTO dto,
@@ -53,7 +53,7 @@ public class TranscriptionBlockController {
     }
 
     @PutMapping("/{blockId}")
-    @RequirePermission(Permission.WRITE_ALL)
+    @RequirePermission({Permission.ANNOTATE_ALL, Permission.WRITE_ALL})
     public TranscriptionBlock updateBlock(
             @PathVariable UUID documentId,
             @PathVariable UUID blockId,
@@ -65,7 +65,7 @@ public class TranscriptionBlockController {
 
     @DeleteMapping("/{blockId}")
     @ResponseStatus(HttpStatus.NO_CONTENT)
-    @RequirePermission(Permission.WRITE_ALL)
+    @RequirePermission({Permission.ANNOTATE_ALL, Permission.WRITE_ALL})
     public void deleteBlock(
             @PathVariable UUID documentId,
             @PathVariable UUID blockId) {
@@ -73,7 +73,7 @@ public class TranscriptionBlockController {
     }
 
     @PutMapping("/reorder")
-    @RequirePermission(Permission.WRITE_ALL)
+    @RequirePermission({Permission.ANNOTATE_ALL, Permission.WRITE_ALL})
     public List<TranscriptionBlock> reorderBlocks(
             @PathVariable UUID documentId,
             @RequestBody ReorderTranscriptionBlocksDTO dto) {
@@ -82,7 +82,7 @@ public class TranscriptionBlockController {
     }
 
     @PutMapping("/{blockId}/review")
-    @RequirePermission(Permission.WRITE_ALL)
+    @RequirePermission({Permission.ANNOTATE_ALL, Permission.WRITE_ALL})
     public TranscriptionBlock reviewBlock(
             @PathVariable UUID documentId,
             @PathVariable UUID blockId,
@@ -92,7 +92,7 @@ public class TranscriptionBlockController {
     }
 
     @PutMapping("/review-all")
-    @RequirePermission(Permission.WRITE_ALL)
+    @RequirePermission({Permission.ANNOTATE_ALL, Permission.WRITE_ALL})
     public List<TranscriptionBlock> markAllBlocksReviewed(
             @PathVariable UUID documentId,
             Authentication authentication) {

docker-compose.prod.yml

@@ -252,6 +252,8 @@ services:
       OTEL_METRICS_EXPORTER: none
       MANAGEMENT_METRICS_TAGS_APPLICATION: Familienarchiv
       MANAGEMENT_TRACING_SAMPLING_PROBABILITY: ${MANAGEMENT_TRACING_SAMPLING_PROBABILITY:-0.1}
+      SENTRY_DSN: ${SENTRY_DSN:-}
+      LOGGING_STRUCTURED_FORMAT_CONSOLE: ecs
     networks:
       - archiv-net
     healthcheck:
@@ -266,6 +268,10 @@ services:
     build:
       context: ./frontend
       target: production
+      args:
+        # Vite build-time variable — baked into the JS bundle at build time.
+        # Empty default so deploys succeed before the secret is configured.
+        VITE_SENTRY_DSN: ${VITE_SENTRY_DSN:-}
     restart: unless-stopped
     depends_on:
       backend:

frontend/Dockerfile

@@ -16,6 +16,10 @@ CMD ["npm", "run", "dev"]
 # Compiles the SvelteKit Node-adapter output to /app/build.
 FROM node:20.19.0-alpine3.21 AS build
 WORKDIR /app
+# VITE_SENTRY_DSN is a build-time variable — Vite bakes it into the bundle.
+# Passed via docker-compose build.args; empty string disables the SDK.
+ARG VITE_SENTRY_DSN
+ENV VITE_SENTRY_DSN=$VITE_SENTRY_DSN
 COPY package.json package-lock.json ./
 RUN npm ci
 COPY . .

frontend/messages/de.json

@@ -634,6 +634,9 @@
 	"transcription_block_review": "Als geprüft markieren",
 	"transcription_block_unreview": "Markierung aufheben",
 	"transcription_reviewed_count": "{reviewed} von {total} geprüft",
+	"transcription_mark_all_reviewed": "Alle als fertig markieren",
+	"transcription_mark_all_reviewed_disabled": "Alle Blöcke sind bereits als fertig markiert",
+	"transcription_mark_all_reviewed_error": "Markierung fehlgeschlagen. Bitte versuchen Sie es erneut.",
 	"training_ocr_heading": "Kurrent-Erkennung trainieren",
 	"training_ocr_description": "Starte ein neues Training mit den bisher geprüften OCR-Blöcken, um die Erkennungsgenauigkeit für Kurrentschrift zu verbessern.",
 	"training_ocr_blocks_ready": "{blocks} geprüfte Blöcke bereit / {docs} Dokumente",

frontend/messages/en.json

@@ -634,6 +634,9 @@
 	"transcription_block_review": "Mark as reviewed",
 	"transcription_block_unreview": "Unmark as reviewed",
 	"transcription_reviewed_count": "{reviewed} of {total} reviewed",
+	"transcription_mark_all_reviewed": "Mark all as reviewed",
+	"transcription_mark_all_reviewed_disabled": "All blocks are already marked as reviewed",
+	"transcription_mark_all_reviewed_error": "Failed to mark all as reviewed. Please try again.",
 	"training_ocr_heading": "Train Kurrent recognition",
 	"training_ocr_description": "Start a new training run using the reviewed OCR blocks to improve recognition accuracy for Kurrent script.",
 	"training_ocr_blocks_ready": "{blocks} reviewed blocks ready / {docs} documents",

frontend/messages/es.json

@@ -634,6 +634,9 @@
 	"transcription_block_review": "Marcar como revisado",
 	"transcription_block_unreview": "Desmarcar como revisado",
 	"transcription_reviewed_count": "{reviewed} de {total} revisados",
+	"transcription_mark_all_reviewed": "Marcar todo como revisado",
+	"transcription_mark_all_reviewed_disabled": "Todos los bloques ya están marcados como revisados",
+	"transcription_mark_all_reviewed_error": "Error al marcar como revisado. Intente de nuevo.",
 	"training_ocr_heading": "Entrenar reconocimiento Kurrent",
 	"training_ocr_description": "Inicia un nuevo entrenamiento con los bloques OCR revisados para mejorar la precisión de reconocimiento del script Kurrent.",
 	"training_ocr_blocks_ready": "{blocks} bloques revisados listos / {docs} documentos",

frontend/src/lib/document/BulkDocumentEditLayout.svelte

@@ -17,6 +17,7 @@ import PdfViewer from '$lib/document/viewer/PdfViewer.svelte';
 import { bulkTitleFromFilename } from '$lib/document/filename';
 import type { Tag } from '$lib/tag/TagInput.svelte';
 import type { components } from '$lib/generated/api';
+import { withCsrf } from '$lib/shared/cookies';
 
 type Person = components['schemas']['Person'];
 
@@ -183,7 +184,10 @@ async function saveUpload() {
 		// FormData with per-chunk progress. Session cookie is sent automatically
 		// by the browser for same-origin requests.
 		try {
-			const res = await fetch('/api/documents/quick-upload', { method: 'POST', body: formData });
+			const res = await fetch(
+				'/api/documents/quick-upload',
+				withCsrf({ method: 'POST', body: formData })
+			);
 			const body = await res.json().catch(() => ({ errors: [] }));
 			const errorFilenames = new Set<string>(
 				(body.errors ?? []).map((err: { filename: string }) => err.filename)

frontend/src/lib/document/transcription/TranscriptionEditView.svelte

@@ -6,6 +6,7 @@ import TranscribeCoachEmptyState from '$lib/shared/help/TranscribeCoachEmptyStat
 import type { PersonMention, TranscriptionBlockData } from '$lib/shared/types';
 import { createBlockAutoSave } from '$lib/document/transcription/useBlockAutoSave.svelte';
 import { createBlockDragDrop } from '$lib/document/transcription/useBlockDragDrop.svelte';
+import { withCsrf } from '$lib/shared/cookies';
 
 type Props = {
 	documentId: string;
@@ -49,6 +50,7 @@ let activeBlockId: string | null = $state(null);
 let localLabels: string[] = $derived.by(() => [...trainingLabels]);
 let listEl: HTMLElement | null = $state(null);
 let markingAllReviewed = $state(false);
+let markAllError = $state<string | null>(null);
 
 const sortedBlocks = $derived([...blocks].sort((a, b) => a.sortOrder - b.sortOrder));
 const hasBlocks = $derived(blocks.length > 0);
@@ -67,8 +69,11 @@ $effect(() => {
 async function handleMarkAllReviewed() {
 	if (!onMarkAllReviewed) return;
 	markingAllReviewed = true;
+	markAllError = null;
 	try {
 		await onMarkAllReviewed();
+	} catch {
+		markAllError = m.transcription_mark_all_reviewed_error();
 	} finally {
 		markingAllReviewed = false;
 	}
@@ -109,11 +114,14 @@ function handleDelete(blockId: string) {
 
 async function reorder(newOrder: string[]) {
 	try {
-		const res = await fetch(`/api/documents/${documentId}/transcription-blocks/reorder`, {
-			method: 'PUT',
-			headers: { 'Content-Type': 'application/json' },
-			body: JSON.stringify({ blockIds: newOrder })
-		});
+		const res = await fetch(
+			`/api/documents/${documentId}/transcription-blocks/reorder`,
+			withCsrf({
+				method: 'PUT',
+				headers: { 'Content-Type': 'application/json' },
+				body: JSON.stringify({ blockIds: newOrder })
+			})
+		);
 		if (!res.ok) return;
 		const updated = await res.json();
 		for (const b of updated) {
@@ -169,7 +177,7 @@ async function handleLabelToggle(label: string) {
 					<button
 						onclick={handleMarkAllReviewed}
 						disabled={allReviewed || markingAllReviewed}
-						title={allReviewed ? 'Alle Blöcke sind bereits als fertig markiert' : undefined}
+						title={allReviewed ? m.transcription_mark_all_reviewed_disabled() : undefined}
 						class="flex min-h-[44px] items-center gap-1.5 rounded-sm px-3 font-sans text-xs font-medium text-brand-navy/80 transition-colors hover:text-brand-navy focus-visible:ring-2 focus-visible:ring-brand-navy disabled:opacity-40"
 					>
 						{#if markingAllReviewed}
@@ -207,7 +215,7 @@ async function handleLabelToggle(label: string) {
 								<path stroke-linecap="round" stroke-linejoin="round" d="M5 13l4 4L19 7" />
 							</svg>
 						{/if}
-						Alle als fertig markieren
+						{m.transcription_mark_all_reviewed()}
 					</button>
 				{/if}
 			</div>
@@ -217,6 +225,31 @@ async function handleLabelToggle(label: string) {
 					style="width: {reviewProgress}%"
 				></div>
 			</div>
+			{#if markAllError}
+				<div
+					role="alert"
+					class="mt-1.5 flex items-center gap-2 rounded-sm border border-red-200 bg-red-50 px-3 py-2 font-sans text-sm text-red-700"
+				>
+					<span class="flex-1">{markAllError}</span>
+					<button
+						onclick={() => (markAllError = null)}
+						aria-label={m.comp_dismiss()}
+						class="flex min-h-[44px] min-w-[44px] items-center justify-center rounded text-red-600 hover:text-red-700 focus-visible:ring-2 focus-visible:ring-red-500"
+					>
+						<svg
+							class="h-4 w-4"
+							fill="none"
+							stroke="currentColor"
+							stroke-width="2"
+							viewBox="0 0 24 24"
+							xmlns="http://www.w3.org/2000/svg"
+							aria-hidden="true"
+						>
+							<path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12" />
+						</svg>
+					</button>
+				</div>
+			{/if}
 		</div>
 		<div class="p-4">
 			<!-- svelte-ignore a11y_no_static_element_interactions -->

frontend/src/lib/document/transcription/TranscriptionEditView.svelte.spec.ts

@@ -3,6 +3,7 @@ import { cleanup, render } from 'vitest-browser-svelte';
 import { page, userEvent } from 'vitest/browser';
 import TranscriptionEditView from './TranscriptionEditView.svelte';
 import { createConfirmService, CONFIRM_KEY } from '$lib/shared/services/confirm.svelte.js';
+import { m } from '$lib/paraglide/messages.js';
 
 afterEach(cleanup);
 
@@ -312,14 +313,14 @@ describe('TranscriptionEditView — mark all reviewed', () => {
 			onMarkAllReviewed: vi.fn().mockResolvedValue(undefined)
 		});
 		await expect
-			.element(page.getByRole('button', { name: /Alle als fertig markieren/ }))
+			.element(page.getByRole('button', { name: m.transcription_mark_all_reviewed() }))
 			.toBeInTheDocument();
 	});
 
 	it('does not show "Alle als fertig markieren" button when onMarkAllReviewed is not provided', async () => {
 		renderView({ blocks: [unreviewedBlock1, unreviewedBlock2] });
 		await expect
-			.element(page.getByRole('button', { name: /Alle als fertig markieren/ }))
+			.element(page.getByRole('button', { name: m.transcription_mark_all_reviewed() }))
 			.not.toBeInTheDocument();
 	});
 
@@ -329,7 +330,7 @@ describe('TranscriptionEditView — mark all reviewed', () => {
 			onMarkAllReviewed: vi.fn().mockResolvedValue(undefined)
 		});
 		await expect
-			.element(page.getByRole('button', { name: /Alle als fertig markieren/ }))
+			.element(page.getByRole('button', { name: m.transcription_mark_all_reviewed() }))
 			.toBeDisabled();
 	});
 
@@ -343,7 +344,7 @@ describe('TranscriptionEditView — mark all reviewed', () => {
 		// userEvent.click() via Playwright CDP doesn't reliably trigger Svelte 5 onclick
 		// handlers when a TipTap editor is mounted in the same component tree.
 		const btn = (await page
-			.getByRole('button', { name: /Alle als fertig markieren/ })
+			.getByRole('button', { name: m.transcription_mark_all_reviewed() })
 			.element()) as HTMLButtonElement;
 		btn.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }));
 		await vi.waitFor(() => expect(onMarkAllReviewed).toHaveBeenCalledTimes(1));
@@ -361,12 +362,83 @@ describe('TranscriptionEditView — mark all reviewed', () => {
 
 		// Same CDP click workaround: dispatch from browser JS to reliably fire Svelte 5 onclick
 		const btnEl = (await page
-			.getByRole('button', { name: /Alle als fertig markieren/ })
+			.getByRole('button', { name: m.transcription_mark_all_reviewed() })
 			.element()) as HTMLButtonElement;
 		btnEl.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }));
 		await expect
-			.element(page.getByRole('button', { name: /Alle als fertig markieren/ }))
+			.element(page.getByRole('button', { name: m.transcription_mark_all_reviewed() }))
 			.toBeDisabled();
 		resolveMarkAll();
 	});
+
+	it('shows error message when onMarkAllReviewed callback rejects', async () => {
+		const onMarkAllReviewed = vi.fn().mockRejectedValue(new Error('INTERNAL_ERROR'));
+		renderView({ blocks: [unreviewedBlock1, unreviewedBlock2], onMarkAllReviewed });
+
+		const btnEl = (await page
+			.getByRole('button', { name: m.transcription_mark_all_reviewed() })
+			.element()) as HTMLButtonElement;
+		btnEl.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }));
+
+		await expect.element(page.getByRole('alert')).toBeInTheDocument();
+		await expect
+			.element(page.getByRole('alert'))
+			.toHaveTextContent(m.transcription_mark_all_reviewed_error());
+	});
+
+	it('clears error when dismiss button is clicked', async () => {
+		const onMarkAllReviewed = vi.fn().mockRejectedValue(new Error('INTERNAL_ERROR'));
+		renderView({ blocks: [unreviewedBlock1, unreviewedBlock2], onMarkAllReviewed });
+
+		const btnEl = (await page
+			.getByRole('button', { name: m.transcription_mark_all_reviewed() })
+			.element()) as HTMLButtonElement;
+		btnEl.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }));
+		await expect.element(page.getByRole('alert')).toBeInTheDocument();
+
+		const dismissEl = (await page
+			.getByRole('button', { name: m.comp_dismiss() })
+			.element()) as HTMLButtonElement;
+		dismissEl.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }));
+
+		await expect.element(page.getByRole('alert')).not.toBeInTheDocument();
+	});
+
+	it('clears error on next successful markAllReviewed call', async () => {
+		const onMarkAllReviewed = vi
+			.fn()
+			.mockRejectedValueOnce(new Error('INTERNAL_ERROR'))
+			.mockResolvedValue(undefined);
+		renderView({ blocks: [unreviewedBlock1, unreviewedBlock2], onMarkAllReviewed });
+
+		const btnEl = (await page
+			.getByRole('button', { name: m.transcription_mark_all_reviewed() })
+			.element()) as HTMLButtonElement;
+		btnEl.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }));
+		await expect.element(page.getByRole('alert')).toBeInTheDocument();
+		// Wait for the button to be re-enabled before the second click — ensures the first
+		// async rejection has fully settled and Svelte has flushed state changes
+		await expect
+			.element(page.getByRole('button', { name: m.transcription_mark_all_reviewed() }))
+			.not.toBeDisabled();
+
+		btnEl.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }));
+
+		await expect.element(page.getByRole('alert')).not.toBeInTheDocument();
+	});
+
+	it('re-enables button after markAllReviewed failure', async () => {
+		const onMarkAllReviewed = vi.fn().mockRejectedValue(new Error('INTERNAL_ERROR'));
+		renderView({ blocks: [unreviewedBlock1, unreviewedBlock2], onMarkAllReviewed });
+
+		const btnEl = (await page
+			.getByRole('button', { name: m.transcription_mark_all_reviewed() })
+			.element()) as HTMLButtonElement;
+		btnEl.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }));
+		await expect.element(page.getByRole('alert')).toBeInTheDocument();
+
+		await expect
+			.element(page.getByRole('button', { name: m.transcription_mark_all_reviewed() }))
+			.not.toBeDisabled();
+	});
 });

frontend/src/lib/document/transcription/useBlockAutoSave.svelte.ts

@@ -1,5 +1,6 @@
 import { SvelteMap } from 'svelte/reactivity';
 import type { PersonMention } from '$lib/shared/types';
+import { withCsrf } from '$lib/shared/cookies';
 
 export type SaveState = 'idle' | 'saving' | 'saved' | 'fading' | 'error';
 
@@ -116,12 +117,15 @@ export function createBlockAutoSave({ saveFn, documentId }: Options) {
 		for (const [blockId, text] of pendingTexts) {
 			const mentions = pendingMentions.get(blockId) ?? [];
 			clearDebounce(blockId);
-			void fetch(`/api/documents/${documentId}/transcription-blocks/${blockId}`, {
-				method: 'PUT',
-				headers: { 'Content-Type': 'application/json' },
-				body: JSON.stringify({ text, mentionedPersons: mentions }),
-				keepalive: true
-			});
+			void fetch(
+				`/api/documents/${documentId}/transcription-blocks/${blockId}`,
+				withCsrf({
+					method: 'PUT',
+					headers: { 'Content-Type': 'application/json' },
+					body: JSON.stringify({ text, mentionedPersons: mentions }),
+					keepalive: true
+				})
+			);
 			pendingTexts.delete(blockId);
 			pendingMentions.delete(blockId);
 		}

frontend/src/lib/document/transcription/useTranscriptionBlocks.svelte.test.ts

@@ -259,12 +259,15 @@ describe('createTranscriptionBlocks.markAllReviewed', () => {
 		expect(ctrl.blocks.every((b) => b.reviewed)).toBe(true);
 	});
 
-	it('is a no-op when PUT returns non-OK', async () => {
+	it('throws and leaves blocks unchanged when PUT returns non-OK', async () => {
 		const fetchImpl = vi.fn(async (url: RequestInfo | URL, init?: RequestInit) => {
 			const u = url.toString();
 			const method = init?.method ?? 'GET';
 			if (u.includes('/review-all') && method === 'PUT') {
-				return new Response('', { status: 500 });
+				return new Response(JSON.stringify({ code: 'INTERNAL_ERROR' }), {
+					status: 500,
+					headers: { 'Content-Type': 'application/json' }
+				});
 			}
 			return new Response(JSON.stringify([baseBlock({ id: 'b-1', reviewed: false })]), {
 				status: 200,
@@ -274,7 +277,26 @@ describe('createTranscriptionBlocks.markAllReviewed', () => {
 
 		const ctrl = createTranscriptionBlocks({ documentId: () => 'doc-1', fetchImpl });
 		await ctrl.load();
-		await ctrl.markAllReviewed();
+		await expect(ctrl.markAllReviewed()).rejects.toThrow('INTERNAL_ERROR');
+		expect(ctrl.blocks[0].reviewed).toBe(false);
+	});
+
+	it('throws INTERNAL_ERROR when PUT returns non-JSON body (e.g. nginx 502)', async () => {
+		const fetchImpl = vi.fn(async (url: RequestInfo | URL, init?: RequestInit) => {
+			const u = url.toString();
+			const method = init?.method ?? 'GET';
+			if (u.includes('/review-all') && method === 'PUT') {
+				return new Response('Bad Gateway', { status: 502 });
+			}
+			return new Response(JSON.stringify([baseBlock({ id: 'b-1', reviewed: false })]), {
+				status: 200,
+				headers: { 'Content-Type': 'application/json' }
+			});
+		});
+
+		const ctrl = createTranscriptionBlocks({ documentId: () => 'doc-1', fetchImpl });
+		await ctrl.load();
+		await expect(ctrl.markAllReviewed()).rejects.toThrow('INTERNAL_ERROR');
 		expect(ctrl.blocks[0].reviewed).toBe(false);
 	});
 });

frontend/src/lib/document/transcription/useTranscriptionBlocks.svelte.ts

@@ -2,6 +2,7 @@
    lastEditedAt's $derived are scope-local to one computation; they're never
    stored on $state. */
 import type { TranscriptionBlockData, PersonMention } from '$lib/shared/types';
+import { makeCsrfFetch } from '$lib/shared/cookies';
 import { saveBlockWithConflictRetry } from './saveBlockWithConflictRetry';
 import { BlockConflictResolvedError } from './blockConflictMerge';
 
@@ -41,7 +42,7 @@ export function createTranscriptionBlocks(
 	options: TranscriptionBlocksOptions
 ): TranscriptionBlocksController {
 	const { documentId } = options;
-	const fetchImpl = options.fetchImpl ?? fetch;
+	const fetchImpl = makeCsrfFetch(options.fetchImpl ?? fetch);
 
 	let blocks = $state<TranscriptionBlockData[]>([]);
 	let annotationReloadKey = $state(0);
@@ -119,7 +120,11 @@ export function createTranscriptionBlocks(
 		const res = await fetchImpl(`/api/documents/${documentId()}/transcription-blocks/review-all`, {
 			method: 'PUT'
 		});
-		if (!res.ok) return;
+		if (!res.ok) {
+			const body = await res.json().catch(() => ({}));
+			// Never render body.message — route through getErrorMessage() to prevent leaking backend internals
+			throw new Error((body as { code?: string })?.code ?? 'INTERNAL_ERROR');
+		}
 		const updated = (await res.json()) as { id: string; reviewed: boolean }[];
 		for (const b of updated) {
 			const existing = blocks.find((x) => x.id === b.id);

frontend/src/lib/ocr/OcrTrainingCard.svelte

@@ -2,6 +2,7 @@
 import TrainingHistory from './TrainingHistory.svelte';
 import { m } from '$lib/paraglide/messages.js';
 import type { TrainingRun } from '$lib/ocr/training.js';
+import { withCsrf } from '$lib/shared/cookies';
 
 interface TrainingInfo {
 	availableBlocks?: number;
@@ -33,7 +34,7 @@ async function startTraining() {
 	successMessage = null;
 	errorMessage = null;
 	try {
-		const res = await fetch('/api/ocr/train', { method: 'POST' });
+		const res = await fetch('/api/ocr/train', withCsrf({ method: 'POST' }));
 		if (res.ok) {
 			successMessage = m.training_success();
 			setTimeout(() => {

frontend/src/lib/ocr/SegmentationTrainingCard.svelte

@@ -2,6 +2,7 @@
 import TrainingHistory from './TrainingHistory.svelte';
 import { m } from '$lib/paraglide/messages.js';
 import type { TrainingRun } from '$lib/ocr/training.js';
+import { withCsrf } from '$lib/shared/cookies';
 
 interface TrainingInfo {
 	availableSegBlocks?: number;
@@ -27,7 +28,7 @@ async function startTraining() {
 	training = true;
 	successMessage = null;
 	try {
-		const res = await fetch('/api/ocr/segtrain', { method: 'POST' });
+		const res = await fetch('/api/ocr/segtrain', withCsrf({ method: 'POST' }));
 		if (res.ok) {
 			successMessage = m.training_success();
 			setTimeout(() => {

frontend/src/lib/shared/cookies.ts

@@ -1,3 +1,46 @@
+/**
+ * Reads the XSRF-TOKEN cookie set by Spring Security's CookieCsrfTokenRepository.
+ * Returns null outside the browser or when the cookie is absent.
+ */
+export function getCsrfToken(): string | null {
+	if (typeof document === 'undefined') return null;
+	const match = document.cookie.match(/(?:^|;\s*)XSRF-TOKEN=([^;]+)/);
+	return match ? decodeURIComponent(match[1]) : null;
+}
+
+/**
+ * Merges the X-XSRF-TOKEN header into a RequestInit so Spring Security's
+ * CSRF filter accepts the request. Safe to call server-side (no-op when the
+ * cookie is absent).
+ */
+export function withCsrf(init?: RequestInit): RequestInit {
+	const token = getCsrfToken();
+	if (!token) return init ?? {};
+	const headers = new Headers(init?.headers);
+	headers.set('X-XSRF-TOKEN', token);
+	return { ...init, headers };
+}
+
+/**
+ * Wraps a fetch implementation so that every state-mutating call (POST, PUT,
+ * PATCH, DELETE) automatically includes the X-XSRF-TOKEN header. GET/HEAD
+ * requests pass through unchanged.
+ *
+ * Used to CSRF-protect client-side hooks that accept an injectable fetchImpl.
+ * In unit tests the injected mock is wrapped but getCsrfToken() returns null
+ * (no browser cookie), so no header is added and existing test expectations
+ * are unaffected.
+ */
+export function makeCsrfFetch(inner: typeof fetch): typeof fetch {
+	return (input: RequestInfo | URL, init?: RequestInit): Promise<Response> => {
+		const method = (init?.method ?? 'GET').toUpperCase();
+		if (['POST', 'PUT', 'PATCH', 'DELETE'].includes(method)) {
+			return inner(input, withCsrf(init));
+		}
+		return inner(input, init);
+	};
+}
+
 /**
  * Extracts the fa_session cookie value from a list of Set-Cookie response headers.
  *

infra/observability/grafana/provisioning/dashboards/loki-logs.json

@@ -196,7 +196,7 @@
       },
       "targets": [
         {
-          "expr": "{job=\"$app\"} |= \"$search\" | logfmt",
+          "expr": "{job=\"$app\"} |= \"$search\" | json",
           "hide": false,
           "legendFormat": "",
           "refId": "A"