From f22605ccf0f52c9f891c616b631ae912e7b83ddb Mon Sep 17 00:00:00 2001
From: darknight0847 <dev4447f@gmail.com>
Date: Sun, 7 Dec 2025 00:40:28 +0530
Subject: [PATCH] add hover expand & auto collapse(#231)

---
 apps/web/src/components/dashboard/Sidebar.tsx | 33 ++++++++++++-------
 1 file changed, 21 insertions(+), 12 deletions(-)

diff --git a/apps/web/src/components/dashboard/Sidebar.tsx b/apps/web/src/components/dashboard/Sidebar.tsx
index d27c636e..a897de8b 100644
--- a/apps/web/src/components/dashboard/Sidebar.tsx
+++ b/apps/web/src/components/dashboard/Sidebar.tsx
@@ -110,18 +110,27 @@ export default function Sidebar({ overlay = false }: { overlay?: boolean }) {
   const mobileWidth = desktopWidth;
 
   return (
-    <motion.div
-      className={`h-screen flex flex-col bg-dash-surface border-r border-dash-border z-50 ${
-        overlay ? "fixed left-0 top-0 bottom-0 xl:hidden" : ""
-      }`}
-      initial={
-        overlay ? { x: -400, width: mobileWidth } : { width: desktopWidth }
-      }
-      animate={overlay ? { x: 0, width: mobileWidth } : { width: desktopWidth }}
-      exit={overlay ? { x: -400, width: mobileWidth } : undefined}
-      transition={{ type: "spring", stiffness: 260, damping: 30 }}
-      style={{ width: overlay ? mobileWidth : desktopWidth }}
-    >
+  <motion.div
+    className={`h-screen flex flex-col bg-dash-surface border-r border-dash-border z-50 ${
+      overlay ? "fixed left-0 top-0 bottom-0 xl:hidden" : ""
+    }`}
+    initial={
+      overlay ? { x: -400, width: mobileWidth } : { width: desktopWidth }
+    }
+    animate={overlay ? { x: 0, width: mobileWidth } : { width: desktopWidth }}
+    exit={overlay ? { x: -400, width: mobileWidth } : undefined}
+    transition={{ type: "spring", stiffness: 260, damping: 30 }}
+    style={{ width: overlay ? mobileWidth : desktopWidth }}
+    
+    //hover logic
+    onMouseEnter={() => {
+      if (!overlay && isCollapsed) toggleCollapsed();
+    }}
+    onMouseLeave={() => {
+      if (!overlay && !isCollapsed) toggleCollapsed();
+    }}
+  >
+
       {/* Mobile header */}
       <div className="flex justify-between items-center h-16 px-4 border-b border-dash-border xl:hidden bg-dash-surface">
         <div className="flex items-center">