Watch
0
0
Fork
You've already forked hyperhive
0

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.
This commit is contained in:
iris 2026-11-12 09:13:16 +01:00 • committed by mara
commit f7c8d4c14c
2 changed files with 47 additions and 19 deletions

View file

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

View file

@ -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 && ( {header && subagent === undefined && (
<CancelTurnBadge <CancelTurnBadge
agentName={agentName} agentName={agentName}