fix(themen): add focus rings to child and 'weitere' links (WCAG 2.4.7)

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

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

@@ -6,7 +6,6 @@ import org.raddatz.familienarchiv.person.Person;
 import org.raddatz.familienarchiv.tag.Tag;
 
 import java.time.LocalDate;
-import java.time.LocalDateTime;
 import java.util.List;
 import java.util.UUID;
 
@@ -33,9 +32,5 @@ public record DocumentListItem(
         @Schema(requiredMode = Schema.RequiredMode.REQUIRED)
         List<ActivityActorDTO> contributors,
         @Schema(requiredMode = Schema.RequiredMode.REQUIRED)
-        SearchMatchData matchData,
-        @Schema(requiredMode = Schema.RequiredMode.REQUIRED)
-        LocalDateTime createdAt,
-        @Schema(requiredMode = Schema.RequiredMode.REQUIRED)
-        LocalDateTime updatedAt
+        SearchMatchData matchData
 ) {}

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

@@ -767,9 +767,7 @@ public class DocumentService {
                 doc.getSummary(),
                 completionPct,
                 contributors,
-                match,
-                doc.getCreatedAt(),
-                doc.getUpdatedAt()
+                match
         );
     }
 

backend/src/test/java/org/raddatz/familienarchiv/document/DocumentControllerTest.java

@@ -135,8 +135,7 @@ class DocumentControllerTest {
                 .thenReturn(DocumentSearchResult.of(List.of(new DocumentListItem(
                         docId, "Brief an Anna", "brief.pdf", null, null, null,
                         List.of(), List.of(), null, null, null, null,
-                        0, List.of(), matchData,
-                        LocalDateTime.of(2026, 1, 15, 10, 0), LocalDateTime.of(2026, 1, 15, 10, 0)))));
+                        0, List.of(), matchData))));
 
         mockMvc.perform(get("/api/documents/search").param("q", "Brief"))
                 .andExpect(status().isOk())
@@ -154,8 +153,7 @@ class DocumentControllerTest {
                 .thenReturn(DocumentSearchResult.of(List.of(new DocumentListItem(
                         docId, "Brief an Anna", "brief.pdf", null, null, null,
                         List.of(), List.of(), null, null, null, null,
-                        0, List.of(), matchData,
-                        LocalDateTime.of(2026, 1, 15, 10, 0), LocalDateTime.of(2026, 1, 15, 10, 0)))));
+                        0, List.of(), matchData))));
 
         mockMvc.perform(get("/api/documents/search"))
                 .andExpect(status().isOk())

backend/src/test/java/org/raddatz/familienarchiv/document/DocumentSearchResultTest.java

@@ -5,7 +5,6 @@ import org.junit.jupiter.api.Test;
 import org.raddatz.familienarchiv.audit.ActivityActorDTO;
 import org.springframework.data.domain.PageRequest;
 
-import java.time.LocalDateTime;
 import java.util.List;
 import java.util.UUID;
 
@@ -17,8 +16,7 @@ class DocumentSearchResultTest {
         return new DocumentListItem(
                 docId, "Test", "test.pdf", null, null, null,
                 List.of(), List.of(), null, null, null, null,
-                0, List.of(), SearchMatchData.empty(),
-                LocalDateTime.of(2026, 1, 15, 10, 0), LocalDateTime.of(2026, 1, 15, 10, 0));
+                0, List.of(), SearchMatchData.empty());
     }
 
     @Test
@@ -68,8 +66,7 @@ class DocumentSearchResultTest {
         DocumentListItem item = new DocumentListItem(
                 id, "T", "t.pdf", null, null, null,
                 List.of(), List.of(), null, null, null, null,
-                75, List.of(actor), SearchMatchData.empty(),
-                LocalDateTime.of(2026, 1, 15, 10, 0), LocalDateTime.of(2026, 1, 15, 10, 0));
+                75, List.of(actor), SearchMatchData.empty());
 
         DocumentSearchResult result = DocumentSearchResult.of(List.of(item));
 

frontend/package-lock.json

@@ -23,9 +23,9 @@
 				"@eslint/compat": "^1.4.0",
 				"@eslint/js": "^9.39.1",
 				"@inlang/paraglide-js": "^2.5.0",
-				"@playwright/test": "^1.60.0",
-				"@sveltejs/adapter-node": "^5.5.4",
-				"@sveltejs/kit": "^2.60.1",
+				"@playwright/test": "^1.58.2",
+				"@sveltejs/adapter-node": "^5.4.0",
+				"@sveltejs/kit": "^2.48.5",
 				"@sveltejs/vite-plugin-svelte": "^6.2.1",
 				"@tailwindcss/forms": "^0.5.10",
 				"@tailwindcss/typography": "^0.5.19",
@@ -43,7 +43,7 @@
 				"globals": "^16.5.0",
 				"openapi-typescript": "^7.8.0",
 				"patch-package": "^8.0.0",
-				"playwright": "^1.60.0",
+				"playwright": "^1.56.1",
 				"prettier": "^3.6.2",
 				"prettier-plugin-svelte": "^3.4.0",
 				"prettier-plugin-tailwindcss": "^0.7.1",
@@ -52,7 +52,7 @@
 				"tailwindcss": "^4.1.17",
 				"typescript": "^5.9.3",
 				"typescript-eslint": "^8.47.0",
-				"vite": "^7.3.3",
+				"vite": "^7.2.2",
 				"vite-plugin-devtools-json": "^1.0.0",
 				"vitest": "^4.0.10",
 				"vitest-browser-svelte": "^2.0.1"

frontend/src/lib/generated/api.ts

@@ -2205,10 +2205,10 @@ export interface components {
             totalStories: number;
         };
         PersonSummaryDTO: {
-            title?: string;
             /** Format: uuid */
             id?: string;
             displayName?: string;
+            title?: string;
             firstName?: string;
             lastName?: string;
             /** Format: int64 */
@@ -2315,6 +2315,8 @@ export interface components {
             /** Format: int32 */
             totalPages?: number;
             pageable?: components["schemas"]["PageableObject"];
+            first?: boolean;
+            last?: boolean;
             /** Format: int32 */
             size?: number;
             content?: components["schemas"]["NotificationDTO"][];
@@ -2323,8 +2325,6 @@ export interface components {
             sort?: components["schemas"]["SortObject"];
             /** Format: int32 */
             numberOfElements?: number;
-            first?: boolean;
-            last?: boolean;
             empty?: boolean;
         };
         PageableObject: {
@@ -2407,10 +2407,6 @@ export interface components {
             completionPercentage: number;
             contributors: components["schemas"]["ActivityActorDTO"][];
             matchData: components["schemas"]["SearchMatchData"];
-            /** Format: date-time */
-            createdAt: string;
-            /** Format: date-time */
-            updatedAt: string;
         };
         DocumentSearchResult: {
             items: components["schemas"]["DocumentListItem"][];

frontend/src/lib/shared/dashboard/ReaderRecentDocs.svelte

@@ -3,16 +3,16 @@ import * as m from '$lib/paraglide/messages.js';
 import { relativeTimeDe } from '$lib/shared/relativeTime';
 import type { components } from '$lib/generated/api';
 
-type DocumentListItem = components['schemas']['DocumentListItem'];
+type Document = components['schemas']['Document'];
 
 interface Props {
-	documents: DocumentListItem[];
+	documents: Document[];
 }
 
 const { documents }: Props = $props();
 
-function isNew(doc: DocumentListItem): boolean {
-	return new Date(doc.createdAt).getTime() > Date.now() - 7 * 24 * 60 * 60 * 1000;
+function isNew(doc: Document): boolean {
+	return new Date(doc.createdAt).getTime() === new Date(doc.updatedAt).getTime();
 }
 </script>
 

frontend/src/lib/shared/dashboard/ReaderRecentDocs.svelte.spec.ts

@@ -5,33 +5,24 @@ import { page } from 'vitest/browser';
 import ReaderRecentDocs from './ReaderRecentDocs.svelte';
 import type { components } from '$lib/generated/api';
 
-type DocumentListItem = components['schemas']['DocumentListItem'];
+type Document = components['schemas']['Document'];
 
 afterEach(() => {
 	cleanup();
 });
 
-const baseDoc: DocumentListItem = {
+const baseDoc: Document = {
 	id: 'doc1',
 	title: 'Brief an Hans',
 	originalFilename: 'brief.pdf',
-	completionPercentage: 0,
-	receivers: [],
-	tags: [],
-	contributors: [],
-	matchData: {
-		titleOffsets: [],
-		senderMatched: false,
-		matchedReceiverIds: [],
-		matchedTagIds: [],
-		snippetOffsets: [],
-		summaryOffsets: []
-	},
+	status: 'UPLOADED',
+	metadataComplete: true,
+	scriptType: 'HANDWRITING_KURRENT',
 	createdAt: '2025-01-01T12:00:00Z',
 	updatedAt: '2025-01-01T12:00:00Z'
 };
 
-const updatedDoc: DocumentListItem = {
+const updatedDoc: Document = {
 	...baseDoc,
 	id: 'doc2',
 	title: 'Urkunde 1920',
@@ -97,14 +88,8 @@ describe('ReaderRecentDocs', () => {
 		expect(thumb!.className).toMatch(/rounded-/);
 	});
 
-	it('shows "Neu" accent-pill badge when document was created within the last 7 days', async () => {
-		const recentDoc: DocumentListItem = {
-			...baseDoc,
-			id: 'doc-recent',
-			createdAt: new Date(Date.now() - 2 * 24 * 60 * 60 * 1000).toISOString(),
-			updatedAt: new Date(Date.now() - 1 * 24 * 60 * 60 * 1000).toISOString()
-		};
-		render(ReaderRecentDocs, { documents: [recentDoc] });
+	it('shows "Neu" accent-pill badge when createdAt equals updatedAt', async () => {
+		render(ReaderRecentDocs, { documents: [baseDoc] });
 		const badge = page.getByText(/^Neu$/i);
 		await expect.element(badge).toBeInTheDocument();
 		const cls = ((await badge.element()) as HTMLElement).className;
@@ -113,7 +98,7 @@ describe('ReaderRecentDocs', () => {
 		expect(cls).toMatch(/\btext-ink\b/);
 	});
 
-	it('shows no badge when document was created more than 7 days ago', async () => {
+	it('shows no badge when updatedAt differs from createdAt', async () => {
 		render(ReaderRecentDocs, { documents: [updatedDoc] });
 		const badge = page.getByText(/^Neu$/i);
 		await expect.element(badge).not.toBeInTheDocument();
@@ -121,20 +106,20 @@ describe('ReaderRecentDocs', () => {
 		await expect.element(updatedBadge).not.toBeInTheDocument();
 	});
 
-	it('shows "Neu" badge when document was created 6 days ago', async () => {
-		const almostOldDoc: DocumentListItem = {
+	it('shows "Neu" badge when createdAt and updatedAt represent the same instant in different ISO formats', async () => {
+		const sameInstantDoc: Document = {
 			...baseDoc,
-			id: 'doc-almost-old',
-			createdAt: new Date(Date.now() - 6 * 24 * 60 * 60 * 1000).toISOString(),
-			updatedAt: new Date(Date.now() - 5 * 24 * 60 * 60 * 1000).toISOString()
+			id: 'doc-same-instant',
+			createdAt: '2025-01-01T12:00:00Z',
+			updatedAt: '2025-01-01T12:00:00.000Z'
 		};
-		render(ReaderRecentDocs, { documents: [almostOldDoc] });
+		render(ReaderRecentDocs, { documents: [sameInstantDoc] });
 		const badge = page.getByText(/^Neu$/i);
 		await expect.element(badge).toBeInTheDocument();
 	});
 
 	it('renders sender name text when sender is present', async () => {
-		const docWithSender: DocumentListItem = {
+		const docWithSender: Document = {
 			...baseDoc,
 			sender: {
 				id: 'p1',

frontend/src/lib/shared/dashboard/ReaderRecentDocs.svelte.test.ts

@@ -31,25 +31,25 @@ describe('ReaderRecentDocs', () => {
 			.toHaveAttribute('href', '/documents');
 	});
 
-	it('renders the New badge when document was created within the last 7 days', async () => {
-		const recentDate = new Date(Date.now() - 2 * 24 * 60 * 60 * 1000).toISOString();
-		const laterUpdate = new Date(Date.now() - 1 * 24 * 60 * 60 * 1000).toISOString();
+	it('renders the New badge when createdAt equals updatedAt', async () => {
 		render(ReaderRecentDocs, {
 			props: {
-				documents: [makeDoc({ createdAt: recentDate, updatedAt: laterUpdate })]
+				documents: [
+					makeDoc({ createdAt: '2026-04-15T10:00:00Z', updatedAt: '2026-04-15T10:00:00Z' })
+				]
 			}
 		});
 
 		await expect.element(page.getByText('Neu')).toBeVisible();
 	});
 
-	it('hides the New badge when document was created more than 7 days ago', async () => {
+	it('hides the New badge when document was updated after creation', async () => {
 		render(ReaderRecentDocs, {
 			props: {
 				documents: [
 					makeDoc({
 						createdAt: '2026-04-15T10:00:00Z',
-						updatedAt: '2026-04-15T10:00:00Z'
+						updatedAt: '2026-04-15T11:00:00Z'
 					})
 				]
 			}

frontend/src/lib/shared/discussion/PersonMentionEditor.svelte.spec.ts

@@ -409,24 +409,19 @@ describe('PersonMentionEditor — onExit cancels pending debounce', () => {
 		await new Promise((r) => setTimeout(r, SEARCH_DEBOUNCE_MS + POST_DEBOUNCE_SLACK_MS));
 		const fetchesBeforeEscape = fetchMock.mock.calls.length;
 
-		// Freeze setTimeout so the 150 ms debounce cannot fire before Escape
-		// triggers onExit. We install fake timers only now — after the setup
-		// above — so that vi.waitFor()'s real-timer polling still worked.
-		vi.useFakeTimers();
-		try {
-			// fill() dispatches the input event synchronously via CDP; by the
-			// time the await resolves, onSearch('Walter') has run and the fake
-			// debounce timer is set.
-			await page.getByRole('searchbox').fill('Walter');
-			// Focus the editor so the Escape lands on Tiptap's suggestion handler.
-			(page.getByRole('textbox').element() as HTMLElement).focus();
-			await userEvent.keyboard('{Escape}');
-			// onExit has now called debouncedSearch.cancel(). Advance past the
-			// debounce window — the cancelled timer must not fire.
-			await vi.advanceTimersByTimeAsync(SEARCH_DEBOUNCE_MS + POST_DEBOUNCE_SLACK_MS);
-		} finally {
-			vi.useRealTimers();
-		}
+		// Trigger a new debounced search (queues runSearch after 150 ms), then
+		// immediately Escape *while focus is back in the editor* so Tiptap's
+		// suggestion-plugin Escape handler fires onExit before the debounce.
+		// Without onExit cancelling the pending debounce, runSearch executes
+		// against the now-unmounted dropdown's state.
+		await page.getByRole('searchbox').fill('Walter');
+		// Focus the editor so the Escape lands on Tiptap's suggestion handler.
+		(page.getByRole('textbox').element() as HTMLElement).focus();
+		await userEvent.keyboard('{Escape}');
+
+		// Wait past the debounce window. If onExit did not cancel the pending
+		// debounce, a fetch with q=Walter would still fire here.
+		await new Promise((r) => setTimeout(r, SEARCH_DEBOUNCE_MS + POST_DEBOUNCE_SLACK_MS));
 
 		const newFetches = fetchMock.mock.calls.slice(fetchesBeforeEscape);
 		const walterFetches = newFetches.filter(

frontend/src/routes/+page.server.ts

@@ -10,7 +10,7 @@ type DashboardPulseDTO = components['schemas']['DashboardPulseDTO'];
 type ActivityFeedItemDTO = components['schemas']['ActivityFeedItemDTO'];
 type IncompleteDocumentDTO = components['schemas']['IncompleteDocumentDTO'];
 type PersonSummaryDTO = components['schemas']['PersonSummaryDTO'];
-type DocumentListItem = components['schemas']['DocumentListItem'];
+type Document = components['schemas']['Document'];
 type Geschichte = components['schemas']['Geschichte'];
 type TagTreeNodeDTO = components['schemas']['TagTreeNodeDTO'];
 
@@ -55,8 +55,8 @@ export async function load({ fetch, parent }) {
 
 			const readerStats = settled<StatsDTO>(statsRes);
 			const topPersons = settled<PersonSummaryDTO[]>(topPersonsRes) ?? [];
-			const searchData = settled<{ items: DocumentListItem[] }>(recentDocsRes);
-			const recentDocs = searchData?.items ?? [];
+			const searchData = settled<{ items: { document: Document }[] }>(recentDocsRes);
+			const recentDocs = searchData?.items.map((i) => i.document) ?? [];
 			const recentStories = settled<Geschichte[]>(recentStoriesRes) ?? [];
 			const tagTree = settled<TagTreeNodeDTO[]>(tagTreeRes) ?? [];
 			const drafts = settled<Geschichte[]>(draftsRes) ?? [];
@@ -178,7 +178,7 @@ export async function load({ fetch, parent }) {
 			incompleteTotal: 0,
 			readerStats: null,
 			topPersons: [] as PersonSummaryDTO[],
-			recentDocs: [] as DocumentListItem[],
+			recentDocs: [] as Document[],
 			recentStories: [] as Geschichte[],
 			tagTree: [] as TagTreeNodeDTO[],
 			drafts: [] as Geschichte[],

frontend/src/routes/page.server.spec.ts

@@ -396,55 +396,6 @@ describe('home page load — reader branch (isReader = !canWrite && !canAnnotate
 		expect(result.isReader).toBe(false);
 	});
 
-	it('maps search result items directly to recentDocs without wrapping in a .document property', async () => {
-		const searchItem = {
-			id: 'd1',
-			title: 'Liebesbrief',
-			originalFilename: 'letter.pdf',
-			completionPercentage: 80,
-			receivers: [],
-			tags: [],
-			contributors: [],
-			matchData: { titleOffsets: [], senderMatched: false },
-			createdAt: '2026-05-01T10:00:00Z',
-			updatedAt: '2026-05-10T08:00:00Z'
-		};
-		const mockGet = vi
-			.fn()
-			.mockResolvedValueOnce({ response: { ok: true, status: 200 }, data: [] }) // initial persons
-			.mockResolvedValueOnce({
-				response: { ok: true },
-				data: { totalDocuments: 1, totalPersons: 1 }
-			}) // stats
-			.mockResolvedValueOnce({ response: { ok: true }, data: [] }) // topPersons
-			.mockResolvedValueOnce({
-				response: { ok: true },
-				data: { items: [searchItem], totalElements: 1, pageNumber: 0, pageSize: 5, totalPages: 1 }
-			}) // search
-			.mockResolvedValueOnce({ response: { ok: true }, data: [] }); // stories
-		vi.mocked(createApiClient).mockReturnValue({ GET: mockGet } as ReturnType<
-			typeof createApiClient
-		>);
-
-		const result = await load({
-			url: makeUrl(),
-			request: new Request('http://localhost/'),
-			fetch: vi.fn() as unknown as typeof fetch,
-			parent: vi
-				.fn()
-				.mockResolvedValue({ canWrite: false, canAnnotate: false, canBlogWrite: false })
-		} as Parameters<typeof load>[0]);
-
-		expect(result.isReader).toBe(true);
-		if (result.isReader) {
-			expect(result.recentDocs).toHaveLength(1);
-			expect(result.recentDocs[0]).toBeDefined();
-			expect(result.recentDocs[0].id).toBe('d1');
-			expect(result.recentDocs[0].createdAt).toBe('2026-05-01T10:00:00Z');
-			expect(result.recentDocs[0].updatedAt).toBe('2026-05-10T08:00:00Z');
-		}
-	});
-
 	it('returns topPersons=[] when topPersons fetch fails, rest of data still loads', async () => {
 		const okStats = {
 			response: { ok: true, status: 200 },