v0.7.1: fix console blank page (span_ids) + UI rename (Agent Traces / HTTP Logs)

CHANGELOG.md

@@ -6,6 +6,27 @@ adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
 ## [Unreleased]
 
+## [0.7.1] — 2026-06-24
+
+### Fixed
+
+- **Console blank-page regression from the v0.7.0 OTel rename.** The traces API
+  serializes `span_ids` (renamed from `call_ids`), but the `AgentTurnDetail`
+  type and the `agent-breakdown` component still read `call_ids`, so opening an
+  agent trace detail threw `TypeError: undefined is not an object (evaluating
+  '…call_ids.length')` and — with no React error boundary — blanked the entire
+  console. Aligned the type + component to `span_ids` and guarded the access so
+  a missing field degrades to "0 calls" instead of a white screen.
+
+### Changed
+
+- **UI vocabulary aligned with the OTel model.** Renamed user-visible labels:
+  "Agent Turns" → "Agent Traces" and "HTTP Exchanges" → "HTTP Logs" (nav, detail
+  titles, the overview gauge, the "Trace ID" metadata row, empty/error states,
+  the SFT export tooltip, and the distribution chart). A trace is one agent
+  interaction; a step within it remains a turn/span. Backend metric names, route
+  paths, and code identifiers are unchanged.
+
 ## [0.7.0] — 2026-06-24
 
 ### Added

VERSION

@@ -1 +1 @@
-0.7.0
+0.7.1

console/package.json

@@ -1,7 +1,7 @@
 {
   "name": "console",
   "private": true,
-  "version": "0.7.0",
+  "version": "0.7.1",
   "type": "module",
   "scripts": {
     "dev": "vite",

console/src/components/charts/agent-distribution-chart.tsx

@@ -62,7 +62,7 @@ export function AgentDistributionChart({ rows }: Props) {
         />
         <Tooltip
           formatter={(value, name) => {
-            if (name === "turns") return [formatNumber(Number(value)), "Turns"]
+            if (name === "turns") return [formatNumber(Number(value)), "Traces"]
             return [String(value), String(name)]
           }}
           labelFormatter={(_label, payload) =>

console/src/components/layout/sidebar.tsx

@@ -33,9 +33,9 @@ const observeItems = [
 const exploreItems = [
   { to: "/services", icon: Server, label: "Services" },
   { to: "/agent-sessions", icon: MessageSquare, label: "Agent Sessions" },
-  { to: "/agent-turns", icon: MessagesSquare, label: "Agent Turns" },
+  { to: "/agent-turns", icon: MessagesSquare, label: "Agent Traces" },
   { to: "/llm-calls", icon: Sparkles, label: "LLM Calls" },
-  { to: "/http-exchanges", icon: Network, label: "HTTP Exchanges" },
+  { to: "/http-exchanges", icon: Network, label: "HTTP Logs" },
 ]
 
 const THEME_META: Record<ThemeMode, { icon: typeof Moon; label: string; next: ThemeMode }> = {

console/src/components/trajectory-actions.tsx

@@ -49,7 +49,7 @@ export function DownloadTrajectoryButton({
 }
 
 /** Labeled batch-export button with inline written/skipped feedback
- * (Agent Turns list — exports every turn matching the current filters). */
+ * (Agent Traces list — exports every trace matching the current filters). */
 export function BatchExportButton({
   url,
   fallbackName = "trajectories.jsonl",
@@ -82,7 +82,7 @@ export function BatchExportButton({
             setBusy(false)
           }
         }}
-        title="Export every turn matching the current filters as SFT trajectories (.jsonl)"
+        title="Export every trace matching the current filters as SFT trajectories (.jsonl)"
         className={cn(
           "inline-flex items-center gap-1.5 rounded-md border border-border bg-background px-2.5 py-1 text-xs font-medium text-foreground transition-colors hover:bg-muted disabled:opacity-50",
           className,

console/src/components/turn-detail/agent-breakdown.tsx

@@ -38,8 +38,8 @@ export function AgentBreakdown({ turn, calls }: Props) {
 
         <div className="text-muted-foreground">Tool calls</div>
         <div>
-          {turn.tool_call_total} total across {turn.call_ids.length} call
-          {turn.call_ids.length === 1 ? "" : "s"}
+          {turn.tool_call_total} total across {turn.span_ids?.length ?? 0} call
+          {(turn.span_ids?.length ?? 0) === 1 ? "" : "s"}
         </div>
 
         {turn.suspicious_skills.length > 0 && (

console/src/components/turn-detail/metadata-popover.tsx

@@ -9,7 +9,7 @@ interface Props {
 
 export function MetadataPopover({ turn, onClose }: Props) {
   const rows: [string, string][] = [
-    ["Turn ID", turn.turn_id],
+    ["Trace ID", turn.turn_id],
     ["Source", turn.source_id || "—"],
     ["Session ID", turn.session_id],
     ["Agent", turn.agent_kind],

console/src/components/turn-detail/top-bar.tsx

@@ -19,7 +19,7 @@ export function TopBar({ turn, onClose }: Props) {
   const [metaOpen, setMetaOpen] = useState(false)
   return (
     <div className="relative flex h-10 shrink-0 items-center justify-between border-b border-border px-4">
-      <h2 className="text-sm font-semibold">Agent Turn Detail</h2>
+      <h2 className="text-sm font-semibold">Agent Trace Detail</h2>
       <div className="flex items-center gap-3 text-xs text-muted-foreground">
         <span>{turn.agent_kind}</span>
         <span>·</span>

console/src/pages/agent-session-detail.tsx

@@ -70,9 +70,9 @@ export function AgentSessionDetailPage() {
             <Loader2 className="size-5 animate-spin text-muted-foreground" />
           </div>
         ) : errorTurns ? (
-          <div className="py-10 text-center text-sm text-destructive">Failed to load turns</div>
+          <div className="py-10 text-center text-sm text-destructive">Failed to load traces</div>
         ) : turns.length === 0 ? (
-          <div className="py-10 text-center text-sm text-muted-foreground">No turns in this session</div>
+          <div className="py-10 text-center text-sm text-muted-foreground">No traces in this session</div>
         ) : (
           turns.map((t) => (
             <TurnBlock
@@ -90,7 +90,7 @@ export function AgentSessionDetailPage() {
               disabled={isFetchingNextPage}
               className="rounded border border-border bg-background px-4 py-1.5 text-sm text-muted-foreground transition-colors hover:bg-muted hover:text-foreground"
             >
-              {isFetchingNextPage ? "Loading…" : "Load older turns"}
+              {isFetchingNextPage ? "Loading…" : "Load older traces"}
             </button>
           </div>
         )}

console/src/pages/http-exchange-detail-panel.tsx

@@ -108,7 +108,7 @@ export function HttpExchangeDetailPanel({ id, onClose, onNavigate, hasPrev, hasN
       <div className="fixed top-0 right-0 z-50 flex h-full w-[60%] min-w-[480px] flex-col border-l border-border bg-background shadow-xl animate-in slide-in-from-right duration-200">
         {/* Header */}
         <div className="flex shrink-0 items-center justify-between border-b border-border px-4 py-3">
-          <h2 className="text-sm font-semibold">HTTP Exchange Detail</h2>
+          <h2 className="text-sm font-semibold">HTTP Log Detail</h2>
           <div className="flex items-center gap-1">
             {detail && (
               <ExtractPacketsButton anchor={{ type: "http_exchange", row: detail }} />

console/src/pages/http-exchanges.tsx

@@ -300,13 +300,13 @@ export function HttpExchangesPage() {
             ) : isError ? (
               <tr>
                 <td colSpan={columns.length} className="py-20 text-center text-destructive">
-                  Failed to load http exchanges: {error?.message}
+                  Failed to load HTTP logs: {error?.message}
                 </td>
               </tr>
             ) : items.length === 0 ? (
               <tr>
                 <td colSpan={columns.length} className="py-20 text-center text-muted-foreground">
-                  No HTTP exchanges in the selected time range
+                  No HTTP logs in the selected time range
                 </td>
               </tr>
             ) : (

console/src/pages/overview.tsx

@@ -156,14 +156,14 @@ export function OverviewPage() {
         </div>
         <div className="rounded-lg border border-border/50 bg-card p-4 card-elevated">
           <h3 className="mb-3 text-sm font-medium">
-            Active Agent Turns
+            Active Agent Traces
             <span className="ml-2 text-xs font-normal text-muted-foreground">
-              in-progress agent turns (registry size)
+              in-progress agent traces (registry size)
             </span>
           </h3>
           <ActiveGaugeChart
             metric="agent_turns_open"
-            label="Open turns"
+            label="Open traces"
             color="#10b981"
             data={gauges}
           />

console/src/types/api.ts

@@ -339,7 +339,7 @@ export interface AgentTurnDetail {
   user_input: string | null
   final_call_id: string | null
   final_answer: string | null
-  call_ids: string[]
+  span_ids: string[]
   metadata: unknown
   /** See AgentTurnListItem. */
   tool_surfaces: ToolSurface[]

server/Cargo.toml

@@ -8,7 +8,7 @@ exclude = ["h-ebpf-prog"]
 resolver = "2"
 
 [workspace.package]
-version = "0.7.0"
+version = "0.7.1"
 edition = "2021"
 license = "Apache-2.0"