fix(desktop): position find bar clear of the files pane when open

The find bar is fixed to the top-right of the window, which overlays the
right sidebar's header and first file rows whenever the Files pane is
open. Measure the pane's live rect and park the bar just left of it;
fall back to the previous right-4 position when the pane is closed.

Closes #0

apps/desktop/src/components/find-bar.tsx

@@ -38,6 +38,7 @@ export function FindBar() {
   const { active, query, matchOrdinal, matchCount } = useStore($findInPage)
   const inputRef = useRef<HTMLInputElement>(null)
   const [localQuery, setLocalQuery] = useState('')
+  const [filesPaneRight, setFilesPaneRight] = useState<number | null>(null)
   const { pathname } = useLocation()
 
   // Navigating away (opening another session, a settings page, …) closes the
@@ -67,6 +68,34 @@ export function FindBar() {
     return undefined
   }, [active])
 
+  // The files pane (right sidebar, `aside[aria-label="Right sidebar"]`) is a
+  // floating right rail. The find bar is `fixed right-4` by default, which
+  // would cover the files pane's header + first rows when it is open. Measure
+  // the pane's live rect and park the bar just left of it instead.
+  useEffect(() => {
+    if (!active) {
+      setFilesPaneRight(null)
+
+      return undefined
+    }
+
+    const measure = () => {
+      const aside = document.querySelector('aside[aria-label="Right sidebar"]')
+      const rect = aside?.getBoundingClientRect()
+
+      if (rect && rect.width > 0 && rect.left < window.innerWidth) {
+        setFilesPaneRight(window.innerWidth - rect.left)
+      } else {
+        setFilesPaneRight(null)
+      }
+    }
+
+    measure()
+    window.addEventListener('resize', measure)
+
+    return () => window.removeEventListener('resize', measure)
+  }, [active, pathname])
+
   // Subscribe to found-in-page results from the main process. Refcounted in
   // the store, so a remount (connection re-home) can't stack listeners; the
   // subscription is deliberately mount-scoped and NOT tied to `active` —
@@ -162,6 +191,11 @@ export function FindBar() {
 
   const matchLabel = formatMatchLabel(query, matchOrdinal, matchCount)
 
+  const barStyle =
+    filesPaneRight != null
+      ? { right: `calc(${filesPaneRight}px + 0.75rem)` }
+      : undefined
+
   return (
     <div
       className={cn(
@@ -175,6 +209,7 @@ export function FindBar() {
         'flex items-center gap-2 rounded-lg border border-(--ui-stroke-tertiary) bg-(--ui-surface-background) px-2 py-1.5 shadow-md'
       )}
       role="search"
+      style={barStyle}
     >
       <input
         aria-label={t.keybinds.actions['view.findInPage'] ?? 'Find in page'}