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:
parent
bd79b58e78
commit
f7c8d4c14c
2 changed files with 47 additions and 19 deletions
|
|
@ -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 ? (
|
||||||
label="model"
|
<Badge label="model" value={header.model} title={modelTitle} />
|
||||||
value={header.model}
|
) : (
|
||||||
title={
|
<BadgePopover
|
||||||
header.resolved_model
|
label="model"
|
||||||
? `resolved to ${header.resolved_model}`
|
value={header.model}
|
||||||
: undefined
|
title={`${modelTitle ? modelTitle + ". " : ""}Click for the inference settings`}
|
||||||
}
|
popoverLabel={`${agent} inference settings`}
|
||||||
/>
|
>
|
||||||
)}
|
<AgentInference agent={agent} />
|
||||||
{withModel && (
|
</BadgePopover>
|
||||||
<Badge
|
))}
|
||||||
label="effort"
|
{withModel &&
|
||||||
value={header.effort}
|
(agent === undefined ? (
|
||||||
title={`set by: ${header.effort_source}`}
|
<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 && (
|
{ctx !== null && (
|
||||||
<Badge
|
<Badge
|
||||||
label="ctx"
|
label="ctx"
|
||||||
|
|
|
||||||
|
|
@ -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}
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue