705160c0fd
The small preview in the detail panel keeps only the connection badge and expand, and no longer follows the agent's state stream; the full terminal tab keeps all its badges. The table gets a state row with the turn state, a paused badge, and the context and billed tokens (not the model, which the inference row shows). The preview's top padding drops to one badge row, and the showHeaderBadges prop goes since the full-tab mount is now the only one with badges.
37 lines
1.2 KiB
TypeScript
37 lines
1.2 KiB
TypeScript
// <AgentStateRow> — an agent's turn state, whether it is paused, and the
|
|
// tokens in its context and billed, as the details table's "state" row. The
|
|
// terminal preview below the table carries no badges of its own (the full
|
|
// terminal tab does), so this is where the panel says what the agent is doing.
|
|
// Follows the agent's state stream, which announces on a change and once a
|
|
// minute, so the row reads "waiting" until the first report lands.
|
|
import {
|
|
StateBadges,
|
|
termPaths,
|
|
tokenTotal,
|
|
} from "../terminal/AgentTermPreview.js";
|
|
import { useSwarmAgentStateStream } from "../terminal/useSwarmAgentStateStream.js";
|
|
import "./AgentStateRow.css";
|
|
|
|
export function AgentStateRow({ agent }: { agent: string }) {
|
|
const { header } = useSwarmAgentStateStream(termPaths(agent).state);
|
|
if (!header) {
|
|
return (
|
|
<span
|
|
class="ui-agent-state-waiting"
|
|
title="the agent reports its state when it changes, and once a minute"
|
|
>
|
|
waiting for the agent's report…
|
|
</span>
|
|
);
|
|
}
|
|
return (
|
|
<div class="ui-agent-state-row">
|
|
<StateBadges
|
|
header={header}
|
|
ctx={tokenTotal(header.ctx_usage)}
|
|
cost={tokenTotal(header.cost_usage)}
|
|
withModel={false}
|
|
/>
|
|
</div>
|
|
);
|
|
}
|