feat(desktop): focus composer input when opening a new tab (#493)

Opening a new tab (the "+" button, /new, reopening a closed tab, or a
folder pick that routes through newThread) now auto-focuses that tab's
composer textarea so the user can type immediately.

The Workspace keeps a single ThreadView/Composer instance and swaps the
threadId prop on tab switches (no remount), so a plain autoFocus won't
fire. Instead newThread/rehydrateLast set a one-shot pendingFocusId in
the store; the Composer focuses when it matches its threadId and clears
it via consumeComposerFocus. Routing through the signal means focus is
grabbed only for newly-opened tabs, not on manual switches back to an
existing tab.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>

Author: jahooma

freebuff-desktop/src/app/ui/components/Composer.tsx

@@ -34,6 +34,8 @@ export function Composer({
   const pushToast = useStore((s) => s.pushToast)
   const running = useStore((s) => s.threads[threadId]?.thread.turnState === 'running')
   const skills = useStore((s) => s.skills)
+  const pendingFocus = useStore((s) => s.pendingFocusId === threadId)
+  const consumeComposerFocus = useStore((s) => s.consumeComposerFocus)
 
   const [sel, setSel] = useState(0)
   // Set when the user dismisses the menu with Esc; reset on the next edit so a
@@ -49,6 +51,15 @@ export function Composer({
     prevLength.current = atts.length
   }, [atts.length])
 
+  // A newly-opened tab flags itself for focus so the user can type right away
+  // (see store.pendingFocusId). Consume the one-shot signal once focused so a
+  // later manual switch back to this tab doesn't re-steal focus.
+  useEffect(() => {
+    if (!pendingFocus) return
+    ref.current?.focus({ preventScroll: true })
+    consumeComposerFocus(threadId)
+  }, [pendingFocus, threadId, consumeComposerFocus])
+
   // Grow the textarea to fit when the draft changes, including on tab switch
   // (the new thread's draft can be much longer than the previous tab's; without
   // this the reused DOM node stays at the old height).

freebuff-desktop/src/app/ui/store/store.ts

@@ -236,6 +236,11 @@ interface StoreState {
   cycleTab: (delta: number) => void
   jumpTab: (index: number) => void
   ensureLoaded: (id: string) => Promise<void>
+  /** One-shot signal: a newly-opened tab whose composer should grab focus. The
+   *  Composer clears it via `consumeComposerFocus` once it has focused, so a
+   *  later manual tab switch doesn't re-steal focus. */
+  pendingFocusId: string | null
+  consumeComposerFocus: (id: string) => void
 
   /** Toggle a reasoning part between its preview/expanded view (preserves user intent). */
   toggleReasoning: (threadId: string, messageId: string, partId: string) => void
@@ -295,6 +300,7 @@ export const useStore = create<StoreState>((set, get) => ({
   settingsOpen: false,
   recentProjects: [],
   toasts: [],
+  pendingFocusId: null,
 
   setAgentHarness(id) {
     // Optimistic: the server echoes the change back via a `state` event too.
@@ -667,6 +673,8 @@ export const useStore = create<StoreState>((set, get) => ({
       tabOrder: appendTab(s.tabOrder, t.id),
       activeId: t.id,
       recentProjects: pushRecent(s.recentProjects, t.projectPath),
+      // Fresh tab → its composer should be ready to type into immediately.
+      pendingFocusId: t.id,
     }))
   },
 
@@ -735,11 +743,18 @@ export const useStore = create<StoreState>((set, get) => ({
       set((s) => ({
         tabOrder: appendTab(s.tabOrder, id),
         activeId: id,
+        pendingFocusId: id,
       }))
       get().ensureLoaded(id)
     })
   },
 
+  consumeComposerFocus(id) {
+    // Only clear if it's still pointing at the tab that just focused, so a rapid
+    // second new-tab doesn't get its pending focus wiped by the first's consume.
+    if (get().pendingFocusId === id) set({ pendingFocusId: null })
+  },
+
   cycleTab(delta) {
     const { tabOrder, activeId } = get()
     if (tabOrder.length === 0) return