Problem
The dashboard currently centers range selection around last N days presets plus a custom numeric days box. That is fast, but it does not let users select an explicit date window such as 2026-06-01 → 2026-06-15.
We should support explicit start/end dates while keeping the current quick presets.
Desired UX
Add date range controls that support both workflows:
- quick presets:
3d, 7d, 30d, 90d, All
- custom numeric days:
N days
- explicit date range:
Start date and End date
Behavior:
- Selecting a preset fills the date inputs automatically.
- Example:
7d sets start/end to the computed last-7-days window.
- Entering
N in the custom days box also fills start/end automatically.
- Example:
45 sets start = today - 44 days, end = today using the dashboard’s current local-date convention.
- Editing either start or end date switches the active mode to explicit date range.
- Applying explicit dates updates overview, daily chart, model breakdown, and history consistently.
- If start/end are invalid, show an inline error and do not fetch.
- If
All is selected, clear or disable explicit date inputs with clear copy.
Implementation Notes
Current APIs are days-based. We need to decide the backend contract before changing UI behavior.
Suggested simple contract:
- Keep existing
days support for presets and backwards compatibility.
- Add optional query params to relevant endpoints:
start_date=YYYY-MM-DD
end_date=YYYY-MM-DD
- If
start_date/end_date are provided, they take precedence over days.
- Use one shared date-window parser/helper so overview/models/daily/history stay consistent.
- Keep source provenance and token semantics unchanged.
Likely endpoints affected:
/api/overview
/api/models
/api/daily
/api/usage-history
Likely frontend changes:
templates/index.html
- range-control state management
- fetch URL construction
- active button/explicit-range state
- accessible labels for date inputs
Acceptance Criteria
- Users can select an explicit start and end date from the homepage controls.
- Preset buttons still work as today.
- Entering custom
N days automatically populates start/end.
- Editing start/end switches to explicit range mode.
- All dashboard sections use the same resolved date window.
- Invalid date ranges show a visible inline error.
- Existing
days query behavior remains supported.
- Tests cover:
- default range behavior
- custom days filling start/end
- explicit start/end precedence over days
- invalid date range rejection
- all affected endpoints using consistent boundaries.
Problem
The dashboard currently centers range selection around
last N dayspresets plus a custom numeric days box. That is fast, but it does not let users select an explicit date window such as2026-06-01 → 2026-06-15.We should support explicit start/end dates while keeping the current quick presets.
Desired UX
Add date range controls that support both workflows:
3d,7d,30d,90d,AllN daysStart dateandEnd dateBehavior:
7dsets start/end to the computed last-7-days window.Nin the custom days box also fills start/end automatically.45setsstart = today - 44 days,end = todayusing the dashboard’s current local-date convention.Allis selected, clear or disable explicit date inputs with clear copy.Implementation Notes
Current APIs are
days-based. We need to decide the backend contract before changing UI behavior.Suggested simple contract:
dayssupport for presets and backwards compatibility.start_date=YYYY-MM-DDend_date=YYYY-MM-DDstart_date/end_dateare provided, they take precedence overdays.Likely endpoints affected:
/api/overview/api/models/api/daily/api/usage-historyLikely frontend changes:
templates/index.htmlAcceptance Criteria
N daysautomatically populates start/end.daysquery behavior remains supported.