ui: 500ms reveal triggers on hovering a resize handle, not the whole window

src/ui.tsx

@@ -283,13 +283,17 @@ function Plugin () {
   const [rootHover, setRootHover] = useState(false)
   const [hoveredHandle, setHoveredHandle] = useState<string | null>(null)
   const [handlesShown, setHandlesShown] = useState(false)
+  // Reveal the handles only after the cursor has dwelt on a resize area for 500ms.
+  // Once revealed they stay visible while the cursor remains in the window (so moving
+  // between handles doesn't re-trigger the delay); they hide only when leaving the window.
   useEffect(function () {
-    if (rootHover) {
+    if (hoveredHandle !== null) {
       const t = setTimeout(function () { setHandlesShown(true) }, 500)
       return function () { clearTimeout(t) }
+    } else if (!rootHover) {
+      setHandlesShown(false)
     }
-    setHandlesShown(false)
-  }, [rootHover])
+  }, [hoveredHandle, rootHover])
   function hitboxStyle (dir: string, pos: { [k: string]: number | string }) {
     const active = hoveredHandle === dir
     return {