From 745d959c9b053bbd5098a33aed18f539e5f4546c Mon Sep 17 00:00:00 2001
From: Elijah <elijah.kuntz@gmail.com>
Date: Sat, 23 May 2026 08:23:25 -0700
Subject: [PATCH] Fix file rename selection dragging and tooltip cutoff/delay

---
 frontend/src/components/FileExplorer.tsx | 23 ++++++++++++++++++-----
 1 file changed, 18 insertions(+), 5 deletions(-)

diff --git a/frontend/src/components/FileExplorer.tsx b/frontend/src/components/FileExplorer.tsx
index dbf5368..da5f021 100644
--- a/frontend/src/components/FileExplorer.tsx
+++ b/frontend/src/components/FileExplorer.tsx
@@ -113,12 +113,24 @@ function getFileExtension(name: string, isDir: boolean) {
 
 
 function Tooltip({ children, text }: { children: React.ReactNode; text: string }) {
+  const [hovered, setHovered] = useState(false);
   const [show, setShow] = useState(false);
+
+  useEffect(() => {
+    let timeout: NodeJS.Timeout;
+    if (hovered) {
+      timeout = setTimeout(() => setShow(true), 800);
+    } else {
+      setShow(false);
+    }
+    return () => clearTimeout(timeout);
+  }, [hovered]);
+
   return (
     <div
       className="relative flex items-center justify-center w-full min-w-0"
-      onMouseEnter={() => setShow(true)}
-      onMouseLeave={() => setShow(false)}
+      onMouseEnter={() => setHovered(true)}
+      onMouseLeave={() => setHovered(false)}
     >
       {children}
       <AnimatePresence>
@@ -128,7 +140,8 @@ function Tooltip({ children, text }: { children: React.ReactNode; text: string }
             animate={{ opacity: 1, y: 0 }}
             exit={{ opacity: 0, y: 5 }}
             transition={{ duration: 0.15 }}
-            className="absolute bottom-full mb-1.5 px-3 py-1.5 bg-black/90 text-white text-xs font-medium rounded-lg shadow-xl whitespace-nowrap z-50 pointer-events-none border border-white/10"
+            className="absolute bottom-full mb-1.5 px-3 py-1.5 bg-black/90 text-white text-xs font-medium rounded-lg shadow-xl z-50 pointer-events-none border border-white/10 whitespace-normal break-words text-center"
+            style={{ minWidth: '100px', maxWidth: '250px' }}
           >
             {text}
           </motion.div>
@@ -1314,7 +1327,7 @@ export default function FileExplorer({ onLogout }: FileExplorerProps) {
                         key={file.path}
                         data-file-item
                         data-file-path={file.path}
-                        draggable
+                        draggable={renaming !== file.path}
                         onDragStart={(e: any) => handleItemDragStart(e, file.path)}
                         onDragOver={(e: any) => handleItemDragOver(e, file)}
                         onDragLeave={(e: any) => handleItemDragLeave(e, file)}
@@ -1409,7 +1422,7 @@ export default function FileExplorer({ onLogout }: FileExplorerProps) {
                       key={file.path}
                       data-file-item
                       data-file-path={file.path}
-                      draggable
+                      draggable={renaming !== file.path}
                       onDragStart={(e: any) => handleItemDragStart(e, file.path)}
                       onDragOver={(e: any) => handleItemDragOver(e, file)}
                       onDragLeave={(e: any) => handleItemDragLeave(e, file)}