From a91ee1f26d580bac073f598ec1d696f1ec4a420f Mon Sep 17 00:00:00 2001
From: Marcel <marcel@familienarchiv>
Date: Sat, 25 Apr 2026 19:41:24 +0200
Subject: [PATCH] refactor(documents): unify count + action links into one row

Move result count, bulk-edit button, and new-document link into a shared
flex row so they appear on the same line. Adds an edit icon to the
bulk-edit button to visually match the existing plus icon on the add link.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 frontend/src/routes/DocumentList.svelte    | 25 ---------
 frontend/src/routes/documents/+page.svelte | 64 +++++++++++++++-------
 2 files changed, 45 insertions(+), 44 deletions(-)

diff --git a/frontend/src/routes/DocumentList.svelte b/frontend/src/routes/DocumentList.svelte
index d982a46a..6ec6dd83 100644
--- a/frontend/src/routes/DocumentList.svelte
+++ b/frontend/src/routes/DocumentList.svelte
@@ -13,14 +13,12 @@ let {
 	items,
 	canWrite,
 	error,
-	total = 0,
 	q = '',
 	sort = 'DATE'
 }: {
 	items: DocumentSearchItem[];
 	canWrite: boolean;
 	error?: string | null;
-	total?: number;
 	q?: string;
 	sort?: SortMode;
 } = $props();
@@ -71,29 +69,6 @@ function groupByReceiver(docItems: DocumentSearchItem[]) {
 }
 </script>
 
-<!-- DOCUMENT LIST HEADER -->
-<div class="mb-2 flex justify-end">
-	{#if canWrite}
-		<a
-			href="/documents/new"
-			class="inline-flex items-center gap-1 text-sm font-medium text-ink-2 transition-colors hover:text-ink"
-		>
-			<img
-				src="/degruyter-icons/Simple/Medium-24px/SVG/Action/Add/Add-General-MD.svg"
-				alt=""
-				aria-hidden="true"
-				class="h-4 w-4"
-			/>
-			{m.docs_btn_new()}
-		</a>
-	{/if}
-</div>
-
-<!-- RESULT COUNT -->
-{#if total > 0}
-	<p class="mb-3 font-sans text-base text-ink-2">{m.docs_result_count({ count: total })}</p>
-{/if}
-
 <!-- ERROR -->
 {#if error}
 	<div class="border border-line bg-surface shadow-sm">
diff --git a/frontend/src/routes/documents/+page.svelte b/frontend/src/routes/documents/+page.svelte
index 40e9db49..60c0c299 100644
--- a/frontend/src/routes/documents/+page.svelte
+++ b/frontend/src/routes/documents/+page.svelte
@@ -234,28 +234,54 @@ $effect(() => {
 		onblur={() => (qFocused = false)}
 	/>
 
-	{#if data.canWrite && data.totalElements > 0}
-		<div class="mb-2 flex flex-col items-end gap-1">
-			<button
-				type="button"
-				onclick={editAllMatching}
-				disabled={editingAll}
-				class="inline-flex items-center gap-1 text-sm font-medium text-ink-2 transition-colors hover:text-ink disabled:opacity-50"
-				data-testid="bulk-edit-all-x"
-			>
-				{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}
+	<div class="mb-3 flex items-center justify-between gap-4">
+		<p class="font-sans text-base text-ink-2">
+			{#if data.totalElements > 0}{m.docs_result_count({ count: data.totalElements })}{/if}
+		</p>
+		{#if data.canWrite}
+			<div class="flex flex-col items-end gap-1">
+				<div class="flex items-center gap-4">
+					{#if data.totalElements > 0}
+						<button
+							type="button"
+							onclick={editAllMatching}
+							disabled={editingAll}
+							class="inline-flex cursor-pointer items-center gap-1 text-sm font-medium text-ink-2 transition-colors hover:text-ink disabled:opacity-50"
+							data-testid="bulk-edit-all-x"
+						>
+							<img
+								src="/degruyter-icons/Simple/Medium-24px/SVG/Action/Edit-Content-MD.svg"
+								alt=""
+								aria-hidden="true"
+								class="h-4 w-4"
+							/>
+							{m.bulk_edit_all_x({ count: data.totalElements })}
+						</button>
+					{/if}
+					<a
+						href="/documents/new"
+						class="inline-flex items-center gap-1 text-sm font-medium text-ink-2 transition-colors hover:text-ink"
+					>
+						<img
+							src="/degruyter-icons/Simple/Medium-24px/SVG/Action/Add/Add-General-MD.svg"
+							alt=""
+							aria-hidden="true"
+							class="h-4 w-4"
+						/>
+						{m.docs_btn_new()}
+					</a>
+				</div>
+				{#if editAllError}
+					<p role="alert" class="text-xs text-danger" data-testid="bulk-edit-all-x-error">
+						{editAllError}
+					</p>
+				{/if}
+			</div>
+		{/if}
+	</div>
 
 	<DocumentList
 		items={data.items}
-		total={data.totalElements}
 		q={data.q}
 		canWrite={data.canWrite}
 		error={data.error}