From f33c3c8b29fb2885dcc040edd88db56e20eca02c Mon Sep 17 00:00:00 2001
From: Michael Chihlas <michael@chihlas.com>
Date: Tue, 3 Feb 2026 23:59:16 -0500
Subject: [PATCH] fix: Swap folder tree count with menu button on hover

The tree count and hamburger menu were overlapping at the right edge of
folder items. Now the count hides on hover and the menu button appears
in its place.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
---
 frontend/src/components/library/FolderSidebar.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/frontend/src/components/library/FolderSidebar.tsx b/frontend/src/components/library/FolderSidebar.tsx
index 8f99b2d3..41397f04 100644
--- a/frontend/src/components/library/FolderSidebar.tsx
+++ b/frontend/src/components/library/FolderSidebar.tsx
@@ -136,10 +136,10 @@ function FolderItem({
           )}
           <Folder className="h-4 w-4 shrink-0" style={{ color: folder.color }} />
           <span className="flex-1 truncate text-left">{folder.name}</span>
-          <span className="text-xs text-muted-foreground">{folder.tree_count}</span>
+          <span className="text-xs text-muted-foreground group-hover:hidden">{folder.tree_count}</span>
         </button>
 
-        {/* Folder menu button */}
+        {/* Folder menu button - replaces tree count on hover */}
         <button
           onClick={(e) => {
             e.stopPropagation()
@@ -147,7 +147,7 @@ function FolderItem({
           }}
           className={cn(
             'absolute right-1 top-1/2 -translate-y-1/2 rounded p-1',
-            'opacity-0 group-hover:opacity-100',
+            'hidden group-hover:block',
             'hover:bg-accent'
           )}
         >