will/agentmon
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(web-ui): better stats and ergonomics

Browse Source 
Usage page: add 7-day trend chart (activity/tokens/cost tabs),
framework breakdown panel with per-framework run/tool/error counts
and proportional bars, and 7d aggregate pills above the chart.

Dashboard: add avg cost/run metric pill to the metrics strip.

Run detail: extract and display prompt preview from the first agent
span's payload above the spans table.

Bug fixes: stat-list bars now render correctly (flex-direction:column),
right-panel-tab active background uses correct accent color, missing
framework colors added for hermes/codex/gemini/copilot. Dead code
renderSessionRow removed from sessions.js. Hardcoded font-family
replaced with CSS variable in metric-pill-value and token-stat-value.
Usage page cleanup() wired into router teardown.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
William Valentin
2026-05-21 16:49:05 -07:00
parent 1b01f0b0cd
commit 8753c0c9d5
6 changed files with 455 additions and 90 deletions
Download Patch File Download Diff File Expand all files Collapse all files
cmd/web-ui/static/modules/pages/sessions.js
-21
View File
@@ -227,27 +227,6 @@ function refreshSessionsTable() {
updatePaginationInfo();
}
// Dead code: renderSessionRow is never called but preserved for fidelity
function renderSessionRow(s) { // eslint-disable-line no-unused-vars
const fw = s.framework || 'unknown';
const fwClass = fw.replace(/[^a-z0-9-]/g, '-');
const active = isSessionActive(s);
const dotState = sessionDotState(s);
const dotTitle = dotState === 'active'
? 'Currently active session'
: (active ? 'Open session' : 'Session ended');
const errorCell = (s._errorCount || 0) > 0
? `<span class="error-count-badge">${s._errorCount}</span>`
: '<span style="color:var(--text-dim)">—</span>';
return `
<td class="id-cell" title="${escapeHTML(s.session_id)}">${escapeHTML(s.session_id.substring(0, 12))}…${renderCopyButton(s.session_id)}</td>
<td><span class="fw-dot ${escapeHTML(fwClass)} ${dotState}" title="${dotTitle}"></span>${escapeHTML(fw)}</td>
<td>${escapeHTML(s.host || '-')}</td>
<td>${s.run_count}</td>
<td title="${escapeHTML(s.started_at)}">${escapeHTML(relativeTime(s.started_at))}</td>
<td>${errorCell}</td>
`;
}
function updateSessionTimers() {
const tbody = document.getElementById('sessions-body');