From 314af375d569bc01ef6c5c41ec4286bc0429cb97 Mon Sep 17 00:00:00 2001
From: Admin <admin@kalekber.cc>
Date: Fri, 6 Mar 2026 20:34:53 +0500
Subject: [PATCH] Remove chapter date from chapter page; show 50 chapters per
 page on mobile, 100 on desktop

---
 ui/src/routes/books/[slug]/+page.svelte       | 20 +++++++++++++------
 .../books/[slug]/chapters/[n]/+page.svelte    |  4 +---
 2 files changed, 15 insertions(+), 9 deletions(-)

diff --git a/ui/src/routes/books/[slug]/+page.svelte b/ui/src/routes/books/[slug]/+page.svelte
index 09bd267..0fdb006 100644
--- a/ui/src/routes/books/[slug]/+page.svelte
+++ b/ui/src/routes/books/[slug]/+page.svelte
@@ -32,15 +32,23 @@
 
 	const genres = $derived(parseGenres(data.book.genres));
 
-	// Paginate chapter list — show 100 at a time
-	const PAGE_SIZE = 100;
+	// Paginate chapter list — 50 on mobile, 100 on sm+ (≥640px)
+	let pageSize = $state(50);
+
+	onMount(() => {
+		const mq = window.matchMedia('(min-width: 640px)');
+		pageSize = mq.matches ? 100 : 50;
+		const handler = (e: MediaQueryListEvent) => { pageSize = e.matches ? 100 : 50; };
+		mq.addEventListener('change', handler);
+		return () => mq.removeEventListener('change', handler);
+	});
 
 	// Start on the page that contains the current chapter (if any)
 	function pageForChapter(chapterNum: number | null, list: typeof chapterList): number {
 		if (!chapterNum || list.length === 0) return 0;
 		const idx = list.findIndex((c) => c.number === chapterNum);
 		if (idx === -1) return 0;
-		return Math.floor(idx / PAGE_SIZE);
+		return Math.floor(idx / pageSize);
 	}
 
 	let page = $state(pageForChapter(data.lastChapter, data.inLib ? data.chapters : (data.previewChapters ?? [])));
@@ -51,9 +59,9 @@
 			? data.chapters
 			: (data.previewChapters ?? [])
 	);
-	const totalPages = $derived(Math.ceil(chapterList.length / PAGE_SIZE));
+	const totalPages = $derived(Math.ceil(chapterList.length / pageSize));
 	const visibleChapters = $derived(
-		chapterList.slice(page * PAGE_SIZE, (page + 1) * PAGE_SIZE)
+		chapterList.slice(page * pageSize, (page + 1) * pageSize)
 	);
 
 	// ── Chapter list polling ──────────────────────────────────────────────────
@@ -354,7 +362,7 @@
 					&larr;
 				</button>
 				<span class="text-zinc-500 text-xs tabular-nums">
-					{page * PAGE_SIZE + 1}–{Math.min((page + 1) * PAGE_SIZE, chapterList.length)} of {chapterList.length}
+					{page * pageSize + 1}–{Math.min((page + 1) * pageSize, chapterList.length)} of {chapterList.length}
 				</span>
 				<button
 					onclick={() => (page = Math.min(totalPages - 1, page + 1))}
diff --git a/ui/src/routes/books/[slug]/chapters/[n]/+page.svelte b/ui/src/routes/books/[slug]/chapters/[n]/+page.svelte
index 9935232..e28c1f5 100644
--- a/ui/src/routes/books/[slug]/chapters/[n]/+page.svelte
+++ b/ui/src/routes/books/[slug]/chapters/[n]/+page.svelte
@@ -89,9 +89,7 @@
 	<h1 class="text-xl font-bold text-zinc-100">
 		{data.chapter.title || `Chapter ${data.chapter.number}`}
 	</h1>
-	{#if data.chapter.date_label}
-		<p class="text-zinc-600 text-xs mt-1">{data.chapter.date_label}</p>
-	{/if}
+
 </div>
 
 <!-- Audio player -->