feat: add turn streaming and inspector updates

frontend/packages/inspector/src/components/chat/ChatSetup.tsx

@@ -1,60 +1,53 @@
-import { PauseCircle, PlayCircle } from "lucide-react";
 import type { AgentModeInfo } from "sandbox-agent";
 
 const ChatSetup = ({
-  agentId,
+  agentLabel,
   agentMode,
   permissionMode,
   model,
   variant,
-  streamMode,
-  polling,
-  availableAgents,
   activeModes,
   currentAgentVersion,
-  onAgentChange,
+  hasSession,
+  modesLoading,
+  modesError,
   onAgentModeChange,
   onPermissionModeChange,
   onModelChange,
-  onVariantChange,
-  onStreamModeChange,
-  onToggleStream
+  onVariantChange
 }: {
-  agentId: string;
+  agentLabel: string;
   agentMode: string;
   permissionMode: string;
   model: string;
   variant: string;
-  streamMode: "poll" | "sse";
-  polling: boolean;
-  availableAgents: string[];
   activeModes: AgentModeInfo[];
   currentAgentVersion?: string | null;
-  onAgentChange: (value: string) => void;
+  hasSession: boolean;
+  modesLoading: boolean;
+  modesError: string | null;
   onAgentModeChange: (value: string) => void;
   onPermissionModeChange: (value: string) => void;
   onModelChange: (value: string) => void;
   onVariantChange: (value: string) => void;
-  onStreamModeChange: (value: "poll" | "sse") => void;
-  onToggleStream: () => void;
 }) => {
+  const agentVersionLabel = currentAgentVersion
+    ? `${agentLabel} v${currentAgentVersion}`
+    : agentLabel;
   return (
     <div className="setup-row">
-      <select className="setup-select" value={agentId} onChange={(e) => onAgentChange(e.target.value)} title="Agent">
-        {availableAgents.map((id) => (
-          <option key={id} value={id}>
-            {id}
-          </option>
-        ))}
-      </select>
-
       <select
         className="setup-select"
         value={agentMode}
         onChange={(e) => onAgentModeChange(e.target.value)}
         title="Mode"
+        disabled={!hasSession || modesLoading || Boolean(modesError)}
       >
-        {activeModes.length > 0 ? (
+        {modesLoading ? (
+          <option value="">Loading modes...</option>
+        ) : modesError ? (
+          <option value="">{modesError}</option>
+        ) : activeModes.length > 0 ? (
           activeModes.map((mode) => (
             <option key={mode.id} value={mode.id}>
               {mode.name || mode.id}
@@ -70,6 +63,7 @@ const ChatSetup = ({
         value={permissionMode}
         onChange={(e) => onPermissionModeChange(e.target.value)}
         title="Permission Mode"
+        disabled={!hasSession}
       >
         <option value="default">Default</option>
         <option value="plan">Plan</option>
@@ -82,6 +76,7 @@ const ChatSetup = ({
         onChange={(e) => onModelChange(e.target.value)}
         placeholder="Model"
         title="Model"
+        disabled={!hasSession}
       />
 
       <input
@@ -90,40 +85,12 @@ const ChatSetup = ({
         onChange={(e) => onVariantChange(e.target.value)}
         placeholder="Variant"
         title="Variant"
+        disabled={!hasSession}
       />
 
-      <div className="setup-stream">
-        <select
-          className="setup-select-small"
-          value={streamMode}
-          onChange={(e) => onStreamModeChange(e.target.value as "poll" | "sse")}
-          title="Stream Mode"
-        >
-          <option value="poll">Poll</option>
-          <option value="sse">SSE</option>
-        </select>
-        <button
-          className={`setup-stream-btn ${polling ? "active" : ""}`}
-          onClick={onToggleStream}
-          title={polling ? "Stop streaming" : "Start streaming"}
-        >
-          {polling ? (
-            <>
-              <PauseCircle size={14} />
-              <span>Pause</span>
-            </>
-          ) : (
-            <>
-              <PlayCircle size={14} />
-              <span>Resume</span>
-            </>
-          )}
-        </button>
-      </div>
-
-      {currentAgentVersion && (
-        <span className="setup-version" title="Installed version">
-          v{currentAgentVersion}
+      {hasSession && (
+        <span className="setup-version" title="Session agent">
+          {agentVersionLabel}
         </span>
       )}
     </div>