@skyhook-io/radar-app 1.16.0 → 1.16.2

package/src/components/diagnose/investigationSourceFocus.ts

@@ -70,20 +70,20 @@ export function highlightRelatedEvidence(
   row: HTMLElement,
   sourceId?: string,
 ): void {
-  const workspace = row.closest("[data-investigation-workspace]");
-  if (!workspace) return;
-  workspace
+  const view = row.closest("[data-investigation-view]");
+  if (!view) return;
+  view
     .querySelectorAll("[data-source-related]")
     .forEach((node) => node.removeAttribute("data-source-related"));
-  const findings = workspace.querySelector<HTMLElement>(
+  const findings = view.querySelector<HTMLElement>(
     "[data-investigation-findings-scroll]",
   );
-  const activity = workspace.querySelector<HTMLElement>(
+  const activity = view.querySelector<HTMLElement>(
     "[data-investigation-activity-scroll]",
   );
   if (!sourceId || !findings?.offsetParent || !activity?.offsetParent) return;
   const viewport = findings.getBoundingClientRect();
-  workspace
+  view
     .querySelectorAll<HTMLElement>("[data-evidence-source]")
     .forEach((card) => {
       if (

package/src/components/diagnose/investigationState.test.ts

@@ -9,6 +9,7 @@ import {
   investigationApplyAttemptVerified,
   investigationAssessmentNeedsCurrentStateVerification,
   investigationApplyRejectionIsDefinitive,
+  investigationFailureShown,
   investigationApplyTerminalNeedsClusterRefresh,
   investigationTurnWithTerminalEvent,
   investigationClosedEventIsLive,
@@ -618,7 +619,9 @@ describe("investigation action gating", () => {
     expect(
       canOfferInvestigationApply({ ...base, hasNewerEvidence: true }),
     ).toBe(false);
-    expect(canOfferInvestigationApply({ ...base, canApply: false })).toBe(false);
+    expect(canOfferInvestigationApply({ ...base, canApply: false })).toBe(
+      false,
+    );
     expect(
       canOfferInvestigationApply({ ...base, interactionsBlocked: true }),
     ).toBe(false);
@@ -1273,3 +1276,82 @@ describe("investigationHealthSignals twins across scopes", () => {
     ]);
   });
 });
+
+describe("investigationFailureShown", () => {
+  const quota = {
+    status: 402,
+    message: "This month's investigations are used up.",
+    code: "ai_quota_exhausted",
+    reason: "allowance_used_free",
+    action: "upgrade",
+  };
+  const none = {
+    actionError: null,
+    actionRefusal: null,
+    verificationError: null,
+    verificationRefusal: null,
+    savedVerificationError: null,
+    applyOutcomeUncertain: null,
+  };
+
+  it("shows a refused status-check retry over the failed verification it retries", () => {
+    const shown = investigationFailureShown({
+      ...none,
+      savedVerificationError: "The agent stopped before checking.",
+      verificationError: quota.message,
+      verificationRefusal: quota,
+    });
+    expect(shown.message).toBe(quota.message);
+    expect(shown.refusal).toBe(quota);
+  });
+
+  it("offers no action for a verification that ran and failed", () => {
+    const shown = investigationFailureShown({
+      ...none,
+      savedVerificationError: "The agent stopped before checking.",
+    });
+    expect(shown.message).toBe("The agent stopped before checking.");
+    expect(shown.refusal).toBeNull();
+  });
+
+  it("keeps an uncertain apply first and shows a newer refused follow-up beside it", () => {
+    const shown = investigationFailureShown({
+      ...none,
+      applyOutcomeUncertain: "Check current status before applying again.",
+      actionError: quota.message,
+      actionRefusal: quota,
+    });
+    expect(shown.message).toBe("Check current status before applying again.");
+    expect(shown.statusCheckError).toBe(
+      "Check current status before applying again.",
+    );
+    expect(shown.refusal).toBeNull();
+    expect(shown.followUp).toEqual({ message: quota.message, refusal: quota });
+  });
+
+  it("shows a refused follow-up beside a failed verification turn too", () => {
+    const shown = investigationFailureShown({
+      ...none,
+      savedVerificationError: "The agent stopped before checking.",
+      actionError: quota.message,
+      actionRefusal: quota,
+    });
+    expect(shown.message).toBe("The agent stopped before checking.");
+    expect(shown.followUp).toEqual({ message: quota.message, refusal: quota });
+  });
+
+  it("shows a refused follow-up with its action", () => {
+    const shown = investigationFailureShown({
+      ...none,
+      actionError: quota.message,
+      actionRefusal: quota,
+    });
+    expect(shown).toEqual({
+      verificationError: null,
+      statusCheckError: null,
+      message: quota.message,
+      refusal: quota,
+      followUp: null,
+    });
+  });
+});

package/src/components/diagnose/investigationState.ts

@@ -5,6 +5,7 @@ import { evidenceKindIsAdverse } from "./investigationEvidenceKinds";
 import {
   DiagnoseError,
   type DiagnoseStreamEvent,
+  type InvestigationRefusal,
   type RunSummary,
 } from "../../api/diagnose";
 import type { Turn } from "./parts";
@@ -123,6 +124,48 @@ export function investigationAssessmentNeedsCurrentStateVerification(input: {
   return input.localApplyAttemptAssessmentIdx >= input.currentAssessmentIdx;
 }
 
+// Which failure the activity pane shows, and the host refusal behind it. A
+// request's own error is newer than a saved verification turn's: it is cleared
+// when the next request starts and when a new verification turn streams.
+// A status warning keeps first place, since it is what stops a second Apply
+// before anyone checks; a newer failed follow-up shows beside it, not instead.
+export function investigationFailureShown(input: {
+  actionError: string | null;
+  actionRefusal: InvestigationRefusal | null;
+  verificationError: string | null;
+  verificationRefusal: InvestigationRefusal | null;
+  savedVerificationError: string | null;
+  applyOutcomeUncertain: string | null;
+}): {
+  verificationError: string | null;
+  statusCheckError: string | null;
+  message: string | null;
+  refusal: InvestigationRefusal | null;
+  followUp: { message: string; refusal: InvestigationRefusal | null } | null;
+} {
+  const verificationError =
+    input.verificationError || input.savedVerificationError;
+  const statusCheckError = verificationError || input.applyOutcomeUncertain;
+  if (statusCheckError) {
+    return {
+      verificationError,
+      statusCheckError,
+      message: statusCheckError,
+      refusal: input.verificationError ? input.verificationRefusal : null,
+      followUp: input.actionError
+        ? { message: input.actionError, refusal: input.actionRefusal }
+        : null,
+    };
+  }
+  return {
+    verificationError: null,
+    statusCheckError: null,
+    message: input.actionError,
+    refusal: input.actionError ? input.actionRefusal : null,
+    followUp: null,
+  };
+}
+
 export function investigationApplyRejectionIsDefinitive(
   error: unknown,
 ): error is DiagnoseError {

package/src/components/diagnose/launch.ts

@@ -43,12 +43,12 @@ export function buildLaunchCommand(
 ): string | null {
   if (!run.sessionId || run.status === "stale") return null;
 
-  // OpenCode terminal handoff needs a persistent MCP configuration outside the run workspace.
+  // OpenCode terminal handoff needs a persistent MCP configuration outside the run's working directory.
   if (run.agent === "opencode") return null;
 
   if (run.agent === "cursor-agent") {
     // Cursor's --resume is workspace-scoped, and Radar runs each investigation in a
-    // throwaway per-run workspace the user doesn't have — no command can reattach
+    // throwaway per-run working directory the user doesn't have — no command can reattach
     // both that session and Radar's MCP in the user's own terminal. So there's no
     // hand-off for Cursor; the in-panel investigation is self-contained.
     return null;

package/src/components/diagnose/useDisclosureReveal.ts

@@ -84,7 +84,7 @@ export function useDisclosureReveal<T extends HTMLElement>() {
       );
       // This component lives in a bounded Diagnose surface. Never fall back to
       // scrolling the document (or an overflow-hidden ancestor), which can move
-      // the entire workspace and expose blank space below it.
+      // the entire investigation surface and expose blank space below it.
       if (!scroller) return;
       // Expansion is delayed until Collapse has settled. If the reader scrolls
       // during that interval, their newer intent wins over the automatic reveal.

package/src/components/dock/BottomDock.tsx

@@ -53,7 +53,7 @@ function renderTabContent(tab: DockTab, isActive: boolean) {
 
   if (tab.type === 'local-terminal') {
     return (
-      <LocalTerminalTab isActive={isActive} initialCommand={tab.initialCommand} />
+      <LocalTerminalTab tabId={tab.id} title={tab.title} intendedContext={tab.localTerminalContext} isActive={isActive} initialCommand={tab.initialCommand} />
     )
   }
 

package/src/components/dock/DockContext.tsx

@@ -1,4 +1,8 @@
-// Re-exported from @skyhook-io/k8s-ui — source of truth is radar/packages/k8s-ui/src/components/dock/DockContext.tsx
+import { useCallback, useLayoutEffect, useRef } from 'react'
+import { useDock } from '@skyhook-io/k8s-ui'
+import { useConnection } from '../../context/ConnectionContext'
+import { useToast } from '../ui/Toast'
+
 export {
   DockProvider,
   useDock,
@@ -7,6 +11,27 @@ export {
   useOpenLogs,
   useOpenWorkloadLogs,
   useOpenNodeTerminal,
-  useOpenLocalTerminal,
 } from '@skyhook-io/k8s-ui'
 export type { DockTab, DockTabType, DockContextValue } from '@skyhook-io/k8s-ui'
+
+export function useOpenLocalTerminal() {
+  const { addTab } = useDock()
+  const { connection } = useConnection()
+  const { showToast } = useToast()
+  const contextRef = useRef({ context: connection.context, state: connection.state })
+  useLayoutEffect(() => { contextRef.current = { context: connection.context, state: connection.state } }, [connection.context, connection.state])
+
+  return useCallback((opts?: { initialCommand?: string; title?: string }) => {
+    const { context, state } = contextRef.current
+    if (!context && state !== 'disconnected') {
+      showToast('Waiting for a context. Try opening the terminal again.', { type: 'info' })
+      return
+    }
+    addTab({
+      type: 'local-terminal',
+      title: opts?.title || 'Terminal',
+      initialCommand: opts?.initialCommand,
+      localTerminalContext: context,
+    })
+  }, [addTab, showToast])
+}

package/src/components/dock/LocalTerminalContext.test.tsx

@@ -0,0 +1,210 @@
+// @vitest-environment jsdom
+import { act } from 'react'
+import { createRequire } from 'node:module'
+import { resolve } from 'node:path'
+import { createRoot, type Root } from 'react-dom/client'
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
+import { afterEach, beforeEach, expect, it, vi } from 'vitest'
+import { DockProvider, useDock, useOpenLocalTerminal as useSharedOpenLocalTerminal } from '../../../../packages/k8s-ui/src/components/dock/DockContext'
+import { useOpenLocalTerminal } from './DockContext'
+import { LocalTerminalTab } from './LocalTerminalTab'
+import { ToastProvider } from '../../../../packages/k8s-ui/src/components/ui/Toast'
+
+const state = vi.hoisted(() => ({ context: 'A', status: 'connected', mountTabs: true, open: null as null | (() => void) }))
+vi.mock('../../context/ConnectionContext', () => ({
+  useConnection: () => ({ connection: { context: state.context, state: state.status } }),
+}))
+vi.mock('@skyhook-io/k8s-ui', async () => ({
+  ...await import('../../../../packages/k8s-ui/src/components/dock/DockContext'),
+  ...await import('../../../../packages/k8s-ui/src/components/dock/LocalTerminalTab'),
+  ...await import('../../../../packages/k8s-ui/src/components/ui/ClusterName'),
+  ...await import('../../../../packages/k8s-ui/src/components/ui/Tooltip'),
+  ...await import('../../../../packages/k8s-ui/src/components/ui/Toast'),
+  ...await import('../../../../packages/k8s-ui/src/utils/context-name'),
+}))
+vi.mock('../../../../packages/k8s-ui/src/components/dock/terminalClipboard', () => ({ setupTerminalClipboard: () => () => {}, copyTerminalSelection: vi.fn() }))
+vi.mock('../../../../packages/k8s-ui/src/components/dock/TerminalClipboardToolbar', () => ({ TerminalClipboardToolbar: () => null }))
+vi.mock('../../../../packages/k8s-ui/src/components/dock/useMultilinePasteConfirm', () => ({ useMultilinePasteConfirm: () => ({ confirmPaste: vi.fn(), pasteDialog: null }) }))
+Object.assign(globalThis, { IS_REACT_ACT_ENVIRONMENT: true })
+const { Terminal } = createRequire(resolve(__dirname, '../../../../packages/k8s-ui/package.json'))('@xterm/xterm')
+
+class Socket {
+  static OPEN = 1
+  static instances: Socket[] = []
+  readyState = 0
+  onopen?: () => void
+  onclose?: () => void
+  onerror?: () => void
+  onmessage?: (event: { data: string }) => void
+  send = vi.fn()
+  constructor(public url: string) { Socket.instances.push(this) }
+  open() { this.readyState = 1; this.onopen?.() }
+  close() { this.readyState = 3; this.onclose?.() }
+  session(context: string) {
+    this.onmessage?.({ data: JSON.stringify({ type: 'session', context, kubeconfigIsolated: true }) })
+  }
+}
+let root: Root
+let element: HTMLDivElement
+let client: QueryClient
+function Harness() {
+  const { tabs } = useDock()
+  const open = useOpenLocalTerminal()
+  const sharedOpen = useSharedOpenLocalTerminal()
+  state.open ??= () => open({ title: 'Auth', initialCommand: 'auth-marker' })
+  return <>
+    <button onClick={() => open({ title: 'Auth', initialCommand: 'auth-marker' })}>Open</button>
+    <button onClick={() => sharedOpen()}>Open shared</button>
+    {state.mountTabs && tabs.map(tab => <section key={tab.id}>
+      <h2>{tab.title}</h2>
+      <LocalTerminalTab tabId={tab.id} title={tab.title} intendedContext={tab.localTerminalContext} initialCommand={tab.initialCommand} />
+    </section>)}
+  </>
+}
+async function render() {
+  await act(async () => root.render(<QueryClientProvider client={client}><ToastProvider><DockProvider><Harness /></DockProvider></ToastProvider></QueryClientProvider>))
+}
+async function click(text: string, section: ParentNode = element) {
+  await act(async () => [...section.querySelectorAll<HTMLButtonElement>('button')].find(button => button.textContent?.trim() === text)!.click())
+}
+beforeEach(() => {
+  vi.spyOn(Terminal.prototype, 'open').mockImplementation(() => {})
+  state.context = 'A'
+  state.status = 'connected'
+  state.mountTabs = true
+  state.open = null
+  Socket.instances = []
+  vi.useFakeTimers()
+  vi.stubGlobal('WebSocket', Socket)
+  vi.stubGlobal('ResizeObserver', class { observe() {} disconnect() {} })
+  vi.stubGlobal('requestAnimationFrame', () => 0)
+  client = new QueryClient({ defaultOptions: { queries: { retry: false } } })
+  element = document.createElement('div')
+  document.body.appendChild(element)
+  root = createRoot(element)
+})
+afterEach(async () => {
+  await act(async () => root.unmount())
+  client.clear()
+  element.remove()
+  vi.unstubAllGlobals()
+  vi.restoreAllMocks()
+  vi.useRealTimers()
+})
+
+it('captures A at the action before mounting, and keeps first delivery pending while B is selected', async () => {
+  state.mountTabs = false
+  await render()
+  await click('Open')
+  state.context = 'B'
+  state.mountTabs = true
+  await render()
+  expect(Socket.instances).toHaveLength(0)
+  expect(element.textContent).toContain('Requested:A')
+  expect(element.querySelector('button[aria-label="New terminal for B"]')).not.toBeNull()
+  expect([...element.querySelectorAll('button')].find(b => b.textContent?.trim() === 'Reconnect')?.disabled).toBe(true)
+  expect(element.textContent).toContain('Different context')
+  state.context = 'A'
+  await render()
+  await click('Reconnect')
+  expect(new URL(Socket.instances[0].url).searchParams.get('expectedContext')).toBe('A')
+  await act(async () => { Socket.instances[0].open(); Socket.instances[0].session('A'); vi.advanceTimersByTime(300) })
+  expect(Socket.instances[0].send.mock.calls.filter(([data]) => JSON.parse(data).type === 'input')).toEqual([[JSON.stringify({ type: 'input', data: 'auth-marker\n' })]])
+})
+
+it('preserves A through a refused reconnect, creates B independently, and reconnects A without replay', async () => {
+  await render()
+  await click('Open')
+  await act(async () => { Socket.instances[0].open(); Socket.instances[0].session('A'); vi.advanceTimersByTime(300) })
+  state.context = 'B'
+  await render()
+  expect(Socket.instances[0].readyState).toBe(1)
+  await act(async () => Socket.instances[0].close())
+  await click('Reconnect')
+  expect(Socket.instances).toHaveLength(1)
+  expect(element.querySelector('h2')?.textContent).toBe('Auth · A')
+  await click('New terminal')
+  expect(new URL(Socket.instances[1].url).searchParams.get('expectedContext')).toBe('B')
+  await act(async () => { Socket.instances[1].open(); Socket.instances[1].session('B') })
+  expect([...element.querySelectorAll('h2')].map(e => e.textContent)).toEqual(['Auth · A', 'Terminal · B'])
+  state.context = 'A'
+  await render()
+  await click('Reconnect', element.querySelector('section')!)
+  await act(async () => { Socket.instances[2].open(); Socket.instances[2].session('A'); vi.advanceTimersByTime(300) })
+  expect(new URL(Socket.instances[2].url).searchParams.get('expectedContext')).toBe('A')
+  expect(Socket.instances.flatMap(s => s.send.mock.calls).filter(([data]) => JSON.parse(data).type === 'input')).toHaveLength(1)
+})
+
+it('refreshes connection state after handshake failure and can retry without consuming the command', async () => {
+  const refresh = vi.spyOn(client, 'invalidateQueries')
+  await render()
+  await click('Open')
+  await act(async () => { Socket.instances[0].onerror?.(); Socket.instances[0].close() })
+  expect(refresh).toHaveBeenCalledWith({ queryKey: ['connection-status'] })
+  state.context = 'B'
+  await render()
+  expect([...element.querySelectorAll('button')].find(b => b.textContent?.trim() === 'Retry')?.disabled).toBe(true)
+  await click('Retry')
+  expect(Socket.instances).toHaveLength(1)
+  state.context = 'A'
+  await render()
+  await click('Retry')
+  await act(async () => { Socket.instances[1].open(); Socket.instances[1].session('A'); vi.advanceTimersByTime(300) })
+  expect(Socket.instances[1].send.mock.calls.filter(([data]) => JSON.parse(data).type === 'input')).toHaveLength(1)
+})
+
+it('explains unknown-context refusal and lets an earlier callback read the latest committed context', async () => {
+  state.context = ''
+  state.status = 'connecting'
+  await render()
+  await click('Open')
+  expect(element.querySelector('section')).toBeNull()
+  expect(element.textContent).toContain('Waiting for a context. Try opening the terminal again.')
+  expect(Socket.instances).toHaveLength(0)
+  state.context = 'A & B/qualified'
+  await render()
+  expect(Socket.instances).toHaveLength(0)
+  await act(async () => state.open!())
+  expect(new URL(Socket.instances[0].url).searchParams.get('expectedContext')).toBe('A & B/qualified')
+})
+
+it('gives a shared-hook tab without an intent an explicit state and a fresh context-aware action', async () => {
+  await render()
+  await click('Open shared')
+  expect(element.textContent).toContain('No context selected')
+  expect(Socket.instances).toHaveLength(0)
+  expect([...element.querySelectorAll('button')].find(b => b.textContent?.trim() === 'Reconnect')?.disabled).toBe(true)
+  await click('New terminal')
+  expect(new URL(Socket.instances[0].url).searchParams.get('expectedContext')).toBe('A')
+})
+
+it('preserves the no-kubeconfig recovery shell with an explicit empty intent, then blocks reconnect under A', async () => {
+  state.context = ''
+  state.status = 'disconnected'
+  await render()
+  await click('Open')
+  const query = new URL(Socket.instances[0].url).searchParams
+  expect(query.has('expectedContext')).toBe(true)
+  expect(query.get('expectedContext')).toBe('')
+  await act(async () => { Socket.instances[0].open(); Socket.instances[0].onmessage?.({ data: JSON.stringify({ type: 'session', context: '', kubeconfigIsolated: false }) }); vi.advanceTimersByTime(300) })
+  expect(element.textContent).toContain('Context not confirmed')
+  expect(Socket.instances[0].send.mock.calls.filter(([data]) => JSON.parse(data).type === 'input')).toHaveLength(1)
+  state.context = 'A'
+  state.status = 'connected'
+  await render()
+  expect(Socket.instances[0].readyState).toBe(1)
+  await act(async () => Socket.instances[0].close())
+  expect([...element.querySelectorAll('button')].find(b => b.textContent?.trim() === 'Reconnect')?.disabled).toBe(true)
+  await click('New terminal')
+  expect(new URL(Socket.instances[1].url).searchParams.get('expectedContext')).toBe('A')
+})
+
+it('opens a recovery shell for the known context when startup reports a config error', async () => {
+  state.context = 'production@secondary'
+  state.status = 'disconnected'
+  await render()
+  await click('Open')
+  expect(new URL(Socket.instances[0].url).searchParams.get('expectedContext')).toBe('production@secondary')
+  await act(async () => { Socket.instances[0].open(); Socket.instances[0].session('production@secondary'); vi.advanceTimersByTime(300) })
+  expect(Socket.instances[0].send.mock.calls.filter(([data]) => JSON.parse(data).type === 'input')).toHaveLength(1)
+})

package/src/components/dock/LocalTerminalTab.test.tsx

@@ -0,0 +1,122 @@
+// @vitest-environment jsdom
+import { act, useEffect } from 'react'
+import { createRoot, type Root } from 'react-dom/client'
+import { afterEach, beforeEach, expect, it, vi } from 'vitest'
+import { DockProvider, useDock } from '../../../../packages/k8s-ui/src/components/dock/DockContext'
+import type { LocalTerminalTabProps } from '../../../../packages/k8s-ui/src/components/dock/LocalTerminalTab'
+import { LocalTerminalTab } from './LocalTerminalTab'
+import { ToastProvider } from '../../../../packages/k8s-ui/src/components/ui/Toast'
+
+const state = vi.hoisted(() => ({
+  context: 'staging',
+  firstContext: 'production',
+  props: new Map<string, LocalTerminalTabProps>(),
+}))
+vi.mock('../../context/ConnectionContext', () => ({
+  useConnection: () => ({ connection: { context: state.context } }),
+}))
+vi.mock('@tanstack/react-query', () => ({
+  useQueryClient: () => ({ invalidateQueries: vi.fn() }),
+}))
+vi.mock('@skyhook-io/k8s-ui', async () => {
+  const dock = await import('../../../../packages/k8s-ui/src/components/dock/DockContext')
+  const { ClusterName } = await import('../../../../packages/k8s-ui/src/components/ui/ClusterName')
+  const { Tooltip } = await import('../../../../packages/k8s-ui/src/components/ui/Tooltip')
+  const { parseContextName } = await import('../../../../packages/k8s-ui/src/utils/context-name')
+  const { useToast } = await import('../../../../packages/k8s-ui/src/components/ui/Toast')
+  return {
+    ...dock, ClusterName, Tooltip, parseContextName, useToast,
+    LocalTerminalTab: (props: LocalTerminalTabProps) => {
+      state.props.set(props.initialCommand!, props)
+      return <div data-testid="terminal-toolbar">{props.toolbarExtra}</div>
+    },
+  }
+})
+Object.assign(globalThis, { IS_REACT_ACT_ENVIRONMENT: true })
+
+let root: Root
+let element: HTMLDivElement
+function Harness() {
+  const { tabs, addTab } = useDock()
+  useEffect(() => {
+    addTab({ type: 'local-terminal', title: 'Terminal', initialCommand: 'first', localTerminalContext: state.firstContext })
+    addTab({ type: 'local-terminal', title: 'Auth', initialCommand: 'second', localTerminalContext: 'staging' })
+  }, [addTab])
+  return <>{tabs.map(tab => (
+    <section key={tab.id}>
+      <h2 data-tooltip={tab.titleTooltip}>{tab.title}</h2>
+      <LocalTerminalTab tabId={tab.id} title={tab.title} intendedContext={tab.localTerminalContext!} initialCommand={tab.initialCommand} />
+    </section>
+  ))}</>
+}
+async function render() {
+  await act(async () => root.render(<ToastProvider><DockProvider><Harness /></DockProvider></ToastProvider>))
+}
+beforeEach(() => {
+  state.context = 'staging'
+  state.firstContext = 'production'
+  state.props.clear()
+  element = document.createElement('div')
+  document.body.appendChild(element)
+  root = createRoot(element)
+  vi.stubGlobal('ResizeObserver', class { observe() {} disconnect() {} })
+})
+afterEach(async () => {
+  await act(async () => root.unmount())
+  element.remove()
+  vi.unstubAllGlobals()
+})
+
+it('waits for server metadata, labels each tab independently, and notices a UI switch', async () => {
+  await render()
+  expect(element.textContent).toContain('Requested:production')
+  await act(async () => {
+    state.props.get('first')!.onSessionInfo!({ context: 'production', kubeconfigIsolated: true })
+    state.props.get('second')!.onSessionInfo!({ context: 'staging', kubeconfigIsolated: true })
+  })
+  expect([...element.querySelectorAll('h2')].map(el => el.textContent)).toEqual(['Terminal · production', 'Auth · staging'])
+  expect(element.querySelector('[role="status"]')?.getAttribute('aria-label')).toContain('This terminal is for production')
+  expect(element.querySelector('[role="status"]')?.closest('[data-testid="terminal-toolbar"]')).not.toBeNull()
+  state.context = 'production'
+  await render()
+  const sections = element.querySelectorAll('section')
+  expect(sections[0].querySelector('[role="status"]')).toBeNull()
+  expect(sections[0].textContent).toContain('Opened for:production')
+  expect(sections[1].querySelector('[role="status"]')?.getAttribute('aria-label')).toContain('This terminal is for staging')
+  await act(async () => sections[1].querySelector<HTMLButtonElement>('button')!.click())
+  expect([...element.querySelectorAll('h2')].map(el => el.textContent)).toEqual(['Terminal · production', 'Auth · staging', 'Terminal'])
+})
+
+it('marks fallback sessions unconfirmed and replaces labels for a newly connected shell', async () => {
+  await render()
+  await act(async () => state.props.get('second')!.onSessionInfo!({ context: 'staging', kubeconfigIsolated: true }))
+  await act(async () => state.props.get('second')!.onSessionInfo!({ context: '', kubeconfigIsolated: false }))
+  const section = element.querySelectorAll('section')[1]
+  expect(section.textContent).toContain('Auth · context not confirmed')
+  expect(section.textContent).toContain('Context not confirmed')
+  expect(section.querySelector('[role="status"]')).toBeNull()
+  state.context = 'production'
+  await render()
+  expect(section.querySelector('[role="status"]')?.textContent).toContain('Requested context differs')
+  expect(section.querySelector('[role="status"]')?.getAttribute('aria-label')).toContain('Requested for staging; kubeconfig not confirmed')
+  expect(section.querySelector('[role="status"]')?.getAttribute('aria-label')).not.toContain('This terminal is for staging')
+  await act(async () => state.props.get('second')!.onSessionInfo!(null))
+  expect(section.querySelector('h2')?.textContent).toBe('Auth · context not confirmed')
+  await act(async () => state.props.get('second')!.onSessionInfo!({ context: 'staging', kubeconfigIsolated: true }))
+  expect(section.querySelector('h2')?.textContent).toBe('Auth · staging')
+})
+
+it('compares full contexts even when both have the same short cluster name', async () => {
+  state.context = 'gke_project-b_us-east1_production'
+  state.firstContext = 'gke_project-a_us-east1_production'
+  await render()
+  await act(async () => state.props.get('first')!.onSessionInfo!({ context: 'gke_project-a_us-east1_production', kubeconfigIsolated: true }))
+  expect(element.querySelector('h2')?.textContent).toBe('Terminal · production')
+  expect(element.querySelector('h2')?.getAttribute('data-tooltip')).toBe('gke_project-a_us-east1_production')
+  const message = element.querySelector('[role="status"]')?.getAttribute('aria-label')
+  expect(message).toContain('gke_project-a_us-east1_production')
+  expect(message).toContain('gke_project-b_us-east1_production')
+  state.context = ''
+  await render()
+  expect(element.querySelector('[role="status"]')).toBeNull()
+})