feat(usage): add live end time option for custom date range#4438
feat(usage): add live end time option for custom date range#4438arichyx wants to merge 5 commits into
Conversation
Add a "End time follows current time" checkbox in the custom date range picker. When enabled, the end time becomes read-only and automatically tracks the current moment, so usage data always reflects up-to-the-second consumption from the chosen start time. This is especially useful under the Coding Plan 5-hour quota window — users can set the start time to when their 5h window began and keep the end time live to monitor real-time token consumption.
|
@codex review |
![chatgpt-codex-connector[bot]](https://avatars.githubusercontent.com/in/1144995?s=60&v=4){kind=small}
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 486a8f4916
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| const customEndDate = selection.liveEndTime | ||
| ? endDate | ||
| : (selection.customEndDate ?? endDate); |
There was a problem hiding this comment.
When liveEndTime is true this branch changes the actual request end date to Date.now(), but the React Query keys in src/lib/query/usage.ts still distinguish ranges only by preset, customStartDate, and customEndDate. A live custom range and a fixed custom range with the same stored endpoints can therefore share and overwrite the same cache entry; after the live range refreshes, switching to the fixed range can show data fetched through "now" until another refetch happens (or indefinitely when auto-refresh is off).
Useful? React with 👍 / 👎.
Without liveEndTime in the query key, a live custom range and a fixed custom range with the same stored endpoints share the same cache entry. After the live range refreshes (endDate = now), switching to the fixed range shows stale data fetched through "now" instead of the original end time.
2 participants
Summary / 概述
Add a "End time follows current time" checkbox in the custom date range picker. When enabled, the end time field becomes read-only and automatically tracks the current moment, so usage data always reflects up-to-the-second consumption from the chosen start time.
在自定义日期范围选择器中新增 "结束时间跟随当前时刻" 复选框。勾选后，结束时间字段变为只读并自动跟随当前时刻，使使用统计数据始终反映从选定开始时间到此刻的实时消耗。
Motivation / 背景
Currently, when selecting a custom date range, the end time is a fixed snapshot — it's set to the moment you click "Confirm" and never updates afterward. To see the latest data, you have to close and reopen the picker every time.
This is especially painful under the Coding Plan 5-hour quota window. Users need to monitor how much of their 5h quota has been consumed from the window start time to right now. With the current fixed end time, the data becomes stale the moment you confirm — you can never see real-time consumption within a custom window.
目前选择自定义时间范围时，结束时间是点击"确认"那一刻的固定快照，之后不会更新。要看最新数据，必须反复关闭再打开选择器。
这在 Coding Plan 5 小时额度窗口 下尤其不便。用户需要监控从窗口开始时间到此刻的 token 消耗，但固定的结束时间让数据在确认的那一刻就过时了——无法在自定义窗口内查看实时消耗。
What this PR does / 改动内容
UsageRangeSelection— add optionalliveEndTime?: booleanfieldresolveUsageRange()— whenliveEndTimeis true,endDateresolves toDate.now()instead of the fixedcustomEndDatesnapshotUsageDateRangePicker— add a checkbox below the end time field; when checked:opacity-50,cursor-not-allowed,pointer-events-none)UsageDashboard— whenliveEndTimeis true, the range label shows"start → Now"instead of a stale end timestampusage.liveEndTimeandusage.liveEndTimeNowkeys for en/zh/zh-TW/jaScreenshots / 截图
Checklist / 检查清单
pnpm typecheckpasses / 通过 TypeScript 类型检查pnpm format:checkpasses / 通过代码格式检查cargo clippypasses (if Rust code changed) / 通过 Clippy 检查（如修改了 Rust 代码）— N/A, no Rust changes