fix(web): sort usage models by token count

[RakshithBhat03]

Selecting Tokens on the Usage page changed the summary and chart, but the model breakdown remained ordered by cost. That made the table disagree with the selected metric.

The model breakdown now sorts by total token usage when Tokens is active. Equal token totals fall back to cost for deterministic ordering. Cost ordering is unchanged, and the day and hour breakdowns remain chronological.

Tests: 15 focused usage tests, web typecheck, targeted lint and formatting.

---

Built by GPT-5.6 Sol in T3 Code through the Codex harness.

---

Note

Low Risk
UI-only table sort on the Usage page; no data, auth, or merge-pipeline changes.

Overview
The Usage model breakdown now follows the selected metric. With Tokens active, models are sorted by totalTokens (cost as a tiebreaker). Cost view still uses the existing cost order from merge, and hour/day tables stay chronological.

Tests cover cost vs token model order and confirm hourly rows stay newest-first when the token metric is on.

^{Reviewed by Cursor Bugbot for commit 0b87076. Bugbot is set up for automated code reviews on this repo. Configure here.}

Note

Sort usage models by descending token count when Tokens metric is selected

• Adds a useMemo-derived breakdownModels in UsagePage.tsx that sorts merged.models by descending totalTokens (with descending costUsd as tie-breaker) when the breakdown is model and the metric is tokens.
• Updates the Models table rendering and empty-state check to use breakdownModels instead of merged.models.
• Adds tests in UsagePage.test.tsx covering token-based and cost-based model ordering, plus chronological order preservation in hourly breakdown.
• Behavioral Change: models are now reordered by token count only under the model + tokens combination; all other breakdown/metric pairs preserve the original merged.models order.

^{Macroscope summarized 0b87076.}

[coderabbitai]

Important

Review skipped

Auto reviews are disabled on this repository. Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro Plus

Run ID: 5e4bb059-95f2-40ce-ba9c-e6c7af21253f

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[macroscopeapp]

Approvability

Verdict: Approved at 0b87076

Macroscope's review found this PR approvable — This is a narrowly scoped UI bug fix that aligns the existing model table with the selected token metric. It preserves cost, daily, and hourly behavior and adds focused regression coverage without affecting schemas or production infrastructure.

^{You can add or adjust custom eligibility rules. Learn more.}