feat(usage): Add dedicated usage page in sidebar

[charlesvien]

Problem

Token spend and rate-limit usage are buried in Settings > Plan & usage behind an "Analyse my spend" button, with results rendered inside the settings surface. There is no first-class place to see where your AI spend is going. Let's fix that.

Changes

• New "Usage" sidebar item routing to a dedicated /usage page, gated by posthog-code-spend-analysis (or dev builds)
• KPI strip (total spend, PostHog Code share, generations, latest day) with daily sparklines
• "Cost over time" daily bar chart with a 7/30/90 day window selector: exactly one bar per day, dollar-formatted labels and axis. Renders once the backend by_day field ships (PostHog/posthog PR pending); hidden until then
• Windows are day-aligned (-29dStart style) so summary, breakdowns and bars share one window
• "Cost by model" cards, by tool / by product tables, heuristic suggestions and the open-an-agent-task CTA (moved out of settings, which now links here and keeps plan management only)
• Monthly/daily rate-limit meters with a "Manage plan" link, shown when posthog-code-billing is on
• Supporting: SPEND_ANALYSIS_FLAG in @posthog/shared, USAGE_VIEWED event, windowToDateFrom/windowToDays/fillSpendDays helpers in core, UsageMeter extracted to features/billing

How did you test this?

• Unit: parameterised cases for the new core helpers (window mapping, day zero-fill); core and ui suites pass (1985 + 1236 tests)
• Repo-wide typecheck, Biome clean, route tree regenerated
• Manual in the dev app over CDP: navigation, auto-load with real account data, window switching, chart rendering (verified against a temporary synthetic series, since production lacks by_day), agent CTA prefill, settings link, billing-gated sections hidden with the flag off

Automatic notifications

• Publish to changelog?
• Alert Sales and Marketing teams?

[trunk-io]

Merging to main in this repository is managed by Trunk.

• To merge this pull request, check the box to the left or comment /trunk merge below.

After your PR is submitted to the merge queue, this comment will be automatically updated with its status. If the PR fails, failure details will also be posted here

[github-actions]

React Doctor found 1 issue in 1 file · 1 warning.

1 warning

src/features/usage/UsageView.tsx

• ⚠️ src/features/usage/UsageView.tsx:48 useMemo before an early return rerender-memo-before-early-return

_{Reviewed by React Doctor for commit 0c0577c.}

[greptile-apps]

_{Reviews (1): Last reviewed commit: "add dedicated usage page in sidebar" | Re-trigger Greptile}

[stamphog]

Gates denied this PR: it touches billing code (deny-listed), exceeds the size ceiling (1572 lines, 31 files), and is classified as T2-never. These are hard gates that require human review.