---
id: w8/m3/t003
title: Usage page UI — month-to-date compute by service/tier, bandwidth, build minutes
worker: worker8
status: done
estimate: 45m
depends_on: [w8/m3/t002]
---

## Objective

Build the workspace-scoped Usage page: month-to-date compute time broken down by service and instance tier, bandwidth used, and build minutes — laid out per t001's captured Render reference, using the dashboard's existing shadcn components and i18n setup.

## Context

- `dashboard/CLAUDE.md` conventions; existing pages (Metrics tab, Databases page) show table/card patterns to reuse.
- Units: compute displayed as hours (from `instance_seconds`), bandwidth as GB/MB (from bytes), build time as **minutes** (from `build_seconds`) — Render's vocabulary.
- Empty month ⇒ zero-state, not an error; loading and store-unavailable (503) states handled like the Environment tab handles OpenBao-unset.

## Steps

1. Create the route/page component; compose the three usage regions per the reference.
2. Unit formatting helpers (seconds→hours/minutes, bytes→GB) with tests.
3. i18n strings for all labels.
4. Verify against stub + live data.

## Files

- `dashboard/` (new route + components + i18n messages)

## Acceptance criteria

- [ ] Page renders real workspace numbers matching the API; zero/loading/unavailable states correct; all strings i18n'd.

## Out of scope

- Charts/history beyond month-to-date totals (needs monthly-history API — future).
