feat(usage): add Today period option to Usage & Analytics (#1063)

Bổ sung lựa chọn Today vào bộ lọc thời gian của trang Usage & Analytics
(trước đây chỉ có 24h, 7D, 30D, 60D).

Khác biệt với 24h:
- 24h: cuộn 24 giờ trước → hiện tại
- Today: cố định từ 00:00 hôm nay (giờ local) → hiện tại

Thay đổi:
- page.js, UsageStats.js: thêm option Today vào danh sách PERIODS,
  đổi grid mobile từ 4 cột sang 5 cột để fit option mới.
- api/usage/stats, api/usage/chart: cho phép giá trị period today.
- usageRepo.js:
  + getUsageStats: dùng nhánh live history khi period = today,
    cutoff lấy từ 00:00 hôm nay theo local time.
  + getChartData: thêm 24 bucket theo giờ từ 00:00 → 23:59 hôm nay.
This commit is contained in:
Dũng A Tô Ri A
2026-05-14 10:03:05 +07:00
committed by GitHub
parent d1613e8ad5
commit d1a8dd4987
5 changed files with 41 additions and 6 deletions
+2 -1
View File
@@ -182,6 +182,7 @@ const TABLE_OPTIONS = [
];
const PERIODS = [
{ value: "today", label: "Today" },
{ value: "24h", label: "24h" },
{ value: "7d", label: "7D" },
{ value: "30d", label: "30D" },
@@ -412,7 +413,7 @@ export default function UsageStats({ period: periodProp, setPeriod: setPeriodPro
{/* Period selector (hidden when controlled by parent) */}
{!hidePeriodSelector && (
<div className="flex w-full items-center gap-2 sm:w-auto sm:self-end">
<div className="grid flex-1 grid-cols-4 items-center gap-1 rounded-lg border border-border bg-bg-subtle p-1 sm:flex sm:flex-none">
<div className="grid flex-1 grid-cols-5 items-center gap-1 rounded-lg border border-border bg-bg-subtle p-1 sm:flex sm:flex-none">
{PERIODS.map((p) => (
<button
key={p.value}