diff --git a/README.md b/README.md index a7ee428..ac1a083 100644 --- a/README.md +++ b/README.md @@ -192,6 +192,19 @@ AGENTMON_VM_NAME=zap # or orb, sun Deployment is automated via Ansible — see the [swarm ansible playbook](https://gitea-http.taildb3494.ts.net/will/swarm) `playbooks/customize.yml`. +## Codex Hook + +The `hooks/codex/` directory contains a TypeScript handler for Codex CLI telemetry. Current Codex support is session/run oriented: + +- `sessionStart` and `sessionEnd` map to `session.start`, `run.start`, `run.end`, and `session.end` +- `notify` maps turn-complete notifications into `run.end` +- prompt-submit hooks map user prompts into the next `run.start` +- usage payloads emit both `run.end.payload.usage` and a `metric.snapshot` event + +Sample Codex hook configuration lives in [hooks/codex/hooks.json](/home/will/lab/agentmon/hooks/codex/hooks.json). On the local Codex CLI version we checked (`0.116.0`), `notify` is confirmed. Online reports suggest prompt-submit hooks may appear as `userpromptsubmit` or `userPromptSubmit`, so the sample config includes those aliases. + +The current Codex integration does not assume tool or subagent span hooks exist. If a newer Codex CLI exposes official tool/span hooks, they can be added separately without changing the run/session flow above. + ## Go SDK Emit events from Go applications: diff --git a/cmd/query-api/main.go b/cmd/query-api/main.go index c4a3afd..0915263 100644 --- a/cmd/query-api/main.go +++ b/cmd/query-api/main.go @@ -125,6 +125,7 @@ func main() { Limit: limit, EventType: r.URL.Query().Get("event_type"), Framework: r.URL.Query().Get("framework"), + ClientID: r.URL.Query().Get("client_id"), } events, err := db.ListRecentEvents(r.Context(), f) if err != nil { @@ -195,6 +196,23 @@ func main() { httpx.WriteJSON(w, http.StatusOK, map[string]any{"session": session, "runs": runs}) }) + r.Get("/v1/agents/live", func(w http.ResponseWriter, r *http.Request) { + clientID := r.URL.Query().Get("client_id") + framework := r.URL.Query().Get("framework") + if clientID == "" || framework == "" { + httpx.WriteJSON(w, http.StatusBadRequest, map[string]any{"error": "missing_agent_selector"}) + return + } + + limit, _ := strconv.Atoi(r.URL.Query().Get("limit")) + events, err := db.ListAgentLiveEvents(r.Context(), framework, clientID, limit) + if err != nil { + httpx.WriteJSON(w, http.StatusInternalServerError, map[string]any{"error": "db_error"}) + return + } + httpx.WriteJSON(w, http.StatusOK, map[string]any{"events": events}) + }) + r.Get("/v1/runs/{runID}", func(w http.ResponseWriter, r *http.Request) { runID := chi.URLParam(r, "runID") run, spans, err := db.GetRunWithSpans(r.Context(), runID) diff --git a/cmd/web-ui/static/app.js b/cmd/web-ui/static/app.js index 9d5b6c8..d3e2372 100644 --- a/cmd/web-ui/static/app.js +++ b/cmd/web-ui/static/app.js @@ -475,6 +475,7 @@ const data = await api('/v1/sessions/' + sessionID); const s = data.session; const runs = data.runs || []; + const active = !s.ended_at; const duration = s.ended_at ? formatDuration(new Date(s.ended_at) - new Date(s.started_at)) : 'ongoing'; @@ -483,6 +484,10 @@ ← Back to Sessions

Session ${escapeHTML(sessionID.substring(0, 16))}...

+
+ + ${active ? 'Active' : 'Ended'} +
Started
@@ -516,32 +521,14 @@ Started - - ${runs.map(r => { - const runDuration = r.ended_at - ? formatDuration(new Date(r.ended_at) - new Date(r.started_at)) - : '-'; - const modelLabel = r.model ? escapeHTML(r.model.replace(/^claude-/, '')) : '-'; - return ` - - ${escapeHTML(r.run_id.substring(0, 12))}... - ${statusIcon(r.status)} - ${modelLabel} - ${r.tool_count || 0} - ${r.span_count} - ${escapeHTML(runDuration)} - ${escapeHTML(new Date(r.started_at).toLocaleTimeString())} - - `; - }).join('') || 'No runs'} + + ${renderSessionRunsRows(runs)}
`; - document.querySelectorAll('tr.clickable').forEach(row => { - row.addEventListener('click', () => navigate('/runs/' + row.dataset.run)); - }); + bindSessionRunRows(); document.querySelector('.back-link').addEventListener('click', e => { e.preventDefault(); @@ -564,30 +551,11 @@ const data = await api('/v1/sessions/' + sessionID); const runs = data.runs || []; - const tbody = document.querySelector('#app table tbody'); + const tbody = document.getElementById('session-runs-body'); if (!tbody) return; - tbody.innerHTML = runs.map(r => { - const runDuration = r.ended_at - ? formatDuration(new Date(r.ended_at) - new Date(r.started_at)) - : '-'; - const modelLabel = r.model ? escapeHTML(r.model.replace(/^claude-/, '')) : '-'; - return ` - - ${escapeHTML(r.run_id.substring(0, 12))}... - ${statusIcon(r.status)} - ${modelLabel} - ${r.tool_count || 0} - ${r.span_count} - ${escapeHTML(runDuration)} - ${escapeHTML(new Date(r.started_at).toLocaleTimeString())} - - `; - }).join('') || 'No runs'; - - tbody.querySelectorAll('tr.clickable').forEach(row => { - row.addEventListener('click', () => navigate('/runs/' + row.dataset.run)); - }); + tbody.innerHTML = renderSessionRunsRows(runs); + bindSessionRunRows(); const countSpan = document.querySelector('.section-title .count'); if (countSpan) countSpan.textContent = runs.length; @@ -667,6 +635,96 @@ }); } + function renderSessionRunsRows(runs) { + if (!runs || runs.length === 0) { + return 'No runs'; + } + + return runs.map((r, i) => { + const runDuration = r.ended_at + ? formatDuration(new Date(r.ended_at) - new Date(r.started_at)) + : '-'; + const modelLabel = r.model ? escapeHTML(r.model.replace(/^claude-/, '')) : '-'; + const spans = r.spans || []; + const spansHTML = spans.length > 0 ? ` +
+ ${spans.map(sp => { + const body = getSessionSpanSummary(sp); + return ` +
+ ${escapeHTML(sp.name || sp.kind || 'span')} + ${escapeHTML(body)} +
+ `; + }).join('')} +
+ ` : '
No spans yet
'; + + return ` + + ${escapeHTML(r.run_id.substring(0, 12))}... + ${statusIcon(r.status)} + ${modelLabel} + ${r.tool_count || 0} + ${r.span_count} + ${escapeHTML(runDuration)} + ${escapeHTML(new Date(r.started_at).toLocaleTimeString())} + + + +
+
Spans ${spans.length}
+ ${spansHTML} +
+ + + `; + }).join(''); + } + + function getSessionSpanSummary(sp) { + const payload = sp.payload || {}; + const innerPayload = payload.payload || {}; + if (sp.kind === 'tool') { + const result = innerPayload.result_preview || ''; + const duration = sp.duration_ms !== undefined && sp.duration_ms !== null ? formatDuration(sp.duration_ms) : '-'; + return result ? `${duration} · ${String(result).slice(0, 80)}` : duration; + } + if (sp.kind === 'agent') { + const usage = innerPayload.usage || {}; + const totalTokens = usage.total_tokens !== undefined ? `${usage.total_tokens} tok` : ''; + const duration = sp.duration_ms !== undefined && sp.duration_ms !== null ? formatDuration(sp.duration_ms) : '-'; + return totalTokens ? `${duration} · ${totalTokens}` : duration; + } + return sp.duration_ms !== undefined && sp.duration_ms !== null ? formatDuration(sp.duration_ms) : '-'; + } + + function bindSessionRunRows() { + document.querySelectorAll('tr.expandable-run').forEach(row => { + row.addEventListener('click', event => { + if (event.metaKey || event.ctrlKey) { + navigate('/runs/' + row.dataset.run); + return; + } + + const idx = row.dataset.index; + const detailRow = document.querySelector(`tr.span-detail-row[data-index="${idx}"]`); + const icon = row.querySelector('.expand-icon'); + if (!detailRow) return; + + if (detailRow.style.display === 'none') { + detailRow.style.display = 'table-row'; + if (icon) icon.style.transform = 'rotate(45deg)'; + } else { + detailRow.style.display = 'none'; + if (icon) icon.style.transform = ''; + } + }); + + row.addEventListener('dblclick', () => navigate('/runs/' + row.dataset.run)); + }); + } + async function renderInfrastructure() { app.innerHTML = '

Infrastructure

Loading...

'; @@ -1020,13 +1078,12 @@ } function createAgentsState() { - function agentBucket() { - return { sessions: {}, operations: {}, events: [], eventIDs: new Set() }; - } return { - agents: { zap: agentBucket(), orb: agentBucket(), sun: agentBucket() }, + agents: {}, stats: { messages: 0, tools: 0, errors: 0, toolCounts: {} }, dbStats: { messages: 0, tools: 0, errors: 0 }, + viewMode: 'overview', + selectedAgentKey: '', timerInterval: null, }; } @@ -1044,9 +1101,134 @@ }); } + function normalizeAgentKey(value) { + return String(value || '') + .trim() + .toLowerCase() + .replace(/[^a-z0-9._-]+/g, '-'); + } + + function getAgentIdentity(evt) { + const source = getEnvelopeSource(evt); + const correlation = getEnvelopeCorrelation(evt); + const framework = source.framework || evt.source_framework || 'unknown'; + const host = source.host || ''; + const clientID = source.client_id || ''; + const sessionID = correlation.session_id || ''; + const name = clientID || host || framework || sessionID || 'unknown'; + const key = normalizeAgentKey(clientID || host || sessionID || framework || 'unknown'); + return { + key, + name, + framework, + host, + clientID, + sessionID, + }; + } + + function ensureAgentBucket(evt) { + const identity = getAgentIdentity(evt); + if (!identity.key) { + return null; + } + + if (!agentsState.agents[identity.key]) { + agentsState.agents[identity.key] = { + key: identity.key, + name: identity.name, + framework: identity.framework, + host: identity.host, + clientID: identity.clientID, + sessions: {}, + operations: {}, + events: [], + eventIDs: new Set(), + lastSeenAt: 0, + liveLoaded: false, + liveLoading: false, + }; + } + + const agent = agentsState.agents[identity.key]; + agent.name = identity.name || agent.name || identity.key; + agent.framework = identity.framework || agent.framework; + agent.host = identity.host || agent.host; + agent.clientID = identity.clientID || agent.clientID; + return agent; + } + + function getSortedAgentKeys() { + return Object.keys(agentsState.agents).sort((a, b) => { + const left = agentsState.agents[a]; + const right = agentsState.agents[b]; + const leftOnline = isAgentOnline(left); + const rightOnline = isAgentOnline(right); + + if (leftOnline !== rightOnline) { + return leftOnline ? -1 : 1; + } + return (left.name || left.key).localeCompare(right.name || right.key); + }); + } + + function ensureSelectedAgentKey() { + const keys = getSortedAgentKeys(); + if (keys.length === 0) { + agentsState.selectedAgentKey = ''; + return ''; + } + if (!agentsState.selectedAgentKey || !agentsState.agents[agentsState.selectedAgentKey]) { + agentsState.selectedAgentKey = keys[0]; + } + return agentsState.selectedAgentKey; + } + + function setAgentsViewMode(mode) { + agentsState.viewMode = mode === 'live' ? 'live' : 'overview'; + renderAgentsContent(); + if (agentsState.viewMode === 'live') { + void loadSelectedAgentLiveData(); + } + } + + function selectAgent(key, nextMode) { + if (!key || !agentsState.agents[key]) return; + agentsState.selectedAgentKey = key; + if (nextMode) { + agentsState.viewMode = nextMode; + } + renderAgentsContent(); + if (agentsState.viewMode === 'live') { + void loadSelectedAgentLiveData(); + } + } + + function isOpenClawVM(agent) { + const key = normalizeAgentKey(agent && agent.name); + return ['zap', 'orb', 'sun'].includes(key); + } + + function isAgentOnline(agent) { + if (!agent) { + return false; + } + + if (isOpenClawVM(agent)) { + const vmStatus = getVMStatus().find(v => v.name === normalizeAgentKey(agent.name)); + if (vmStatus) { + return vmStatus.active; + } + } + + const hasSessions = Object.keys(agent.sessions).length > 0; + const hasOps = Object.keys(agent.operations).length > 0; + const seenRecently = agent.lastSeenAt > 0 && (Date.now() - agent.lastSeenAt) < 300000; + return hasSessions || hasOps || seenRecently; + } + function getAgentBucket(evt) { - const name = getVMName(evt).toLowerCase(); - return agentsState.agents[name] || null; + return ensureAgentBucket(evt); } function processAgentEvent(evt) { @@ -1056,6 +1238,8 @@ const eventType = getEnvelopeType(evt); const correlation = getEnvelopeCorrelation(evt); const attrs = getEnvelopeAttributes(evt); + const ts = new Date(getEnvelopeTS(evt)).getTime(); + agent.lastSeenAt = Number.isFinite(ts) ? ts : Date.now(); if (eventType === 'session.start' && correlation.session_id) { agent.sessions[correlation.session_id] = { ts: getEnvelopeTS(evt) }; @@ -1069,6 +1253,7 @@ type: 'span', name: attrs.name || attrs.span_kind || 'unknown', kind: attrs.span_kind || '', + subType: attrs.type || '', startedAt: new Date(getEnvelopeTS(evt)).getTime() || Date.now(), }; } @@ -1102,8 +1287,21 @@ function getAgentDisplayOps(agent) { const now = Date.now(); const ops = Object.values(agent.operations).filter(op => (now - op.startedAt) < 300000); - const hasTools = ops.some(op => op.kind === 'tool'); - return hasTools ? ops.filter(op => op.kind === 'tool') : ops; + const hasSpecificSpans = ops.some(op => op.kind && op.kind !== 'run'); + return hasSpecificSpans ? ops.filter(op => op.kind && op.kind !== 'run') : ops; + } + + function isAgentTimelineEvent(evt) { + const eventType = getEnvelopeType(evt); + return [ + 'session.start', + 'session.end', + 'run.start', + 'run.end', + 'span.start', + 'span.end', + 'error', + ].includes(eventType); } async function renderAgents() { @@ -1113,36 +1311,38 @@

Agents Live

-
-
-
ZAP

Loading...

-
ORB

Loading...

-
SUN

Loading...

+
+
+ + +
+
+

Loading...

`; + bindAgentViewToggle(); + try { const [snapshots, events, summaryData] = await Promise.all([ api('/v1/events?event_type=openclaw.snapshot&limit=100').catch(() => ({ events: [] })), - api('/v1/events?framework=openclaw&limit=200'), + api('/v1/events?limit=300'), api('/v1/stats/summary').catch(() => null), ]); if (!isCurrentPath('/agents')) return; if (summaryData) { - const fw = (summaryData.by_framework || {}).openclaw || {}; - agentsState.dbStats.messages = fw.runs || 0; - agentsState.dbStats.tools = fw.tools || 0; - agentsState.dbStats.errors = fw.errors || 0; + agentsState.dbStats.messages = summaryData.runs_today || 0; + agentsState.dbStats.tools = summaryData.tool_calls_today || 0; + agentsState.dbStats.errors = summaryData.errors_today || 0; } mergeOpenClawEvents(snapshots.events || []); - addAgentEvents((events.events || []).slice().reverse()); - renderAgentLanes(); - renderAgentSummary(); + addAgentEvents((events.events || []).filter(isAgentTimelineEvent).slice().reverse()); + renderAgentsContent(); } catch (e) { - document.getElementById('agents-lanes').innerHTML = + document.getElementById('agents-content').innerHTML = `

Error loading agent activity: ${escapeHTML(e.message)}

`; } @@ -1150,29 +1350,96 @@ agentsUnsubscribe = subscribeWS(handleAgentsWS); } + function bindAgentViewToggle() { + const root = document.getElementById('agents-view-toggle'); + if (!root) return; + root.querySelectorAll('[data-mode]').forEach(button => { + button.addEventListener('click', () => { + setAgentsViewMode(button.dataset.mode || 'overview'); + }); + }); + } + + function updateAgentViewToggle() { + const root = document.getElementById('agents-view-toggle'); + if (!root) return; + root.querySelectorAll('[data-mode]').forEach(button => { + button.classList.toggle('active', button.dataset.mode === agentsState.viewMode); + }); + } + + function renderAgentsContent() { + renderAgentSummary(); + updateAgentViewToggle(); + if (agentsState.viewMode === 'live') { + renderAgentsLive(); + return; + } + renderAgentLanes(); + } + + async function loadSelectedAgentLiveData() { + const selectedKey = ensureSelectedAgentKey(); + if (!selectedKey) return; + + const agent = agentsState.agents[selectedKey]; + if (!agent || agent.liveLoaded || agent.liveLoading || !agent.clientID || !agent.framework) { + return; + } + + agent.liveLoading = true; + try { + const params = new URLSearchParams(); + params.set('client_id', agent.clientID); + params.set('framework', agent.framework); + params.set('limit', '250'); + const data = await api('/v1/agents/live?' + params.toString()); + addAgentEvents((data.events || []).slice().reverse()); + agent.liveLoaded = true; + } catch (err) { + console.error('Failed to load live agent context:', err); + } finally { + agent.liveLoading = false; + if (isCurrentPath('/agents') && agentsState.viewMode === 'live' && agentsState.selectedAgentKey === selectedKey) { + renderAgentsContent(); + } + } + } + function renderAgentLanes() { + const contentEl = document.getElementById('agents-content'); + if (!contentEl) return; + contentEl.innerHTML = '
'; + const lanesEl = document.getElementById('agents-lanes'); if (!lanesEl) return; - const vmNames = ['zap', 'orb', 'sun']; + const agentKeys = getSortedAgentKeys(); - lanesEl.innerHTML = vmNames.map(name => { - const agent = agentsState.agents[name]; - const vmStatus = getVMStatus().find(v => v.name === name); - const isOnline = vmStatus && vmStatus.active; + if (agentKeys.length === 0) { + lanesEl.innerHTML = '

No recent agent activity

'; + return; + } + + lanesEl.innerHTML = agentKeys.map(key => { + const agent = agentsState.agents[key]; + const isOnline = isAgentOnline(agent); const sessionCount = Object.keys(agent.sessions).length; const ops = getAgentDisplayOps(agent); + const subagentCount = ops.filter(op => op.kind === 'agent' || op.subType === 'subagent').length; const statusClass = sessionCount > 0 ? ' has-sessions' : ''; const statusText = !isOnline ? 'offline' + : subagentCount > 0 ? subagentCount + ' subagent' + (subagentCount > 1 ? 's' : '') : sessionCount > 0 ? sessionCount + ' session' + (sessionCount > 1 ? 's' : '') : 'idle'; const opsHTML = ops.length > 0 ? `
${ops.map(op => { const elapsed = Math.floor((Date.now() - op.startedAt) / 1000); const stale = elapsed > 300; + const kindClass = op.kind === 'agent' || op.subType === 'subagent' ? ' subagent' : ''; return ` -
+
${escapeHTML(op.name)} ${formatElapsed(elapsed)} @@ -1183,7 +1450,6 @@ const recent = agent.events.slice(-40).reverse(); const eventsHTML = recent.length > 0 ? recent.map(evt => { const eventType = getEnvelopeType(evt); - const vmClass = getVMClassName(name); const details = getEventDetails(evt); const detailHTML = details ? `
${escapeHTML(details)}
` : ''; const expandHTML = details ? '' : ''; @@ -1202,11 +1468,14 @@ }).join('') : '

No recent activity

'; return ` -
+
-
+
+
- ${escapeHTML(name.toUpperCase())} + ${escapeHTML(agent.name || key)} +
+
${escapeHTML(agent.framework || 'unknown')}${agent.host && agent.host !== agent.name ? ' · ' + escapeHTML(agent.host) : ''}
${statusText}
@@ -1215,8 +1484,14 @@
`; }).join(''); + lanesEl.querySelectorAll('.agent-lane[data-agent-key]').forEach(lane => { + lane.addEventListener('click', () => { + selectAgent(lane.dataset.agentKey || '', 'live'); + }); + }); lanesEl.querySelectorAll('.timeline-expand-hint').forEach(button => { - button.addEventListener('click', () => { + button.addEventListener('click', event => { + event.stopPropagation(); button.parentElement.classList.toggle('expanded'); }); }); @@ -1232,17 +1507,316 @@ const el = document.getElementById('agents-summary'); if (!el) return; const s = agentsState.dbStats; + const liveAgents = getSortedAgentKeys().filter(key => isAgentOnline(agentsState.agents[key])).length; + const liveSubagents = getSortedAgentKeys().reduce((count, key) => { + const agent = agentsState.agents[key]; + return count + Object.values(agent.operations).filter(op => op.kind === 'agent' || op.subType === 'subagent').length; + }, 0); el.innerHTML = ` +
Live Agents ${liveAgents}
+
Active Subagents ${liveSubagents}
Runs Today ${s.messages}
Tool Calls ${s.tools}
Errors ${s.errors}
`; } + function getAgentLabel(agent) { + if (!agent) return 'Unknown'; + return agent.name || agent.host || agent.framework || agent.key || 'Unknown'; + } + + function getAgentLiveSummary(agent) { + const recent = agent.events.slice().reverse(); + const activeOps = getAgentDisplayOps(agent); + const sessionIDs = Object.keys(agent.sessions); + const live = { + sessionIDs, + activeOps, + activeSubagents: activeOps.filter(op => op.kind === 'agent' || op.subType === 'subagent'), + activeTools: activeOps.filter(op => op.kind === 'tool'), + latestPrompt: '', + latestRunStatus: '', + latestModel: '', + latestError: '', + latestUsage: null, + latestContextWindow: null, + }; + + for (const evt of recent) { + const eventType = getEnvelopeType(evt); + const payload = getEnvelopePayload(evt); + if (!live.latestPrompt && eventType === 'run.start') { + live.latestPrompt = payload.prompt_preview || payload.message_preview || payload.message || ''; + } + if (!live.latestRunStatus && eventType === 'run.end') { + live.latestRunStatus = payload.status || ''; + live.latestModel = payload.model || ''; + live.latestUsage = payload.usage || null; + live.latestContextWindow = payload.context_window || null; + } + if (!live.latestUsage && eventType === 'metric.snapshot' && payload.metrics) { + live.latestUsage = payload.metrics.usage || null; + live.latestModel = live.latestModel || payload.metrics.model || ''; + } + if (!live.latestError && eventType === 'error') { + const errPayload = payload.error || {}; + live.latestError = errPayload.message || payload.message || ''; + } + if (live.latestPrompt && live.latestRunStatus && live.latestError) { + break; + } + } + + return live; + } + + function formatCount(value) { + if (value === undefined || value === null || value === '') return '-'; + return String(value); + } + + function formatCost(value) { + if (value === undefined || value === null || value === '') return '-'; + const num = Number(value); + if (!Number.isFinite(num)) return String(value); + return '$' + num.toFixed(4); + } + + function buildLiveEventContext(evt) { + const eventType = getEnvelopeType(evt); + const payload = getEnvelopePayload(evt); + const attrs = getEnvelopeAttributes(evt); + const correlation = getEnvelopeCorrelation(evt); + const parts = []; + + if ((eventType === 'span.start' || eventType === 'span.end') && attrs.span_kind === 'tool') { + if (payload.input) { + parts.push(`
input${escapeHTML(typeof payload.input === 'string' ? payload.input : JSON.stringify(payload.input))}
`); + } + if (payload.result_preview) { + parts.push(`
result${escapeHTML(String(payload.result_preview))}
`); + } + } + if ((eventType === 'span.start' || eventType === 'span.end') && (attrs.span_kind === 'agent' || attrs.type === 'subagent')) { + if (payload.prompt_preview) { + parts.push(`
prompt${escapeHTML(String(payload.prompt_preview))}
`); + } + if (payload.usage && payload.usage.total_tokens !== undefined) { + parts.push(`
tokens${escapeHTML(formatCount(payload.usage.total_tokens))}
`); + } + if (payload.usage && payload.usage.total_cost !== undefined) { + parts.push(`
cost${escapeHTML(formatCost(payload.usage.total_cost))}
`); + } + } + if (eventType === 'run.start') { + const preview = payload.prompt_preview || payload.message_preview || payload.message || ''; + if (preview) { + parts.push(`
prompt${escapeHTML(String(preview))}
`); + } + } + if (eventType === 'run.end') { + if (payload.model) { + parts.push(`
model${escapeHTML(String(payload.model))}
`); + } + if (payload.usage && payload.usage.total_tokens !== undefined) { + parts.push(`
tokens${escapeHTML(formatCount(payload.usage.total_tokens))}
`); + } + if (payload.duration_ms !== undefined) { + parts.push(`
duration${escapeHTML(formatDuration(payload.duration_ms))}
`); + } + } + if (eventType === 'metric.snapshot' && payload.metrics) { + if (payload.metrics.model) { + parts.push(`
model${escapeHTML(String(payload.metrics.model))}
`); + } + if (payload.metrics.usage && payload.metrics.usage.total_tokens !== undefined) { + parts.push(`
tokens${escapeHTML(formatCount(payload.metrics.usage.total_tokens))}
`); + } + if (payload.metrics.usage && payload.metrics.usage.total_cost !== undefined) { + parts.push(`
cost${escapeHTML(formatCost(payload.metrics.usage.total_cost))}
`); + } + } + if (eventType === 'error') { + const errPayload = payload.error || {}; + if (errPayload.type) { + parts.push(`
type${escapeHTML(String(errPayload.type))}
`); + } + } + + const ids = []; + if (correlation.session_id) ids.push(`session ${correlation.session_id}`); + if (correlation.run_id) ids.push(`run ${correlation.run_id}`); + if (correlation.span_id) ids.push(`span ${correlation.span_id}`); + if (ids.length > 0) { + parts.push(`
ids${escapeHTML(ids.join(' · '))}
`); + } + + return parts.join(''); + } + + function getRunGroupLabel(runID, events) { + const runStart = events.find(evt => getEnvelopeType(evt) === 'run.start'); + if (!runStart) { + return runID ? `Run ${runID.slice(0, 12)}...` : 'Session activity'; + } + const payload = getEnvelopePayload(runStart); + const preview = payload.prompt_preview || payload.message_preview || payload.message || ''; + if (preview) { + return preview.length > 72 ? preview.slice(0, 72) + '...' : preview; + } + return runID ? `Run ${runID.slice(0, 12)}...` : 'Session activity'; + } + + function groupAgentEventsByRun(events) { + const groups = []; + const byRun = new Map(); + + for (const evt of events) { + const correlation = getEnvelopeCorrelation(evt); + const runID = correlation.run_id || ''; + const key = runID || `session:${correlation.session_id || 'unknown'}`; + if (!byRun.has(key)) { + const group = { + key, + runID, + sessionID: correlation.session_id || '', + events: [], + subagents: new Set(), + tools: new Set(), + }; + byRun.set(key, group); + groups.push(group); + } + + const group = byRun.get(key); + group.events.push(evt); + const attrs = getEnvelopeAttributes(evt); + if (attrs.span_kind === 'agent' || attrs.type === 'subagent') { + group.subagents.add(attrs.name || 'unknown'); + } + if (attrs.span_kind === 'tool' && attrs.name) { + group.tools.add(attrs.name); + } + } + + return groups; + } + + function renderAgentsLive() { + const contentEl = document.getElementById('agents-content'); + if (!contentEl) return; + + const agentKeys = getSortedAgentKeys(); + const selectedKey = ensureSelectedAgentKey(); + if (!selectedKey || agentKeys.length === 0) { + contentEl.innerHTML = '

No recent agent activity

'; + return; + } + + const selected = agentsState.agents[selectedKey]; + const summary = getAgentLiveSummary(selected); + const recent = selected.events.slice(-80).reverse(); + const runGroups = groupAgentEventsByRun(recent); + + contentEl.innerHTML = ` +
+ +
+
+
+
${escapeHTML(getAgentLabel(selected))}
+
${escapeHTML(selected.framework || 'unknown')}${selected.host && selected.host !== selected.name ? ' · ' + escapeHTML(selected.host) : ''}
+
+
+ ${summary.sessionIDs.length} sessions + ${summary.activeSubagents.length} subagents + ${summary.activeTools.length} tools +
+
+
+
+
Current State
+
Active subagents${escapeHTML(summary.activeSubagents.map(op => op.name).join(', ') || '-')}
+
Active tools${escapeHTML(summary.activeTools.map(op => op.name).join(', ') || '-')}
+
Latest prompt${escapeHTML(summary.latestPrompt || '-')}
+
Run status${escapeHTML(summary.latestRunStatus || 'in_progress')}
+
Model${escapeHTML(summary.latestModel || '-')}
+
Last error${escapeHTML(summary.latestError || '-')}
+
+
+
Usage
+
Total tokens${escapeHTML(formatCount(summary.latestUsage && summary.latestUsage.total_tokens))}
+
Input tokens${escapeHTML(formatCount(summary.latestUsage && summary.latestUsage.input_tokens))}
+
Output tokens${escapeHTML(formatCount(summary.latestUsage && summary.latestUsage.output_tokens))}
+
Total cost${escapeHTML(formatCost(summary.latestUsage && summary.latestUsage.total_cost))}
+
+
+
Session Context
+
Session IDs${escapeHTML(summary.sessionIDs.join(', ') || '-')}
+
Window input${escapeHTML(formatCount(summary.latestContextWindow && summary.latestContextWindow.input_tokens))}
+
Window output${escapeHTML(formatCount(summary.latestContextWindow && summary.latestContextWindow.output_tokens))}
+
Remaining${escapeHTML(formatCount(summary.latestContextWindow && (summary.latestContextWindow.tokens_remaining ?? summary.latestContextWindow.used_tokens)))}
+
+
+
+ ${runGroups.length > 0 ? runGroups.map(group => ` +
+
+
${escapeHTML(getRunGroupLabel(group.runID, group.events))}
+
+ ${escapeHTML(group.runID ? `run ${group.runID.slice(0, 12)}...` : 'session-only')} + ${escapeHTML(group.subagents.size > 0 ? `${group.subagents.size} subagents` : '0 subagents')} + ${escapeHTML(group.tools.size > 0 ? `${group.tools.size} tools` : '0 tools')} +
+
+
+ ${group.events.map(evt => ` +
+
+ ${getEventIcon(getEnvelopeType(evt))} + ${escapeHTML(getEventLabel(getEnvelopeType(evt)))} + ${escapeHTML(new Date(getEnvelopeTS(evt)).toLocaleTimeString())} +
+ ${getEventBody(evt)} +
${buildLiveEventContext(evt)}
+
`).join('')} +
+
+ `).join('') : '

No recent activity

'} +
+
+
+ `; + + contentEl.querySelectorAll('[data-agent-key]').forEach(button => { + button.addEventListener('click', () => selectAgent(button.dataset.agentKey || '', 'live')); + }); + } + function renderAgentVMStrip() { // VM online/offline state is shown in each lane header via getVMStatus(). // Re-render lanes to pick up the updated openclawState. - renderAgentLanes(); + renderAgentsContent(); } function handleAgentsWS(msg) { @@ -1251,12 +1825,10 @@ const eventType = getEnvelopeType(msg.data); if (eventType === 'openclaw.snapshot') { mergeOpenClawEvents([msg.data]); - renderAgentLanes(); + renderAgentsContent(); return; } - - const framework = getEnvelopeSource(msg.data).framework || msg.data.source_framework; - if (framework !== 'openclaw') return; + if (!isAgentTimelineEvent(msg.data)) return; if (eventType === 'run.start') agentsState.dbStats.messages++; else if (eventType === 'span.end') { @@ -1265,8 +1837,7 @@ } else if (eventType === 'error') agentsState.dbStats.errors++; addAgentEvents([msg.data]); - renderAgentLanes(); - renderAgentSummary(); + renderAgentsContent(); } function updateAgentTimers() { @@ -1360,7 +1931,7 @@ } function getVMName(evt) { - return getEnvelopeSource(evt).client_id || evt.client_id || 'unknown'; + return getAgentIdentity(evt).name || 'unknown'; } function getVMClassName(vmName) { @@ -1379,11 +1950,13 @@ const duration = payload.duration_ms !== undefined && payload.duration_ms !== null ? ` ${escapeHTML(formatDuration(payload.duration_ms))}` : ''; - return `
${escapeHTML(name)}${duration}
`; + const detailClass = attrs.span_kind === 'agent' || attrs.type === 'subagent' ? ' subagent-name' : ' tool-name'; + const prefix = attrs.span_kind === 'agent' || attrs.type === 'subagent' ? 'subagent ' : ''; + return `
${escapeHTML(prefix + name)}${duration}
`; } if (eventType === 'run.start') { - const preview = payload.message_preview || payload.message || ''; + const preview = payload.prompt_preview || payload.message_preview || payload.message || ''; if (!preview) { return ''; } diff --git a/cmd/web-ui/static/style.css b/cmd/web-ui/static/style.css index aea1417..13b82d9 100644 --- a/cmd/web-ui/static/style.css +++ b/cmd/web-ui/static/style.css @@ -475,6 +475,51 @@ tr.expandable:hover .expand-icon::before { border-top: 1px solid var(--border); } +.session-run-detail { + background: var(--bg); + padding: 1rem 1.1rem; + border-top: 1px solid var(--border); +} + +.session-run-spans { + display: flex; + flex-wrap: wrap; + gap: 0.6rem; +} + +.session-span-pill { + min-width: 180px; + max-width: 100%; + display: flex; + flex-direction: column; + gap: 0.18rem; + padding: 0.55rem 0.7rem; + border-radius: var(--radius); + border: 1px solid var(--border-soft); + background: var(--surface); +} + +.session-span-pill.tool { + border-color: rgba(34, 211, 238, 0.2); +} + +.session-span-pill.agent { + border-color: rgba(167, 139, 250, 0.2); +} + +.session-span-name { + font-family: var(--font-mono); + font-size: 0.74rem; + color: var(--text-bright); +} + +.session-span-meta { + font-size: 0.72rem; + color: var(--text-dim); + line-height: 1.4; + word-break: break-word; +} + /* ── Empty state ───────────────────────────────────────────── */ .empty-state { text-align: center; @@ -855,6 +900,12 @@ tr.expandable:hover .expand-icon::before { font-size: 0.78rem; } +.timeline-event-body.subagent-name { + font-family: var(--font-mono); + color: var(--purple); + font-size: 0.78rem; +} + .timeline-event-body.message-preview { color: var(--text-dim); font-style: italic; @@ -1340,6 +1391,20 @@ tr.expandable:hover .expand-icon::before { 50% { opacity: 0.5; } } +.session-status-line { + display: inline-flex; + align-items: center; + gap: 0.45rem; + margin-top: 0.6rem; + font-family: var(--font-mono); + font-size: 0.75rem; + color: var(--text-dim); +} + +.session-status-text { + color: var(--text-bright); +} + /* ── Meta tiles ───────────────────────────────────────────── */ .meta-tiles { display: grid; @@ -1482,6 +1547,37 @@ tr.expandable:hover .expand-icon::before { flex-wrap: wrap; } +.agents-toolbar { + display: flex; + justify-content: flex-end; + margin-bottom: 1rem; +} + +.view-toggle { + display: inline-flex; + gap: 0.35rem; + padding: 0.25rem; + background: var(--surface); + border: 1px solid var(--border); + border-radius: 999px; +} + +.view-toggle-btn { + border: none; + background: transparent; + color: var(--text-dim); + font-family: var(--font-mono); + font-size: 0.72rem; + padding: 0.45rem 0.8rem; + border-radius: 999px; + cursor: pointer; +} + +.view-toggle-btn.active { + background: var(--accent-dim); + color: var(--text-bright); +} + .agents-summary-stat { background: var(--surface); border: 1px solid var(--border); @@ -1502,7 +1598,7 @@ tr.expandable:hover .expand-icon::before { .agent-lanes { display: grid; - grid-template-columns: repeat(3, 1fr); + grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 1.25rem; } @@ -1519,6 +1615,7 @@ tr.expandable:hover .expand-icon::before { display: flex; flex-direction: column; overflow: hidden; + cursor: pointer; } .agent-lane-header { @@ -1541,6 +1638,13 @@ tr.expandable:hover .expand-icon::before { letter-spacing: 0.06em; } +.agent-lane-meta { + margin-top: 0.2rem; + font-family: var(--font-mono); + font-size: 0.68rem; + color: var(--text-dim); +} + .agent-lane-dot { width: 7px; height: 7px; @@ -1596,6 +1700,11 @@ tr.expandable:hover .expand-icon::before { border-color: rgba(8, 145, 178, 0.2); } +.active-op.subagent { + background: rgba(167, 139, 250, 0.12); + border-color: rgba(167, 139, 250, 0.22); +} + .active-op.stale { opacity: 0.5; } @@ -1622,6 +1731,10 @@ tr.expandable:hover .expand-icon::before { font-weight: 500; } +.active-op.subagent .active-op-name { + color: var(--purple); +} + .active-op-time { font-family: var(--font-mono); color: var(--text-dim); @@ -1678,6 +1791,239 @@ tr.expandable:hover .expand-icon::before { font-size: 0.78rem; } +.agents-live-layout { + display: grid; + grid-template-columns: 300px minmax(0, 1fr); + gap: 1.25rem; +} + +.agents-live-sidebar, +.agents-live-main, +.agents-live-card { + background: var(--surface); + border: 1px solid var(--border); + border-radius: var(--radius-lg); +} + +.agents-live-sidebar { + padding: 1rem; + align-self: start; +} + +.agent-picker { + display: flex; + flex-direction: column; + gap: 0.5rem; +} + +.agent-picker-item { + width: 100%; + display: flex; + align-items: flex-start; + gap: 0.65rem; + padding: 0.75rem 0.85rem; + background: transparent; + border: 1px solid var(--border-soft); + border-radius: var(--radius); + text-align: left; + cursor: pointer; + color: inherit; +} + +.agent-picker-item.active { + border-color: rgba(34, 211, 238, 0.28); + background: var(--accent-dim); +} + +.agent-picker-dot { + width: 8px; + height: 8px; + border-radius: 50%; + margin-top: 0.3rem; + flex-shrink: 0; +} + +.agent-picker-dot.online { + background: var(--success); +} + +.agent-picker-dot.offline { + background: var(--text-dim); + opacity: 0.5; +} + +.agent-picker-main { + display: flex; + flex-direction: column; + gap: 0.2rem; + min-width: 0; +} + +.agent-picker-name { + font-family: var(--font-display); + font-size: 0.82rem; + font-weight: 700; + color: var(--text-bright); +} + +.agent-picker-meta { + font-family: var(--font-mono); + font-size: 0.68rem; + color: var(--text-dim); +} + +.agents-live-main { + padding: 1rem; +} + +.agents-live-header { + display: flex; + justify-content: space-between; + gap: 1rem; + align-items: flex-start; + margin-bottom: 1rem; +} + +.agents-live-badges { + display: flex; + flex-wrap: wrap; + gap: 0.5rem; +} + +.agents-live-badge { + padding: 0.38rem 0.7rem; + background: var(--surface-2); + border: 1px solid var(--border-soft); + border-radius: 999px; + font-family: var(--font-mono); + font-size: 0.68rem; + color: var(--text-dim); +} + +.agents-live-cards { + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 1rem; + margin-bottom: 1rem; +} + +.agents-live-card { + padding: 1rem; +} + +.agents-live-card-title { + font-size: 0.72rem; + font-weight: 700; + text-transform: uppercase; + letter-spacing: 0.08em; + color: var(--text-dim); + margin-bottom: 0.75rem; +} + +.live-kv { + display: flex; + flex-direction: column; + gap: 0.18rem; + padding: 0.45rem 0; + border-bottom: 1px solid var(--border-soft); +} + +.live-kv:last-child { + border-bottom: none; +} + +.live-kv span { + font-size: 0.68rem; + color: var(--text-dim); + text-transform: uppercase; + letter-spacing: 0.06em; +} + +.live-kv strong { + font-size: 0.8rem; + color: var(--text-bright); + word-break: break-word; +} + +.agents-live-timeline { + display: flex; + flex-direction: column; + gap: 0.65rem; +} + +.live-run-group { + border: 1px solid var(--border); + border-radius: var(--radius-lg); + background: var(--surface); + overflow: hidden; +} + +.live-run-group-header { + display: flex; + justify-content: space-between; + gap: 1rem; + align-items: flex-start; + padding: 0.85rem 1rem; + border-bottom: 1px solid var(--border-soft); +} + +.live-run-group-title { + font-family: var(--font-display); + font-size: 0.9rem; + font-weight: 700; + color: var(--text-bright); +} + +.live-run-group-meta { + display: flex; + flex-wrap: wrap; + gap: 0.65rem; + font-family: var(--font-mono); + font-size: 0.68rem; + color: var(--text-dim); +} + +.live-run-events { + display: flex; + flex-direction: column; + gap: 0.65rem; + padding: 0.8rem; +} + +.live-event { + padding: 0.8rem 1rem; +} + +.live-detail-grid { + display: flex; + flex-direction: column; + gap: 0.3rem; + margin-top: 0.55rem; +} + +.live-detail-row { + display: grid; + grid-template-columns: 64px minmax(0, 1fr); + gap: 0.6rem; + font-size: 0.74rem; +} + +.live-detail-row .k { + font-family: var(--font-mono); + color: var(--text-dim); + text-transform: uppercase; +} + +.live-detail-row .v { + color: var(--text); + word-break: break-word; +} + +.live-detail-row.ids .v { + font-family: var(--font-mono); + color: var(--text-dim); +} + /* ── Mobile layout ────────────────────────────────────────── */ @media (max-width: 640px) { main { @@ -1692,6 +2038,15 @@ tr.expandable:hover .expand-icon::before { padding: 0.375rem 0.5rem; font-size: 0.75rem; } + + .agents-live-layout, + .agents-live-cards { + grid-template-columns: 1fr; + } + + .agents-live-header { + flex-direction: column; + } } @media (max-width: 480px) { diff --git a/hooks/codex/handler.js b/hooks/codex/handler.js index 567ce7c..997b854 100755 --- a/hooks/codex/handler.js +++ b/hooks/codex/handler.js @@ -52,27 +52,52 @@ function safeJSONStringify(value) { } function getSessionKey(input) { return pickString( + input.id, + input.session, input.sessionId, input.session_id, + input.threadId, + input.thread_id, + input.chatId, + input.chat_id, input.conversationId, input.conversation_id ); } function getUsage(input) { - const usage = isRecord(input.usage) ? input.usage : isRecord(input.llm) ? input.llm : isRecord(input.tokens) ? input.tokens : void 0; + const usage = isRecord(input.usage) ? input.usage : isRecord(input.llm) ? input.llm : isRecord(input.tokens) ? input.tokens : isRecord(input.llm_usage) ? input.llm_usage : void 0; if (!usage) return void 0; const result = {}; + if (usage.input_tokens !== void 0) + result.input_tokens = usage.input_tokens; + if (usage.prompt_tokens !== void 0) + result.input_tokens = usage.prompt_tokens; if (usage.input !== void 0) result.input_tokens = usage.input; + if (usage.output_tokens !== void 0) + result.output_tokens = usage.output_tokens; + if (usage.completion_tokens !== void 0) + result.output_tokens = usage.completion_tokens; if (usage.output !== void 0) result.output_tokens = usage.output; + if (usage.total_tokens !== void 0) + result.total_tokens = usage.total_tokens; if (usage.total !== void 0) result.total_tokens = usage.total; if (usage.cost !== void 0) result.total_cost = usage.cost; + if (usage.total_cost !== void 0) + result.total_cost = usage.total_cost; return Object.keys(result).length > 0 ? result : void 0; } +function getModel(input) { + return pickString( + input.model, + isRecord(input.llm) ? input.llm.model : void 0, + isRecord(input.usage) ? input.usage.model : void 0 + ); +} function buildEnvelope(type, sessionKey, opts = {}) { const correlation = {}; if (sessionKey) { @@ -126,6 +151,52 @@ function enqueue(event) { scheduleFlush(); } } +function enqueueMetricSnapshot(sessionKey, runId, usage, input) { + if (!usage) { + return; + } + const metrics = { usage }; + const model = getModel(input); + if (model) { + metrics.model = model; + } + enqueue(buildEnvelope("metric.snapshot", sessionKey, { + runId, + payload: { metrics } + })); +} +function startRun(sessionKey, input) { + const runId = randomUUID(); + if (sessionKey) { + activeRuns.set(sessionKey, runId); + } + enqueue(buildEnvelope("run.start", sessionKey, { + runId, + attributes: { + trigger: pickString(input.trigger_type, input.trigger, input.event, input.event_type) + }, + payload: { + prompt_preview: truncate(pickString(input.prompt, input.message, input.text), 200) + } + })); + return runId; +} +function endRun(sessionKey, runId, input, duration) { + if (!runId) { + return; + } + const usage = getUsage(input); + enqueue(buildEnvelope("run.end", sessionKey, { + runId, + payload: { + status: "success", + duration_ms: duration, + model: getModel(input), + ...usage && { usage } + } + })); + enqueueMetricSnapshot(sessionKey, runId, usage, input); +} async function postBatch(batch) { const controller = new AbortController(); const timeout = setTimeout(() => controller.abort(), FETCH_TIMEOUT_MS); @@ -167,18 +238,8 @@ async function flush() { } async function handleSessionStart(input) { const sessionKey = getSessionKey(input) || randomUUID(); - const runId = randomUUID(); - activeRuns.set(sessionKey, runId); enqueue(buildEnvelope("session.start", sessionKey)); - enqueue(buildEnvelope("run.start", sessionKey, { - runId, - attributes: { - trigger: pickString(input.trigger_type, input.trigger) - }, - payload: { - prompt_preview: truncate(input.prompt, 200) - } - })); + startRun(sessionKey, input); await flush(); } async function handleSessionEnd(input) { @@ -186,46 +247,41 @@ async function handleSessionEnd(input) { const runId = sessionKey ? activeRuns.get(sessionKey) : void 0; const usage = getUsage(input); const duration = pickNumber(input.duration_ms, input.elapsed_ms, input.duration); - if (runId) { - enqueue(buildEnvelope("run.end", sessionKey, { - runId, - payload: { - status: "success", - duration_ms: duration, - ...usage && { usage } - } - })); - } + endRun(sessionKey, runId, input, duration); enqueue(buildEnvelope("session.end", sessionKey, { - payload: usage ? { usage } : void 0 + payload: { + model: getModel(input), + ...usage && { usage } + } })); + enqueueMetricSnapshot(sessionKey, runId, usage, input); activeRuns.delete(sessionKey || ""); await flush(); } +async function handlePromptSubmit(input) { + const sessionKey = getSessionKey(input); + const runId = sessionKey ? activeRuns.get(sessionKey) : void 0; + const duration = pickNumber(input.elapsed_ms, input.duration_ms, input.duration); + const prompt = pickString(input.prompt, input.text, input.message); + if (runId && prompt) { + endRun(sessionKey, runId, input, duration); + } + startRun(sessionKey, input); + await flush(); +} async function handleNotification(input) { const sessionKey = getSessionKey(input); - const notificationType = pickString(input.type, input.notification_type); + const notificationType = pickString(input.type, input.notification_type, input.event, input.event_type); const usage = getUsage(input); const duration = pickNumber(input.duration_ms, input.elapsed_ms); - if (notificationType === "agent-turn-complete" || notificationType === "Done") { + if (notificationType === "agent-turn-complete" || notificationType === "Done" || notificationType === "turn.complete") { const runId = sessionKey ? activeRuns.get(sessionKey) : void 0; - if (runId) { - enqueue(buildEnvelope("run.end", sessionKey, { - runId, - payload: { - status: "success", - duration_ms: duration, - ...usage && { usage } - } - })); + endRun(sessionKey, runId, input, duration); + if (pickString(input.prompt, input.message, input.text)) { + startRun(sessionKey, input); } - const newRunId = randomUUID(); - if (sessionKey) { - activeRuns.set(sessionKey, newRunId); - } - enqueue(buildEnvelope("run.start", sessionKey, { - runId: newRunId - })); + } else if (usage) { + enqueueMetricSnapshot(sessionKey, sessionKey ? activeRuns.get(sessionKey) : void 0, usage, input); } await flush(); } @@ -249,6 +305,10 @@ const handler = async () => { case "stop": await handleSessionEnd(input); break; + case "prompt": + case "prompt-submit": + await handlePromptSubmit(input); + break; case "notification": await handleNotification(input); break; diff --git a/hooks/codex/handler.ts b/hooks/codex/handler.ts index 5787963..7827696 100644 --- a/hooks/codex/handler.ts +++ b/hooks/codex/handler.ts @@ -65,8 +65,14 @@ function safeJSONStringify(value: unknown): string { function getSessionKey(input: Dict): string | undefined { return pickString( + input.id, + input.session, input.sessionId, input.session_id, + input.threadId, + input.thread_id, + input.chatId, + input.chat_id, input.conversationId, input.conversation_id, ); @@ -75,18 +81,33 @@ function getSessionKey(input: Dict): string | undefined { function getUsage(input: Dict): Dict | undefined { const usage = isRecord(input.usage) ? input.usage : isRecord(input.llm) ? input.llm : - isRecord(input.tokens) ? input.tokens : undefined; + isRecord(input.tokens) ? input.tokens : + isRecord(input.llm_usage) ? input.llm_usage : undefined; if (!usage) return undefined; const result: Dict = {}; + if (usage.input_tokens !== undefined) result.input_tokens = usage.input_tokens; + if (usage.prompt_tokens !== undefined) result.input_tokens = usage.prompt_tokens; if (usage.input !== undefined) result.input_tokens = usage.input; + if (usage.output_tokens !== undefined) result.output_tokens = usage.output_tokens; + if (usage.completion_tokens !== undefined) result.output_tokens = usage.completion_tokens; if (usage.output !== undefined) result.output_tokens = usage.output; + if (usage.total_tokens !== undefined) result.total_tokens = usage.total_tokens; if (usage.total !== undefined) result.total_tokens = usage.total; if (usage.cost !== undefined) result.total_cost = usage.cost; + if (usage.total_cost !== undefined) result.total_cost = usage.total_cost; return Object.keys(result).length > 0 ? result : undefined; } +function getModel(input: Dict): string | undefined { + return pickString( + input.model, + isRecord(input.llm) ? input.llm.model : undefined, + isRecord(input.usage) ? input.usage.model : undefined, + ); +} + function buildEnvelope( type: string, sessionKey?: string, @@ -156,6 +177,60 @@ function enqueue(event: Dict) { } } +function enqueueMetricSnapshot(sessionKey: string | undefined, runId: string | undefined, usage: Dict | undefined, input: Dict) { + if (!usage) { + return; + } + + const metrics: Dict = { usage }; + const model = getModel(input); + if (model) { + metrics.model = model; + } + + enqueue(buildEnvelope('metric.snapshot', sessionKey, { + runId, + payload: { metrics }, + })); +} + +function startRun(sessionKey: string | undefined, input: Dict): string { + const runId = randomUUID(); + if (sessionKey) { + activeRuns.set(sessionKey, runId); + } + + enqueue(buildEnvelope('run.start', sessionKey, { + runId, + attributes: { + trigger: pickString(input.trigger_type, input.trigger, input.event, input.event_type), + }, + payload: { + prompt_preview: truncate(pickString(input.prompt, input.message, input.text), 200), + }, + })); + + return runId; +} + +function endRun(sessionKey: string | undefined, runId: string | undefined, input: Dict, duration?: number) { + if (!runId) { + return; + } + + const usage = getUsage(input); + enqueue(buildEnvelope('run.end', sessionKey, { + runId, + payload: { + status: 'success', + duration_ms: duration, + model: getModel(input), + ...(usage && { usage }), + }, + })); + enqueueMetricSnapshot(sessionKey, runId, usage, input); +} + async function postBatch(batch: Dict[]) { const controller = new AbortController(); const timeout = setTimeout(() => controller.abort(), FETCH_TIMEOUT_MS); @@ -202,20 +277,9 @@ async function flush() { async function handleSessionStart(input: Dict) { const sessionKey = getSessionKey(input) || randomUUID(); - const runId = randomUUID(); - activeRuns.set(sessionKey, runId); enqueue(buildEnvelope('session.start', sessionKey)); - - enqueue(buildEnvelope('run.start', sessionKey, { - runId, - attributes: { - trigger: pickString(input.trigger_type, input.trigger), - }, - payload: { - prompt_preview: truncate(input.prompt, 200), - }, - })); + startRun(sessionKey, input); await flush(); } @@ -226,53 +290,50 @@ async function handleSessionEnd(input: Dict) { const usage = getUsage(input); const duration = pickNumber(input.duration_ms, input.elapsed_ms, input.duration); - if (runId) { - enqueue(buildEnvelope('run.end', sessionKey, { - runId, - payload: { - status: 'success', - duration_ms: duration, - ...(usage && { usage }), - }, - })); - } + endRun(sessionKey, runId, input, duration); enqueue(buildEnvelope('session.end', sessionKey, { - payload: usage ? { usage } : undefined, + payload: { + model: getModel(input), + ...(usage && { usage }), + }, })); + enqueueMetricSnapshot(sessionKey, runId, usage, input); + activeRuns.delete(sessionKey || ''); await flush(); } +async function handlePromptSubmit(input: Dict) { + const sessionKey = getSessionKey(input); + const runId = sessionKey ? activeRuns.get(sessionKey) : undefined; + const duration = pickNumber(input.elapsed_ms, input.duration_ms, input.duration); + const prompt = pickString(input.prompt, input.text, input.message); + + if (runId && prompt) { + endRun(sessionKey, runId, input, duration); + } + + startRun(sessionKey, input); + await flush(); +} + async function handleNotification(input: Dict) { const sessionKey = getSessionKey(input); - const notificationType = pickString(input.type, input.notification_type); + const notificationType = pickString(input.type, input.notification_type, input.event, input.event_type); const usage = getUsage(input); const duration = pickNumber(input.duration_ms, input.elapsed_ms); - if (notificationType === 'agent-turn-complete' || notificationType === 'Done') { + if (notificationType === 'agent-turn-complete' || notificationType === 'Done' || notificationType === 'turn.complete') { const runId = sessionKey ? activeRuns.get(sessionKey) : undefined; + endRun(sessionKey, runId, input, duration); - if (runId) { - enqueue(buildEnvelope('run.end', sessionKey, { - runId, - payload: { - status: 'success', - duration_ms: duration, - ...(usage && { usage }), - }, - })); + if (pickString(input.prompt, input.message, input.text)) { + startRun(sessionKey, input); } - - const newRunId = randomUUID(); - if (sessionKey) { - activeRuns.set(sessionKey, newRunId); - } - - enqueue(buildEnvelope('run.start', sessionKey, { - runId: newRunId, - })); + } else if (usage) { + enqueueMetricSnapshot(sessionKey, sessionKey ? activeRuns.get(sessionKey) : undefined, usage, input); } await flush(); @@ -300,6 +361,10 @@ const handler = async () => { case 'stop': await handleSessionEnd(input); break; + case 'prompt': + case 'prompt-submit': + await handlePromptSubmit(input); + break; case 'notification': await handleNotification(input); break; diff --git a/hooks/codex/hooks.json b/hooks/codex/hooks.json index 5b1dea6..3d76d00 100644 --- a/hooks/codex/hooks.json +++ b/hooks/codex/hooks.json @@ -17,6 +17,24 @@ "type": "command", "command": "~/.local/bin/agentmon-codex-handler notification" } + ], + "userpromptsubmit": [ + { + "type": "command", + "command": "~/.local/bin/agentmon-codex-handler prompt" + } + ], + "userPromptSubmit": [ + { + "type": "command", + "command": "~/.local/bin/agentmon-codex-handler prompt" + } + ], + "userPromptSubmitted": [ + { + "type": "command", + "command": "~/.local/bin/agentmon-codex-handler prompt" + } ] } } diff --git a/hooks/codex/package.json b/hooks/codex/package.json index 5fe6a99..fdad920 100644 --- a/hooks/codex/package.json +++ b/hooks/codex/package.json @@ -5,7 +5,7 @@ "main": "handler.js", "type": "module", "bin": { - "agentmon-handler": "./handler.js" + "agentmon-codex-handler": "./handler.js" }, "scripts": { "build": "npx esbuild handler.ts --platform=node --format=esm --outfile=handler.js" diff --git a/internal/store/postgres/query.go b/internal/store/postgres/query.go index 1f1fbc4..67e5682 100644 --- a/internal/store/postgres/query.go +++ b/internal/store/postgres/query.go @@ -18,6 +18,7 @@ type EventsFilter struct { Limit int EventType string Framework string + ClientID string } func (d *DB) ListRecentEvents(ctx context.Context, f EventsFilter) ([]EventRow, error) { @@ -42,6 +43,11 @@ func (d *DB) ListRecentEvents(ctx context.Context, f EventsFilter) ([]EventRow, args = append(args, f.Framework) argN++ } + if f.ClientID != "" { + query += fmt.Sprintf(" AND client_id = $%d", argN) + args = append(args, f.ClientID) + argN++ + } query += fmt.Sprintf(" ORDER BY ts DESC LIMIT $%d", argN) args = append(args, f.Limit) @@ -62,3 +68,36 @@ func (d *DB) ListRecentEvents(ctx context.Context, f EventsFilter) ([]EventRow, } return out, rows.Err() } + +func (d *DB) ListAgentLiveEvents(ctx context.Context, framework, clientID string, limit int) ([]EventRow, error) { + if limit <= 0 { + limit = 200 + } + if limit > 1000 { + limit = 1000 + } + + rows, err := d.sql.QueryContext(ctx, ` + SELECT event_id, ts, type, payload + FROM events + WHERE source_framework = $1 + AND client_id = $2 + AND type IN ('session.start', 'session.end', 'run.start', 'run.end', 'span.start', 'span.end', 'error') + ORDER BY ts DESC + LIMIT $3 + `, framework, clientID, limit) + if err != nil { + return nil, err + } + defer rows.Close() + + var out []EventRow + for rows.Next() { + var r EventRow + if err := rows.Scan(&r.EventID, &r.TS, &r.Type, &r.Payload); err != nil { + return nil, err + } + out = append(out, r) + } + return out, rows.Err() +} diff --git a/internal/store/postgres/runs.go b/internal/store/postgres/runs.go index 81e8b81..a0a6ec9 100644 --- a/internal/store/postgres/runs.go +++ b/internal/store/postgres/runs.go @@ -15,6 +15,7 @@ type RunRow struct { SpanCount int `json:"span_count"` ToolCount int `json:"tool_count"` Model string `json:"model,omitempty"` + Spans []SpanRow `json:"spans,omitempty"` } type SessionDetail struct { @@ -84,10 +85,20 @@ func (d *DB) GetSessionWithRuns(ctx context.Context, sessionID string) (*Session runs = append(runs, r) } - return &session, runs, rows.Err() + if err := rows.Err(); err != nil { + return nil, nil, err + } + + runs, err = d.attachSpansToRuns(ctx, sessionID, runs) + if err != nil { + return nil, nil, err + } + + return &session, runs, nil } type SpanRow struct { + RunID string `json:"run_id,omitempty"` SpanID string `json:"span_id"` Name string `json:"name"` Kind string `json:"kind"` @@ -129,9 +140,18 @@ func (d *DB) GetRunWithSpans(ctx context.Context, runID string) (*RunDetail, []S return nil, nil, err } - // Get spans - spansQuery := ` + spans, err := d.listSpansForRun(ctx, runID) + if err != nil { + return nil, nil, err + } + + return &run, spans, nil +} + +func (d *DB) listSpansForRun(ctx context.Context, runID string) ([]SpanRow, error) { + rows, err := d.sql.QueryContext(ctx, ` SELECT + run_id, span_id, COALESCE(payload->'attributes'->>'name', payload->'event'->>'type', type) as name, COALESCE(payload->'attributes'->>'span_kind', 'unknown') as kind, @@ -145,21 +165,84 @@ func (d *DB) GetRunWithSpans(ctx context.Context, runID string) (*RunDetail, []S FROM events WHERE run_id = $1 AND span_id IS NOT NULL ORDER BY ts ASC - ` - rows, err := d.sql.QueryContext(ctx, spansQuery, runID) + `, runID) if err != nil { - return nil, nil, err + return nil, err } defer rows.Close() - var spans []SpanRow + spansByID := make(map[string]*SpanRow) + var spanOrder []string for rows.Next() { var s SpanRow - if err := rows.Scan(&s.SpanID, &s.Name, &s.Kind, &s.StartedAt, &s.Duration, &s.Status, &s.Payload); err != nil { - return nil, nil, err + if err := rows.Scan(&s.RunID, &s.SpanID, &s.Name, &s.Kind, &s.StartedAt, &s.Duration, &s.Status, &s.Payload); err != nil { + return nil, err } - spans = append(spans, s) + + existing := spansByID[s.SpanID] + if existing == nil { + copy := s + spansByID[s.SpanID] = © + spanOrder = append(spanOrder, s.SpanID) + continue + } + + if existing.Name == "" && s.Name != "" { + existing.Name = s.Name + } + if existing.Kind == "" || existing.Kind == "unknown" { + existing.Kind = s.Kind + } + if s.Duration != nil { + existing.Duration = s.Duration + } + if s.Status == "error" { + existing.Status = "error" + } + existing.Payload = s.Payload } - return &run, spans, rows.Err() + if err := rows.Err(); err != nil { + return nil, err + } + + spans := make([]SpanRow, 0, len(spanOrder)) + for _, spanID := range spanOrder { + spans = append(spans, *spansByID[spanID]) + } + return spans, nil +} + +func (d *DB) attachSpansToRuns(ctx context.Context, sessionID string, runs []RunRow) ([]RunRow, error) { + rows, err := d.sql.QueryContext(ctx, ` + SELECT DISTINCT run_id + FROM events + WHERE session_id = $1 AND run_id IS NOT NULL + ORDER BY run_id + `, sessionID) + if err != nil { + return nil, err + } + defer rows.Close() + + spansByRun := make(map[string][]SpanRow) + for rows.Next() { + var runID string + if err := rows.Scan(&runID); err != nil { + return nil, err + } + spans, err := d.listSpansForRun(ctx, runID) + if err != nil { + return nil, err + } + spansByRun[runID] = spans + } + if err := rows.Err(); err != nil { + return nil, err + } + + for i := range runs { + runs[i].Spans = spansByRun[runs[i].RunID] + } + return runs, nil }