From a8cd3bb85ba051ac35ebf34281c9cdedc2910535 Mon Sep 17 00:00:00 2001
From: IkramCode <moikramcoder@gmail.com>
Date: Wed, 21 Aug 2024 04:47:39 +0500
Subject: [PATCH] Fix sidebar hover behavior and collapse button visibility

---
 src/components/sidebar/Sidebar.tsx | 6 ++----
 1 file changed, 2 insertions(+), 4 deletions(-)

diff --git a/src/components/sidebar/Sidebar.tsx b/src/components/sidebar/Sidebar.tsx
index ff648f8..54a15fe 100644
--- a/src/components/sidebar/Sidebar.tsx
+++ b/src/components/sidebar/Sidebar.tsx
@@ -69,7 +69,7 @@ const Sidebar = () => {
 
   const handleMouseLeave = (event: React.MouseEvent<HTMLDivElement>) => {
     if (!isMobile) {
-      if (event.relatedTarget && event.relatedTarget !== window && event.currentTarget !== event.relatedTarget) {
+      if (!event.currentTarget.contains(event.relatedTarget as Node)) {
         setIsHovered(false);
         setIsCollapsed(true);
       }
@@ -120,7 +120,7 @@ const Sidebar = () => {
             <span className="text-lg font-bold text-neon-green">BM Samay</span>
           </div>
         )}
-        {!isMobile && (
+        {!isMobile && !isHovered && (
           <Button
             variant="ghost"
             size="icon"
@@ -128,10 +128,8 @@ const Sidebar = () => {
             className="text-gray-400 hover:text-neon-green hover:bg-neon-green/5 rounded-full"
           >
             {isCollapsed ? (
-              // Only show the ChevronRight icon when collapsed
               <ChevronRight size={20} />
             ) : (
-              // Hide the ChevronLeft icon when collapsed
               <ChevronLeft size={30} className="hidden" />
             )}
           </Button>