swarm-ui: the model and effort badges on an agent's terminal open its inference settings

Clicking either opens the settings in a popover under the badge, the same panel the agent's card has. A subagent's terminal keeps plain badges.

frontend/packages/swarm-ui/src/agent/state/StateBadges.tsx

@@ -1,4 +1,6 @@
 import { Badge, type BadgeTone } from "@hive/shared/badge.js";
+import { BadgePopover } from "../../ui/badge-popover/BadgePopover.js";
+import { AgentInference } from "../detail/AgentInference.js";
 import { RelativeTime } from "../../ui/relative-time/RelativeTime.js";
 import {
   useSwarmAgentStateStream,
@@ -46,13 +48,20 @@ export function StateBadges({
   ctx,
   cost,
   withModel = true,
+  agent,
 }: {
   header: NonNullable<ReturnType<typeof useSwarmAgentStateStream>["header"]>;
   ctx: number | null;
   cost: number | null;
   // Off where the model is shown beside them, as in the details table.
   withModel?: boolean;
+  // The agent whose settings the model and effort badges open in a popover
+  // when clicked. Omitted: the badges only display.
+  agent?: string;
 }) {
+  const modelTitle = header.resolved_model
+    ? `resolved to ${header.resolved_model}`
+    : undefined;
   return (
     <>
       <Badge
@@ -75,24 +84,36 @@ export function StateBadges({
       {header.agent_state !== "up" && (
         <Badge tone="warning" value={header.agent_state} />
       )}
-      {withModel && (
-        <Badge
-          label="model"
-          value={header.model}
-          title={
-            header.resolved_model
-              ? `resolved to ${header.resolved_model}`
-              : undefined
-          }
-        />
-      )}
-      {withModel && (
-        <Badge
-          label="effort"
-          value={header.effort}
-          title={`set by: ${header.effort_source}`}
-        />
-      )}
+      {withModel &&
+        (agent === undefined ? (
+          <Badge label="model" value={header.model} title={modelTitle} />
+        ) : (
+          <BadgePopover
+            label="model"
+            value={header.model}
+            title={`${modelTitle ? modelTitle + ". " : ""}Click for the inference settings`}
+            popoverLabel={`${agent} inference settings`}
+          >
+            <AgentInference agent={agent} />
+          </BadgePopover>
+        ))}
+      {withModel &&
+        (agent === undefined ? (
+          <Badge
+            label="effort"
+            value={header.effort}
+            title={`set by: ${header.effort_source}`}
+          />
+        ) : (
+          <BadgePopover
+            label="effort"
+            value={header.effort}
+            title={`set by: ${header.effort_source}. Click for the inference settings`}
+            popoverLabel={`${agent} inference settings`}
+          >
+            <AgentInference agent={agent} />
+          </BadgePopover>
+        ))}
       {ctx !== null && (
         <Badge
           label="ctx"

frontend/packages/swarm-ui/src/agent/terminal/AgentTermPreview.tsx

@@ -145,7 +145,14 @@ export function AgentTermPreview({
                 }}
               />
             )}
-            {header && <StateBadges header={header} ctx={ctx} cost={cost} />}
+            {header && (
+              <StateBadges
+                header={header}
+                ctx={ctx}
+                cost={cost}
+                agent={subagent === undefined ? agentName : undefined}
+              />
+            )}
             {header && subagent === undefined && (
               <CancelTurnBadge
                 agentName={agentName}