From 4fb98e4a1eb8bf7026b16590c9e52cfe54d6366b Mon Sep 17 00:00:00 2001
From: MechaCat02 <MechaCat02@example.com>
Date: Thu, 25 Jun 2026 21:51:05 +0200
Subject: [PATCH] refactor(history): reuse IconButton; drop redundant emptyText
 overrides
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The HistoryList clear button hand-rolled the same `.icon-btn danger`
styles that were extracted into the shared IconButton component one
commit earlier — the exact duplication that refactor targeted. Swap it
for <IconButton variant="danger">; data-testid/aria pass through the
component's {...rest} spread so behaviour is unchanged.

Both callers also passed an emptyText equal to the prop's default; drop
the overrides so the default lives in one place.

No behaviour change, so no version bump.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
---
 .../src/lib/components/HistoryList.svelte     | 27 +++----------------
 frontend/src/routes/library/+page.svelte      |  7 +----
 .../src/routes/profile/history/+page.svelte   |  7 +----
 3 files changed, 6 insertions(+), 35 deletions(-)

diff --git a/frontend/src/lib/components/HistoryList.svelte b/frontend/src/lib/components/HistoryList.svelte
index e9b987e..f975b29 100644
--- a/frontend/src/lib/components/HistoryList.svelte
+++ b/frontend/src/lib/components/HistoryList.svelte
@@ -2,6 +2,7 @@
     import { fileUrl } from '$lib/api/client';
     import { chapterLabel } from '$lib/api/chapters';
     import type { ReadProgressSummary } from '$lib/api/read_progress';
+    import IconButton from '$lib/components/IconButton.svelte';
     import BookImage from '@lucide/svelte/icons/book-image';
     import Trash2 from '@lucide/svelte/icons/trash-2';
 
@@ -112,16 +113,15 @@
                     <span class="when">Read {formatDate(p.updated_at)}</span>
                 </div>
                 {#if onClear}
-                    <button
-                        type="button"
-                        class="icon-btn danger"
+                    <IconButton
+                        variant="danger"
                         onclick={() => clear(p)}
                         aria-label={`Clear ${p.manga_title} from history`}
                         title="Clear from history"
                         data-testid="{testid}-clear-{p.manga_id}"
                     >
                         <Trash2 size={16} aria-hidden="true" />
-                    </button>
+                    </IconButton>
                 {/if}
             </li>
         {/each}
@@ -208,23 +208,4 @@
         padding: var(--space-2) var(--space-3);
         margin: 0 0 var(--space-2);
     }
-
-    .icon-btn {
-        display: inline-flex;
-        align-items: center;
-        justify-content: center;
-        width: 32px;
-        height: 32px;
-        padding: 0;
-        background: transparent;
-        color: var(--text-muted);
-        border: 1px solid transparent;
-        border-radius: var(--radius-sm);
-        cursor: pointer;
-    }
-
-    .icon-btn.danger:hover {
-        color: var(--danger);
-        background: var(--surface-elevated);
-    }
 </style>
diff --git a/frontend/src/routes/library/+page.svelte b/frontend/src/routes/library/+page.svelte
index 09af536..5d26e0d 100644
--- a/frontend/src/routes/library/+page.svelte
+++ b/frontend/src/routes/library/+page.svelte
@@ -95,12 +95,7 @@
         initialDistinct={data.distinctPageTags}
     />
 {:else}
-    <HistoryList
-        entries={data.history}
-        onClear={clearOne}
-        emptyText="Nothing here yet — open any manga and a row will land here once you turn a page."
-        testid="library-history"
-    />
+    <HistoryList entries={data.history} onClear={clearOne} testid="library-history" />
 {/if}
 
 <style>
diff --git a/frontend/src/routes/profile/history/+page.svelte b/frontend/src/routes/profile/history/+page.svelte
index 247ffe4..0e2195d 100644
--- a/frontend/src/routes/profile/history/+page.svelte
+++ b/frontend/src/routes/profile/history/+page.svelte
@@ -33,12 +33,7 @@
             <Eye size={18} aria-hidden="true" />
             <span>Reading history</span>
         </h2>
-        <HistoryList
-            entries={data.progress}
-            onClear={clearOne}
-            emptyText="Nothing here yet — open any manga and a row will land here once you turn a page."
-            testid="history-reading"
-        />
+        <HistoryList entries={data.progress} onClear={clearOne} testid="history-reading" />
     </section>
 
     <section aria-labelledby="uploads-heading" class="uploads-section">