fix(sidebar): do not arm Enter without a visible target

Review round 1: gating the cursor's paint on keyboard mode left Enter still
acting on the seeded first row while that row was unmarked. The search
field takes focus on open, so Enter could switch workspace with nothing
shown as the target — emcn's popover instead holds its selection at -1 and
ignores Enter until keyboard nav begins.

Enter now acts only once a cursor is on screen, and typing counts as
keyboard intent so the common "filter, then Enter" flow lands on a visible
top result. Every path to Enter therefore has a marked target.

Author: Waleed Latif

apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workspace-header/workspace-header.test.tsx

@@ -7,6 +7,8 @@ import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
 
 const { mockNavigateToSettings } = vi.hoisted(() => ({ mockNavigateToSettings: vi.fn() }))
 
+const onWorkspaceSwitch = vi.fn()
+
 vi.mock('@tanstack/react-query', () => ({
   useQueryClient: () => ({ invalidateQueries: vi.fn(), setQueryData: vi.fn() }),
 }))
@@ -88,7 +90,7 @@ function render() {
         isCreatingWorkspace={false}
         isWorkspaceMenuOpen
         setIsWorkspaceMenuOpen={() => {}}
-        onWorkspaceSwitch={() => {}}
+        onWorkspaceSwitch={onWorkspaceSwitch}
         onCreateWorkspace={async () => {}}
         onRenameWorkspace={async () => {}}
         onDeleteWorkspace={async () => {}}
@@ -122,6 +124,17 @@ function isMarked(name: string): boolean {
   )
 }
 
+/**
+ * Types into a React-controlled input. Assigning `.value` directly is ignored: React
+ * tracks the previous value on the node, so the change must go through the native
+ * setter for its synthetic `onChange` to fire.
+ */
+function typeInto(input: HTMLInputElement, value: string) {
+  const setValue = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value')?.set
+  setValue?.call(input, value)
+  input.dispatchEvent(new Event('input', { bubbles: true }))
+}
+
 beforeEach(() => {
   vi.clearAllMocks()
   // jsdom implements neither; the component scrolls the active row into view.
@@ -134,6 +147,37 @@ afterEach(() => {
 })
 
 describe('WorkspaceHeader workspace switcher highlight', () => {
+  it('leaves Enter unarmed until a cursor is on screen', () => {
+    render()
+
+    const search = document.querySelector('input[placeholder="Search workspaces..."]')
+    act(() => {
+      search?.dispatchEvent(new KeyboardEvent('keydown', { key: 'Enter', bubbles: true }))
+    })
+
+    // The search field is focused on open, so acting on the seeded row here would
+    // switch workspace with nothing marked.
+    expect(onWorkspaceSwitch).not.toHaveBeenCalled()
+  })
+
+  it('arms Enter on the top result once the user types', () => {
+    render()
+
+    const search = document.querySelector(
+      'input[placeholder="Search workspaces..."]'
+    ) as HTMLInputElement | null
+    act(() => {
+      if (search) typeInto(search, 'Acme')
+    })
+    // Typing counts as keyboard intent, so the target is visible before Enter fires.
+    expect(isMarked('Acme')).toBe(true)
+
+    act(() => {
+      search?.dispatchEvent(new KeyboardEvent('keydown', { key: 'Enter', bubbles: true }))
+    })
+    expect(onWorkspaceSwitch).toHaveBeenCalledWith(expect.objectContaining({ id: 'ws-acme' }))
+  })
+
   it('marks only the current workspace when the menu opens', () => {
     render()
 

apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workspace-header/workspace-header.tsx

@@ -540,7 +540,12 @@ function WorkspaceHeaderImpl({
                     icon={Search}
                     placeholder='Search workspaces...'
                     value={workspaceSearch}
-                    onChange={(e) => setWorkspaceSearch(e.target.value)}
+                    onChange={(e) => {
+                      // Typing is keyboard intent, so the cursor appears on the top
+                      // result and Enter has a visible target.
+                      setIsKeyboardNav(true)
+                      setWorkspaceSearch(e.target.value)
+                    }}
                     onKeyDown={(e) => {
                       e.stopPropagation()
                       if (e.nativeEvent.isComposing) return
@@ -557,6 +562,11 @@ function WorkspaceHeaderImpl({
                           (activeIndex - 1 + filteredWorkspaces.length) % filteredWorkspaces.length
                         setHighlightedId(filteredWorkspaces[next].id)
                       } else if (e.key === 'Enter') {
+                        // Only armed once a cursor is actually on screen. The search
+                        // field is focused on open, so acting on the seeded row here
+                        // would switch workspace with nothing marked — emcn's popover
+                        // likewise holds its selection at -1 until keyboard nav starts.
+                        if (!isKeyboardNav) return
                         e.preventDefault()
                         const target = filteredWorkspaces[activeIndex]
                         if (target) onWorkspaceSwitch(target)