From 88f43b22c791cc41693b25d0a3c4bea4269e0d8e Mon Sep 17 00:00:00 2001
From: Youwes09 <yuvi.shen@outlook.com>
Date: Sun, 14 Jun 2026 21:12:52 -0500
Subject: [PATCH] Fix: FolderSettings Count Display & Debounce on
 LibraryToolbar (WIP)

---
 src/lib/components/library/LibraryToolbar.svelte            | 2 ++
 src/lib/components/settings/sections/FoldersSettings.svelte | 5 +++--
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/lib/components/library/LibraryToolbar.svelte b/src/lib/components/library/LibraryToolbar.svelte
index 1e382ae..d88af21 100644
--- a/src/lib/components/library/LibraryToolbar.svelte
+++ b/src/lib/components/library/LibraryToolbar.svelte
@@ -66,7 +66,9 @@
   let wheelTimer: ReturnType<typeof setTimeout> | null = null
 
   function onTabsWheel(e: WheelEvent) {
+    if (Math.abs(e.deltaY) <= Math.abs(e.deltaX)) return
     e.preventDefault()
+    tabsEl?.scrollBy({ left: e.deltaY * 0.5, behavior: "instant" })
     if (wheelTimer) return
     wheelTimer = setTimeout(() => { wheelTimer = null }, 180)
     const ids = visibleTabIds.filter(id => id === "library" || id === "downloaded" || visibleCategories.some(c => String(c.id) === id));
diff --git a/src/lib/components/settings/sections/FoldersSettings.svelte b/src/lib/components/settings/sections/FoldersSettings.svelte
index dc6ecda..d3ff79b 100644
--- a/src/lib/components/settings/sections/FoldersSettings.svelte
+++ b/src/lib/components/settings/sections/FoldersSettings.svelte
@@ -2,6 +2,7 @@
   import { FolderSimple, Plus, Trash, Star, Eye, EyeSlash, ArrowsClockwise, ArrowsCounterClockwise, DownloadSimple, DotsSixVertical, BookmarkSimple, Lock, CheckSquare } from 'phosphor-svelte'
   import { getAdapter } from '$lib/request-manager'
   import { settingsState, updateSettings } from '$lib/state/settings.svelte'
+  import { libraryState } from '$lib/state/library.svelte'
   import type { Category } from '$lib/types'
 
   let categories    = $state<Category[]>([])
@@ -206,7 +207,7 @@
                     <DotsSixVertical size={14} weight="bold" />
                   </span>
                   <span class="s-folder-name">{cat?.name ?? 'Completed'}</span>
-                  <span class="s-folder-count">{cat?.mangas?.length ?? 0} manga</span>
+                  <span class="s-folder-count">{libraryState.counts[String(cat?.id)] ?? 0} manga</span>
                   <span class="s-folder-badge">built-in</span>
                   <div class="s-folder-actions">
                     <button class="s-btn-icon" class:muted={hidden} onclick={() => toggleHidden(id)} title={hidden ? 'Show tab in library' : 'Hide tab from library'}>
@@ -246,7 +247,7 @@
                       </span>
                       <button class="s-folder-name" onclick={(e) => { e.stopPropagation(); startEdit(cat.id, cat.name) }} title="Click to rename">{cat.name}</button>
                     </div>
-                    <span class="s-folder-count">{cat.mangas?.length ?? 0} manga</span>
+                    <span class="s-folder-count">{libraryState.counts[String(cat.id)] ?? 0} manga</span>
                     <div class="s-folder-actions">
                       <button class="s-btn-icon"
                         class:active={(settingsState.settings.defaultLibraryCategoryId ?? null) === cat.id}