Skip to content

feat(dashboard): cost analytics panels — burn rate, token breakdown, cost by model #3273

Description

@OneStepAt4time

Why

ccusage-dashboard (#3236) exposes 9 cost analytics panels. Aegis dashboard has zero cost visibility. Enterprise users need session burn rate, token breakdowns, and per-model cost tracking.

What

Design and implement 3 dashboard panels:

  1. Session Burn Rate — cost over time chart (line chart, USD on Y axis, time on X). Shows spending velocity per session.
  2. Token Breakdown — stacked bar chart: input tokens, output tokens, cache-read, cache-write per session. Toggle by time range.
  3. Cost by Model — horizontal bar chart: total USD grouped by model (claude-3-opus, gpt-4o, gemini-pro, etc.).

Backend API (#3264) provides the data. This issue covers the frontend panels only — mock data is fine for initial implementation, wire to real API once #3264 ships.

Design references

Done when

  • 3 panels render with mock data
  • Responsive layout (works on 1280px+ screens)
  • Accessible (aria labels, keyboard nav, screen reader)
  • Matches existing dashboard design language
  • Loading/error/empty states handled

Priority: P2 — enterprise differentiator

Depends on: #3264 (cost tracking API — for real data)
Refs: #3236

Metadata

Metadata

Assignees

No one assigned

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions