@skyhook-io/k8s-ui 1.18.0 → 1.18.1

package/src/components/logs/LogsViewer.test.tsx

@@ -60,16 +60,16 @@ afterEach(async () => {
   vi.unstubAllGlobals()
 })
 
-async function renderViewer(fetchLogs: (params: LogsFetchParams) => Promise<{ [container: string]: string }>, autoStream = false, containers = ['app']) {
+async function renderViewer(fetchLogs: (params: LogsFetchParams) => Promise<{ [container: string]: string }>, autoStream = false, containers = ['app'], podName = 'web-0') {
   await act(async () =>
     root.render(
       <ToastProvider>
         <LogsViewer
           namespace="default"
-          podName="web-0"
+          podName={podName}
           containers={containers}
           fetchLogs={fetchLogs}
-          createStream={() => new EventSource('/stream')}
+          createStream={() => new EventSource(`/pods/default/${podName}/logs/stream`)}
           autoStream={autoStream}
         />
       </ToastProvider>,
@@ -234,62 +234,6 @@ it('with auto-stream on, a time range picked after the stream ended loads it ins
   expect(fetchLogs).toHaveBeenLastCalledWith(expect.objectContaining({ previous: true, sinceSeconds: expect.any(Number) }))
 })
 
-it('with auto-stream on, a range picked while the stream opens reopens it with that range', async () => {
-  const fetchLogs = vi.fn(async () => ({ app: '' }))
-  await renderViewer(fetchLogs, true)
-  const opening = FakeEventSource.last
-
-  const range = element.querySelector<HTMLSelectElement>('select')
-  if (!range) throw new Error('range select not rendered')
-  await act(async () => {
-    range.value = range.options[range.options.length - 1].value
-    range.dispatchEvent(new Event('change', { bubbles: true }))
-  })
-
-  expect(opening?.closed).toBe(true)
-  expect(FakeEventSource.last).not.toBe(opening)
-  expect(fetchLogs).not.toHaveBeenCalled()
-})
-
-it('with auto-stream on, after the stream ended and was started again, a range picked while it opens reopens it', async () => {
-  const fetchLogs = vi.fn(async () => ({ app: '' }))
-  await renderViewer(fetchLogs, true)
-  await act(async () => FakeEventSource.last?.emit('connected', {}))
-  await act(async () => FakeEventSource.last?.emit('end', {}))
-  const range = element.querySelector<HTMLSelectElement>('select')
-  if (!range) throw new Error('range select not rendered')
-  const pick = (index: number) => act(async () => {
-    range.value = range.options[index].value
-    range.dispatchEvent(new Event('change', { bubbles: true }))
-  })
-  await pick(range.options.length - 1)
-  await act(async () => button('Stream').click())
-  const opening = FakeEventSource.last
-
-  await pick(range.options.length - 2)
-
-  expect(opening?.closed).toBe(true)
-  expect(FakeEventSource.last).not.toBe(opening)
-})
-
-it('a range picked while a manually started stream opens does not cancel it', async () => {
-  const fetchLogs = vi.fn(async () => ({ app: '' }))
-  await renderViewer(fetchLogs, true)
-  await act(async () => FakeEventSource.last?.emit('connected', {}))
-  await act(async () => button('Stop').click())
-  await act(async () => button('Stream').click())
-  const opening = FakeEventSource.last
-  const range = element.querySelector<HTMLSelectElement>('select')
-  if (!range) throw new Error('range select not rendered')
-
-  await act(async () => {
-    range.value = range.options[range.options.length - 1].value
-    range.dispatchEvent(new Event('change', { bubbles: true }))
-  })
-
-  expect(opening?.closed).toBe(false)
-})
-
 it('with auto-stream on, the open stream is not replaced by a snapshot', async () => {
   const fetchLogs = vi.fn(async () => ({ app: '' }))
   await renderViewer(fetchLogs, true)
@@ -367,3 +311,104 @@ it('still shows a Radar failure as an error', async () => {
   await renderViewer(async () => { throw new ApiError(failure, { error: failure }) })
   expect(messageClass(failure)).toMatch(/text-red/)
 })
+
+function rangeSelect(): HTMLSelectElement {
+  const range = element.querySelector<HTMLSelectElement>('select')
+  if (!range) throw new Error('range select not rendered')
+  return range
+}
+
+const nextFrame = () => act(async () => { await new Promise(resolve => requestAnimationFrame(() => resolve(null))) })
+
+it('opening another pod with the same container name streams it, even after the first pod\'s stream ended', async () => {
+  const fetchLogs = vi.fn(async () => ({ app: '' }))
+  await renderViewer(fetchLogs, true, ['app'], 'web-0')
+  await act(async () => FakeEventSource.last?.emit('connected', {}))
+  await act(async () => FakeEventSource.last?.emit('end', {}))
+  const ended = FakeEventSource.last
+
+  await renderViewer(fetchLogs, true, ['app'], 'web-1')
+
+  expect(FakeEventSource.last).not.toBe(ended)
+  expect(FakeEventSource.last?.url).toBe('/pods/default/web-1/logs/stream')
+  expect(fetchLogs).not.toHaveBeenCalled()
+})
+
+it('a manual Stop on one pod does not stop the next pod from streaming', async () => {
+  const fetchLogs = vi.fn(async () => ({ app: '' }))
+  await renderViewer(fetchLogs, true, ['app'], 'web-0')
+  await act(async () => FakeEventSource.last?.emit('connected', {}))
+  await act(async () => button('Stop').click())
+
+  await renderViewer(fetchLogs, true, ['app'], 'web-1')
+
+  expect(FakeEventSource.last?.url).toBe('/pods/default/web-1/logs/stream')
+})
+
+it('Previous and the range are locked while an auto-stream opens', async () => {
+  await renderViewer(async () => ({ app: '' }), true)
+  expect(previousCheckbox().disabled).toBe(true)
+  expect(rangeSelect().disabled).toBe(true)
+
+  await act(async () => FakeEventSource.last?.emit('connected', {}))
+  await act(async () => FakeEventSource.last?.emit('end', {}))
+  expect(previousCheckbox().disabled).toBe(false)
+  expect(rangeSelect().disabled).toBe(false)
+})
+
+it('Previous and the range are locked while a manually started stream opens', async () => {
+  await renderViewer(async () => ({ app: '' }))
+  expect(previousCheckbox().disabled).toBe(false)
+
+  await act(async () => button('Stream').click())
+
+  expect(previousCheckbox().disabled).toBe(true)
+  expect(rangeSelect().disabled).toBe(true)
+})
+
+it('a stream that is still opening can be stopped, which unlocks Previous', async () => {
+  await renderViewer(async () => ({ app: '' }))
+  await act(async () => button('Stream').click())
+  const opening = FakeEventSource.last
+
+  await act(async () => button('Stop').click())
+
+  expect(opening?.closed).toBe(true)
+  expect(previousCheckbox().disabled).toBe(false)
+  expect(button('Stream')).toBeTruthy()
+})
+
+it('a stream failure after lines arrived is shown above them', async () => {
+  await renderViewer(async () => ({ app: '' }))
+  await act(async () => button('Stream').click())
+  await act(async () => FakeEventSource.last?.emit('connected', {}))
+  await act(async () => FakeEventSource.last?.emit('log', { timestamp: '2026-10-14T10:00:00Z', content: 'live line', container: 'app' }))
+  await nextFrame()
+  await act(async () => FakeEventSource.last?.emit('error', { error: 'Read error: unexpected EOF' }))
+
+  expect(element.querySelector('[role="alert"]')?.textContent).toBe('Read error: unexpected EOF · Previously loaded logs remain below.')
+  expect(element.textContent).toContain('OTHER 1')
+})
+
+const NOT_STARTED = 'This container has not started yet, so it has no logs. Kubernetes reports ContainerCreating.'
+
+it('shows a container that has not started in the empty-pane style', async () => {
+  await renderViewer(async () => { throw new ApiError(NOT_STARTED, { error: NOT_STARTED, error_code: 'container_not_started' }) })
+  expect(messageClass(NOT_STARTED)).not.toMatch(/text-red/)
+})
+
+it('shows what the live stream is waiting for, and drops it once lines arrive', async () => {
+  const waiting = `${NOT_STARTED} Logs will show here once it starts.`
+  await renderViewer(async () => ({ app: '' }), true)
+  await act(async () => FakeEventSource.last?.emit('connected', {}))
+  await act(async () => FakeEventSource.last?.emit('notice', { notice: waiting, notice_code: 'container_not_started' }))
+  expect(messageClass(waiting)).not.toMatch(/text-red/)
+  expect(button('Stop')).toBeTruthy()
+
+  await act(async () => FakeEventSource.last?.emit('notice', { notice: '' }))
+  await act(async () => FakeEventSource.last?.emit('log', { timestamp: '2026-10-14T10:00:00Z', content: 'started', container: 'app' }))
+  await nextFrame()
+
+  expect(element.textContent).not.toContain(waiting)
+  expect(element.textContent).toContain('OTHER 1')
+})

package/src/components/logs/LogsViewer.tsx

@@ -43,7 +43,7 @@ export interface LogsViewerProps {
 // Kubernetes' answers that there are no logs to show, such as "no earlier run".
 // They describe the pod, not a failure in Radar, so they are shown like an
 // empty pane rather than as an error.
-const CLUSTER_ANSWER_CODES = new Set(['no_previous_run', 'logs_unavailable'])
+const CLUSTER_ANSWER_CODES = new Set(['no_previous_run', 'logs_unavailable', 'container_not_started'])
 
 function isClusterAnswerCode(code: unknown): boolean {
   return typeof code === 'string' && CLUSTER_ANSWER_CODES.has(code)
@@ -56,7 +56,14 @@ function clusterAnswerOf(err: unknown): string | null {
   return isClusterAnswerCode(data.error_code) ? err.message : null
 }
 
-export function LogsViewer({
+// Keyed by pod: everything the viewer remembers (the container, Previous, the
+// auto-start latch, a manual Stop) belongs to one pod, and a host that swaps
+// the pod without remounting would carry it over to the next one.
+export function LogsViewer(props: LogsViewerProps) {
+  return <PodLogsViewer key={`${props.namespace}/${props.podName}`} {...props} />
+}
+
+function PodLogsViewer({
   namespace: _namespace,
   podName,
   containers,
@@ -74,6 +81,8 @@ export function LogsViewer({
   const [emptyMessage, setEmptyMessage] = useState<string | null>(null)
   const [logRange, setLogRange] = useState('500')
   const [showPrevious, setShowPrevious] = useState(false)
+  // What an open stream says it is waiting for, e.g. a container to start.
+  const [streamNotice, setStreamNotice] = useState<string | null>(null)
   const { showError, showSuccess } = useToast()
 
   const { tailLines, sinceSeconds } = parseLogRange(logRange)
@@ -109,6 +118,7 @@ export function LogsViewer({
     setIsLoading(true)
     setFetchError(null)
     setEmptyMessage(null)
+    setStreamNotice(null)
     try {
       const data = await fetchLogs({ container: selectedContainer, tailLines, sinceSeconds, previous: showPrevious })
       if (seq !== loadSeqRef.current) return
@@ -171,6 +181,7 @@ export function LogsViewer({
     setIsLoading(false)
     setFetchError(null)
     setEmptyMessage(null)
+    setStreamNotice(null)
     // The stream replays the last N lines (TailLines + Follow); clear first so
     // they don't duplicate lines already in the buffer (the snapshot on the
     // manual path, or an earlier stream on restart).
@@ -184,6 +195,10 @@ export function LogsViewer({
           content: data.content || '',
           container: data.container || selectedContainer,
         }),
+        onNotice: (data: unknown) => {
+          const notice = typeof data === 'object' && data !== null && 'notice' in data && typeof data.notice === 'string' ? data.notice : ''
+          setStreamNotice(notice || null)
+        },
       },
       'Log stream connection failed',
     )
@@ -191,6 +206,7 @@ export function LogsViewer({
 
   const handleStopStreaming = useCallback(() => {
     userStoppedRef.current = true
+    setStreamNotice(null)
     stopStreaming()
   }, [stopStreaming])
 
@@ -220,24 +236,28 @@ export function LogsViewer({
     }
   }, [podName, selectedContainer, overrideDownload, showError, showSuccess])
 
+  // Previous and the range describe what a snapshot loads, so they stay
+  // locked from the moment a stream starts opening, not only once it is open.
+  const streamBusy = isStreaming || connecting
+
   const renderToolbarExtra = ({ isDark, palette }: { isDark: boolean; palette: LogPalette }) => (
     <>
       <ContainerSelect containers={containers} value={selectedContainer} onChange={setSelectedContainer} isDark={isDark} />
 
-      <Tooltip content={isStreaming ? 'Stop streaming to view the previous instance' : "Show logs from the pod's previous instance (if it was restarted). Useful for troubleshooting crashed containers."} position="bottom">
-        <label className={`flex items-center gap-1.5 text-xs ${palette.textSecondary} ${isStreaming ? 'opacity-50 cursor-not-allowed' : ''}`}>
+      <Tooltip content={streamBusy ? 'Stop streaming to view the previous instance' : "Show logs from the pod's previous instance (if it was restarted). Useful for troubleshooting crashed containers."} position="bottom">
+        <label className={`flex items-center gap-1.5 text-xs ${palette.textSecondary} ${streamBusy ? 'opacity-50 cursor-not-allowed' : ''}`}>
           <input
             type="checkbox"
             checked={showPrevious}
             onChange={(e) => setShowPrevious(e.target.checked)}
-            disabled={isStreaming}
+            disabled={streamBusy}
             className={`w-3 h-3 rounded ${palette.borderLight} ${palette.elevatedBg} text-blue-500 focus:ring-blue-500 focus:ring-offset-0`}
           />
           <span className={`border-b border-dotted ${isDark ? 'border-slate-500' : 'border-slate-400'}`}>Previous</span>
         </label>
       </Tooltip>
 
-      <LogRangeSelect value={logRange} onChange={setLogRange} isDark={isDark} disabled={isStreaming} />
+      <LogRangeSelect value={logRange} onChange={setLogRange} isDark={isDark} disabled={streamBusy} />
     </>
   )
 
@@ -260,13 +280,13 @@ export function LogsViewer({
       getRetainedEntries={getRetainedEntries}
       isLoading={isLoading || isConnecting}
       errorMessage={entries.length === 0 ? fetchError || (!emptyMessage && !streamAnswer ? streamError : null) : null}
-      isStreaming={isStreaming}
+      isStreaming={streamBusy}
       onStartStream={createStream ? handleStartStreaming : undefined}
       onStopStream={handleStopStreaming}
       onRefresh={loadLogs}
       onDownload={downloadLogs}
       onClear={clear}
-      emptyMessage={emptyMessage ?? streamAnswer ?? undefined}
+      emptyMessage={emptyMessage ?? streamAnswer ?? streamNotice ?? undefined}
       toolbarExtra={renderToolbarExtra}
       forceDark={forceDark}
       defaultDark={defaultDark}

package/src/components/namespace-switcher/NamespacePicker.test.tsx

@@ -1,8 +1,8 @@
 // @vitest-environment jsdom
-import { act, type ReactNode } from 'react'
+import { act, createRef, useState, type ReactNode } from 'react'
 import { createRoot, type Root } from 'react-dom/client'
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
-import { NamespacePicker, type NamespacePickerProps, type NamespaceScopeView } from './NamespacePicker'
+import { NamespacePicker, type NamespacePickerHandle, type NamespacePickerProps, type NamespaceScopeView } from './NamespacePicker'
 
 vi.mock('../ui/Tooltip', () => ({
   Tooltip: ({ children, content }: { children: ReactNode; content: ReactNode }) => (
@@ -138,3 +138,237 @@ describe('NamespacePicker incomplete-list notice', () => {
     expect(onApply).toHaveBeenCalledWith(['team-a'])
   })
 })
+
+describe('NamespacePicker Only button', () => {
+  const scope = { ...baseScope, actives: ['team-a'], accessibleNamespaces: ['team-a', 'team-b', 'team-c'] }
+
+  const triggerButton = () =>
+    document.querySelector<HTMLButtonElement>('button[aria-label="Switch active namespaces"]')!
+
+  async function open(onApply = vi.fn()) {
+    await act(async () => {
+      root.render(<NamespacePicker scope={scope} onApply={onApply} />)
+    })
+    await act(async () => { triggerButton().click() })
+    return onApply
+  }
+
+  const onlyButton = (ns: string) =>
+    document.querySelector<HTMLButtonElement>(`button[aria-label="Show only ${ns}"]`)!
+  const row = (ns: string) =>
+    Array.from(document.querySelectorAll('label')).find(l => l.textContent?.includes(ns))!
+  const checkbox = (ns: string) => row(ns).querySelector<HTMLInputElement>('input[type="checkbox"]')!
+  const doneButton = () =>
+    Array.from(document.querySelectorAll('button')).find(b => b.textContent === 'Done')!
+  const isOpen = () => document.querySelector('input[type="checkbox"]') !== null
+
+  it('puts an Only button on every row', async () => {
+    await open()
+    for (const ns of ['team-a', 'team-b', 'team-c']) expect(onlyButton(ns).textContent).toBe('Only')
+  })
+
+  it('applies just that namespace and closes the dropdown', async () => {
+    const onApply = await open()
+    expect(isOpen()).toBe(true)
+    await act(async () => { onlyButton('team-c').click() })
+
+    expect(onApply).toHaveBeenCalledTimes(1)
+    expect(onApply).toHaveBeenCalledWith(['team-c'])
+    expect(isOpen()).toBe(false)
+  })
+
+  it('replaces unsaved checkbox toggles', async () => {
+    const onApply = await open()
+    await act(async () => { checkbox('team-b').click() })
+    await act(async () => { onlyButton('team-c').click() })
+
+    expect(onApply).toHaveBeenCalledWith(['team-c'])
+  })
+
+  it('does not re-apply when that namespace is already the only one active', async () => {
+    const onApply = await open()
+    await act(async () => { onlyButton('team-a').click() })
+
+    expect(onApply).not.toHaveBeenCalled()
+    expect(isOpen()).toBe(false)
+  })
+
+  it('keeps the name and checkbox as add/remove toggles', async () => {
+    const onApply = await open()
+    await act(async () => { checkbox('team-b').click() })
+    expect(checkbox('team-b').checked).toBe(true)
+    expect(onApply).not.toHaveBeenCalled()
+    expect(isOpen()).toBe(true)
+
+    const name = Array.from(row('team-c').querySelectorAll('span')).find(s => s.textContent === 'team-c')!
+    await act(async () => { name.click() })
+    expect(checkbox('team-c').checked).toBe(true)
+    expect(onApply).not.toHaveBeenCalled()
+    expect(isOpen()).toBe(true)
+
+    await act(async () => { doneButton().click() })
+    expect(onApply).toHaveBeenCalledWith(['team-a', 'team-b', 'team-c'])
+  })
+
+  it('keeps the button out of the row label', async () => {
+    await open()
+    expect(document.querySelector('label button')).toBeNull()
+    expect(onlyButton('team-b').parentElement).toBe(row('team-b').parentElement)
+  })
+
+  it('is reachable by keyboard, with no tabindex taking it out of the tab order', async () => {
+    await open()
+    const only = onlyButton('team-b')
+    expect(only.tabIndex).toBe(0)
+    only.focus()
+    expect(document.activeElement).toBe(only)
+  })
+
+  it.each(['Only', 'Done', 'Clear all'])('reopens from active namespaces after an unacknowledged %s apply', async (action) => {
+    const onApply = await open()
+    if (action === 'Only') {
+      await act(async () => { onlyButton('team-c').click() })
+    } else if (action === 'Done') {
+      await act(async () => { checkbox('team-b').click() })
+      await act(async () => { doneButton().click() })
+    } else {
+      const clear = document.querySelector<HTMLButtonElement>('button[aria-label="Clear namespace selection"]')!
+      await act(async () => { clear.click() })
+    }
+    expect(onApply).toHaveBeenCalledTimes(1)
+    expect(isOpen()).toBe(false)
+
+    await act(async () => { triggerButton().click() })
+    expect(checkbox('team-a').checked).toBe(true)
+    expect(checkbox('team-b').checked).toBe(false)
+    expect(checkbox('team-c').checked).toBe(false)
+    await act(async () => { document.dispatchEvent(new KeyboardEvent('keydown', { key: 'Escape', bubbles: true })) })
+    expect(onApply).toHaveBeenCalledTimes(1)
+  })
+
+  it('also refreshes the draft when the keyboard shortcut opens the picker', async () => {
+    const ref = createRef<NamespacePickerHandle>()
+    const onApply = vi.fn()
+    await act(async () => { root.render(<NamespacePicker ref={ref} scope={scope} onApply={onApply} />) })
+    await act(async () => { ref.current?.open() })
+    await act(async () => { onlyButton('team-c').click() })
+    await act(async () => { ref.current?.open() })
+    expect(checkbox('team-a').checked).toBe(true)
+    expect(checkbox('team-c').checked).toBe(false)
+    await act(async () => { doneButton().click() })
+    expect(onApply).toHaveBeenCalledTimes(1)
+  })
+
+  it('keeps current edits if the open shortcut is used while the menu is already open', async () => {
+    const ref = createRef<NamespacePickerHandle>()
+    const onApply = vi.fn()
+    await act(async () => { root.render(<NamespacePicker ref={ref} scope={scope} onApply={onApply} />) })
+    await act(async () => { ref.current?.open() })
+    await act(async () => { checkbox('team-b').click() })
+    await act(async () => { ref.current?.open() })
+    expect(checkbox('team-a').checked).toBe(true)
+    expect(checkbox('team-b').checked).toBe(true)
+    expect(onApply).not.toHaveBeenCalled()
+  })
+
+  describe('returning focus after the switch', () => {
+    let setPending: (pending: boolean) => void
+
+    function Host({ onApply, pendingOnApply = true }: { onApply: (namespaces: string[]) => void; pendingOnApply?: boolean }) {
+      const [pending, setPendingState] = useState(false)
+      setPending = setPendingState
+      return (
+        <NamespacePicker
+          scope={scope}
+          pending={pending}
+          onApply={namespaces => {
+            if (pendingOnApply) setPendingState(true)
+            onApply(namespaces)
+          }}
+        />
+      )
+    }
+
+    async function openAndPressOnly(ns: string, pendingOnApply = true) {
+      const onApply = vi.fn()
+      await act(async () => { root.render(<Host onApply={onApply} pendingOnApply={pendingOnApply} />) })
+      await act(async () => { triggerButton().click() })
+      const only = onlyButton(ns)
+      only.focus()
+      await act(async () => { only.click() })
+      return onApply
+    }
+
+    // A browser blurs a focused button the moment it becomes disabled; jsdom does not.
+    async function startPending() {
+      ;(document.activeElement as HTMLElement | null)?.blur()
+      await act(async () => { setPending(true) })
+    }
+
+    it('puts focus back on the trigger when the switch is instant', async () => {
+      await open()
+      const only = onlyButton('team-a')
+      only.focus()
+      await act(async () => { only.click() })
+
+      expect(document.activeElement).toBe(triggerButton())
+    })
+
+    it('waits for the pending switch to finish, because the trigger is inert until then', async () => {
+      await openAndPressOnly('team-c')
+      expect(triggerButton().disabled).toBe(true)
+      expect(document.activeElement).toBe(document.body)
+
+      await act(async () => { setPending(false) })
+      expect(document.activeElement).toBe(triggerButton())
+    })
+
+    it('restores focus again when the host only reports pending after the menu has closed', async () => {
+      await openAndPressOnly('team-c', false)
+      expect(document.activeElement).toBe(triggerButton())
+
+      await startPending()
+      expect(triggerButton().disabled).toBe(true)
+      expect(document.activeElement).toBe(document.body)
+
+      await act(async () => { setPending(false) })
+      expect(document.activeElement).toBe(triggerButton())
+    })
+
+    it('leaves focus alone when the user moved elsewhere during the switch', async () => {
+      const elsewhere = document.createElement('input')
+      document.body.appendChild(elsewhere)
+      await openAndPressOnly('team-c')
+      await act(async () => { elsewhere.focus() })
+
+      await act(async () => { setPending(false) })
+      expect(document.activeElement).toBe(elsewhere)
+    })
+
+    it('leaves focus alone when the user clicked elsewhere during the switch', async () => {
+      await openAndPressOnly('team-c')
+      await act(async () => { document.body.dispatchEvent(new Event('pointerdown', { bubbles: true })) })
+
+      await act(async () => { setPending(false) })
+      expect(document.activeElement).toBe(document.body)
+    })
+
+    it('does not claim focus for a later switch once the user has moved on', async () => {
+      const elsewhere = document.createElement('input')
+      document.body.appendChild(elsewhere)
+      await openAndPressOnly('team-c', false)
+      await act(async () => { elsewhere.focus() })
+      await act(async () => { elsewhere.blur() })
+
+      await startPending()
+      await act(async () => { setPending(false) })
+      expect(document.activeElement).toBe(document.body)
+    })
+
+    it('does not move focus for other ways of closing', async () => {
+      await open()
+      await act(async () => { doneButton().click() })
+      expect(document.activeElement).toBe(document.body)
+    })
+  })
+})

package/src/components/namespace-switcher/NamespacePicker.tsx

@@ -82,7 +82,8 @@ export interface NamespacePickerProps {
  *
  * Selection model: the dropdown keeps a draft Set<string>; toggling rows
  * mutates the draft locally; closing the dropdown applies the draft in a single
- * onApply. "Clear all" applies immediately and closes.
+ * onApply. "Clear all" applies immediately and closes, as does a row's "Only"
+ * button, which switches to that namespace alone.
  */
 export const NamespacePicker = forwardRef<NamespacePickerHandle, NamespacePickerProps>(function NamespacePicker(
   { scope, onApply, loading = false, pending = false, disabled = false, disabledTooltip, className = '', variant = 'chip', label, limitedListHelp },
@@ -95,6 +96,7 @@ export const NamespacePicker = forwardRef<NamespacePickerHandle, NamespacePicker
 
   const triggerRef = useRef<HTMLButtonElement>(null)
   const dropdownRef = useRef<HTMLDivElement>(null)
+  const [restoreFocus, setRestoreFocus] = useState(false)
 
   const scopeActives = useMemo(() => scope?.actives ?? [], [scope?.actives])
   const activesKey = useMemo(() => [...scopeActives].sort().join(','), [scopeActives])
@@ -149,12 +151,34 @@ export const NamespacePicker = forwardRef<NamespacePickerHandle, NamespacePicker
     applySelection(draft)
   }, [applySelection, draft])
 
-  useImperativeHandle(ref, () => ({
-    open: () => {
-      if (disabled || loading || pending) return
-      setIsOpen(true)
-    },
-  }), [disabled, loading, pending])
+  const openPicker = useCallback(() => {
+    if (isOpen || disabled || loading || pending) return
+    setDraft(new Set(scopeActives))
+    setIsOpen(true)
+  }, [isOpen, disabled, loading, pending, scopeActives])
+
+  useImperativeHandle(ref, () => ({ open: openPicker }), [openPicker])
+
+  // Disabling the trigger while a switch is pending drops its focus, so this stays armed through that cycle.
+  useEffect(() => {
+    if (!restoreFocus || isOpen || disabled || loading || pending) return
+    const active = document.activeElement
+    if (!active || active === document.body) triggerRef.current?.focus()
+  }, [restoreFocus, isOpen, disabled, loading, pending])
+
+  useEffect(() => {
+    if (!restoreFocus) return
+    const onFocusIn = (e: FocusEvent) => {
+      if (e.target !== triggerRef.current) setRestoreFocus(false)
+    }
+    const onPointerDown = () => setRestoreFocus(false)
+    document.addEventListener('focusin', onFocusIn)
+    document.addEventListener('pointerdown', onPointerDown)
+    return () => {
+      document.removeEventListener('focusin', onFocusIn)
+      document.removeEventListener('pointerdown', onPointerDown)
+    }
+  }, [restoreFocus])
 
   useEffect(() => {
     if (!isOpen) return
@@ -198,6 +222,15 @@ export const NamespacePicker = forwardRef<NamespacePickerHandle, NamespacePicker
     setDraft(next)
   }
 
+  const selectOnly = (ns: string) => {
+    const next = new Set([ns])
+    setRestoreFocus(true)
+    setDraft(next)
+    setIsOpen(false)
+    setSearch('')
+    applySelection(next)
+  }
+
   const clearAll = () => {
     if (scope.cacheScoped) return
     setDraft(new Set())
@@ -255,7 +288,7 @@ export const NamespacePicker = forwardRef<NamespacePickerHandle, NamespacePicker
       >
         <button
           ref={triggerRef}
-          onClick={() => !isDisabled && (isOpen ? closeAndApply() : setIsOpen(true))}
+          onClick={() => !isDisabled && (isOpen ? closeAndApply() : openPicker())}
           disabled={isDisabled}
           className={
             variant === 'segment'
@@ -350,6 +383,7 @@ export const NamespacePicker = forwardRef<NamespacePickerHandle, NamespacePicker
                 onSelectionChange={setDraft}
                 onClearAll={clearAll}
                 onDone={closeAndApply}
+                onSelectOnly={selectOnly}
                 search={search}
                 onSearchChange={setSearch}
                 searchPlaceholder="Filter namespaces"