## ADDED Requirements ### Requirement: Token analytics page route The web app SHALL expose a route at `/analytics` that renders the token analytics dashboard. #### Scenario: Route resolves to Analytics page - **WHEN** the user navigates to `/analytics` - **THEN** the `Analytics` component renders without crashing - **AND** the sidebar nav button for "Token Analytics" shows as active ### Requirement: Aggregate usage summary The dashboard SHALL display an aggregate summary of token usage across all data sources. #### Scenario: Summary cards show totals - **WHEN** the analytics page loads - **THEN** the page displays summary cards for: total input tokens, total output tokens, total cost (USD), and total sessions tracked - **AND** each card shows a numeric value with a short label ### Requirement: Per-session token breakdown The dashboard SHALL display a list or table of recent sessions with per-session token and cost data. #### Scenario: Session list renders - **WHEN** `GET /api/coder/sessions/:id/agent-sessions` returns data - **THEN** the page renders a table with columns: session name, agent/provider, input tokens, output tokens, cost, last active ### Requirement: Per-tool cost breakdown The dashboard SHALL display per-tool token consumption stats. #### Scenario: Tool stats table renders - **WHEN** the analytics page loads - **THEN** it fetches and renders the per-tool cost stats from `/api/tools/cost_stats` - **AND** displays: tool name, call count, avg prompt tokens, avg completion tokens, total avg tokens ### Requirement: Context window utilization The dashboard SHALL display context window utilization data across sessions where available. #### Scenario: Context usage section renders - **WHEN** session message data with `ctx_used`/`ctx_max` fields is available - **THEN** a section shows average context utilization percentage across sessions ### Requirement: Token breakdown by category The dashboard SHALL display token breakdown by category (system/user/assistant/tools/reasoning) where `token_breakdown` JSONB data exists. #### Scenario: Category breakdown renders - **WHEN** a session has `token_breakdown` data on its tasks - **THEN** the dashboard shows per-category token counts and a visual breakdown (e.g., stacked bar or pie segment) ### Requirement: Loading and error states The dashboard SHALL handle loading and error states gracefully. #### Scenario: Loading state - **WHEN** data is being fetched - **THEN** a loading indicator is shown in each section #### Scenario: Error state - **WHEN** an API call fails - **THEN** the affected section shows an error message and a retry button - **AND** other sections continue to render independently