From eaef39df183dc3f1294659278c5ef09648bf2d70 Mon Sep 17 00:00:00 2001
From: songoten <songotenukraine@gmail.com>
Date: Mon, 10 Aug 2026 09:54:54 +0700
Subject: [PATCH] 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 | 35 ++++++++++++++++++++++++
 1 file changed, 35 insertions(+)

diff --git a/apps/desktop/src/components/find-bar.tsx b/apps/desktop/src/components/find-bar.tsx
index d988a53486..5851fc74ed 100644
--- a/apps/desktop/src/components/find-bar.tsx
+++ b/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'}