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

feat: semantic accent colors on summary cards, infrastructure label

Browse Source 
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
William Valentin
2026-03-14 11:59:38 -07:00
parent a6902e8d6c
commit 2c4b212ae6
2 changed files with 36 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files
cmd/web-ui/static/app.js
+21 -18
View File
@@ -952,25 +952,29 @@
<h2>Dashboard <span class="live-indicator"><span class="live-dot"></span>Live</span></h2>
</div>
<div class="dashboard-summary">
<div class="summary-card">
<div class="summary-card-label">Active Sessions</div>
<div class="summary-card" style="--card-accent:var(--accent)">
<div class="summary-card-label"><span class="summary-card-icon">◉</span>Active Sessions</div>
<div class="summary-card-value" id="dash-active">-</div>
<div class="summary-card-sub" id="dash-active-sub"></div>
<div class="summary-card-sub" id="dash-active-sub">&nbsp;</div>
</div>
<div class="summary-card">
<div class="summary-card-label">Runs Today</div>
<div class="summary-card" style="--card-accent:var(--success)">
<div class="summary-card-label"><span class="summary-card-icon">▶</span>Runs Today</div>
<div class="summary-card-value" id="dash-runs">-</div>
<div class="summary-card-sub" id="dash-runs-sub">&nbsp;</div>
</div>
<div class="summary-card">
<div class="summary-card-label">Tool Calls</div>
<div class="summary-card" style="--card-accent:var(--purple)">
<div class="summary-card-label"><span class="summary-card-icon">⚡</span>Tool Calls</div>
<div class="summary-card-value" id="dash-tools">-</div>
<div class="summary-card-sub" id="dash-tools-sub">&nbsp;</div>
</div>
<div class="summary-card">
<div class="summary-card-label">Errors</div>
<div class="summary-card" style="--card-accent:var(--error)">
<div class="summary-card-label"><span class="summary-card-icon">⚠</span>Errors</div>
<div class="summary-card-value" id="dash-errors">-</div>
<div class="summary-card-sub" id="dash-errors-sub">&nbsp;</div>
</div>
</div>
<div class="vm-strip" id="dash-vm-strip"></div>
<div class="section-title" style="margin-bottom:0.75rem">Infrastructure</div>
<div class="vm-strip" id="dash-vm-strip" style="margin-bottom:1.5rem"></div>
<div class="charts-row">
<div class="chart-panel">
<div class="chart-header">
@@ -1142,18 +1146,17 @@
el('dash-tools', s.tool_calls_today);
el('dash-errors', s.errors_today);
// Sub-line: framework breakdown for active sessions
const fws = Object.keys(s.by_framework || {});
if (fws.length > 0) {
const sub = document.getElementById('dash-active-sub');
if (sub) sub.textContent = fws.map(f => `${f} ${(s.by_framework[f].runs || 0)}`).join(' · ');
}
const errEl = document.getElementById('dash-errors');
if (errEl) {
errEl.classList.toggle('has-errors', s.errors_today > 0);
}
const subEl = document.getElementById('dash-active-sub');
if (subEl && s.by_framework) {
const parts = Object.entries(s.by_framework)
.filter(([, v]) => v.runs > 0)
.map(([name, v]) => escapeHTML(name) + ' ' + v.runs);
subEl.textContent = parts.length > 0 ? parts.join(' / ') : '';
}
}
async function loadTimeseries() {