style(web): drop redundant when/tool labels in tool group accordion

The accordion row already shows elapsed/duration and the group header
already names the tool, so the When and Tool fields inside the expanded
event detail are redundant. Keep them for the standalone single-event
panel.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Bryan Helmkamp 2026-05-07 22:39:21 -07:00
parent 927ed419f7
commit be908cd0d5
No known key found for this signature in database

View file

@ -697,7 +697,15 @@ function JsonBlock({ value }: { value: string }) {
);
}
function EventDetails({ turn, runStart }: { turn: TurnType; runStart: string | undefined }) {
function EventDetails({
turn,
runStart,
hideMeta = false,
}: {
turn: TurnType;
runStart: string | undefined;
hideMeta?: boolean;
}) {
const elapsed = formatElapsed(turn.ts, runStart);
const absolute = (() => {
const ms = Date.parse(turn.ts);
@ -707,9 +715,11 @@ function EventDetails({ turn, runStart }: { turn: TurnType; runStart: string | u
return (
<div className="space-y-5">
<DetailField label="When" mono>
{elapsed ? `${elapsed} · ${absolute}` : absolute}
</DetailField>
{!hideMeta && (
<DetailField label="When" mono>
{elapsed ? `${elapsed} · ${absolute}` : absolute}
</DetailField>
)}
{(turn.kind === "system" || turn.kind === "assistant") && (
<DetailField label="Content">
@ -719,10 +729,12 @@ function EventDetails({ turn, runStart }: { turn: TurnType; runStart: string | u
{turn.kind === "tool" && (
<>
<DetailField label="Tool" mono>
{humanizeToolName(turn.toolName)}{" "}
<span className="text-fg-muted">({turn.toolName})</span>
</DetailField>
{!hideMeta && (
<DetailField label="Tool" mono>
{humanizeToolName(turn.toolName)}{" "}
<span className="text-fg-muted">({turn.toolName})</span>
</DetailField>
)}
<DetailField label="Input">
<JsonBlock value={turn.input} />
</DetailField>
@ -1058,7 +1070,7 @@ function ToolGroupDetails({
/>
{expandedIndex === i && (
<div className="bg-overlay/50 px-5 py-4">
<EventDetails turn={child.turn} runStart={runStart} />
<EventDetails turn={child.turn} runStart={runStart} hideMeta />
</div>
)}
</li>