feat(usage): add date filters and daily model breakdown in dashboard (#1058)

gui/src/i18n/de.ts

@@ -627,7 +627,11 @@ export const de: Record<TKey, string> = {
   "usage.empty": "Noch keine Nutzung erfasst. Sende eine Anfrage über den Proxy, um Aktivität hier zu sehen.",
   "usage.loadError": "Nutzungsdaten konnten nicht geladen werden.",
   "usage.range.all": "Alle",
-  "usage.range.available": "Verfügbarer Verlauf",
+  "usage.range.available":
+  "usage.range.1d": "Heute",
+  "usage.range.yesterday": "Gestern",
+  "usage.filterByDate": "Gefiltered nach {date}",
+  "usage.clearDateFilter": "Datumsfilter zurücksetzen", "Verfügbarer Verlauf",
   "usage.historyTruncated": "Die Summen beziehen sich nur auf den verfügbaren Verlauf, da ältere Nutzungsdaten nicht geladen wurden.",
   "usage.range.30d": "30d",
   "usage.range.7d": "7d",

gui/src/i18n/en.ts

@@ -658,7 +658,11 @@ export const en = {
   "usage.empty": "No usage recorded yet. Send a request through the proxy to see activity here.",
   "usage.loadError": "Could not load usage data.",
   "usage.range.all": "All",
-  "usage.range.available": "Available history",
+  "usage.range.available":
+  "usage.range.1d": "Today",
+  "usage.range.yesterday": "Yesterday",
+  "usage.filterByDate": "Filtered for {date}",
+  "usage.clearDateFilter": "Clear date filter", "Available history",
   "usage.historyTruncated": "Totals cover available history only because older usage was not loaded.",
   "usage.range.30d": "30d",
   "usage.range.7d": "7d",

gui/src/i18n/ja.ts

@@ -616,7 +616,11 @@ export const ja: Record<TKey, string> = {
   "usage.empty": "まだ使用量が記録されていません。プロキシ経由でリクエストを送信するとここにアクティビティが表示されます。",
   "usage.loadError": "使用量データを読み込めませんでした。",
   "usage.range.all": "すべて",
-  "usage.range.available": "利用可能な履歴",
+  "usage.range.available":
+  "usage.range.1d": "今日",
+  "usage.range.yesterday": "昨日",
+  "usage.filterByDate": "{date} でフィルタ中",
+  "usage.clearDateFilter": "日付フィルタを解除", "利用可能な履歴",
   "usage.historyTruncated": "古い利用履歴が読み込まれていないため、合計は利用可能な履歴のみを対象とします。",
   "usage.range.30d": "30日",
   "usage.range.7d": "7日",

gui/src/i18n/ko.ts

@@ -649,7 +649,11 @@ export const ko: Record<TKey, string> = {
   "usage.empty": "아직 기록된 사용량이 없습니다. 프록시로 요청을 보내면 여기에 표시됩니다.",
   "usage.loadError": "사용량 데이터를 불러오지 못했습니다.",
   "usage.range.all": "전체",
-  "usage.range.available": "사용 가능한 기록",
+  "usage.range.available":
+  "usage.range.1d": "오늘",
+  "usage.range.yesterday": "어제",
+  "usage.filterByDate": "{date} 필터링 됨",
+  "usage.clearDateFilter": "날짜 필터 초기화", "사용 가능한 기록",
   "usage.historyTruncated": "이전 사용 기록을 불러오지 않아 합계는 사용 가능한 기록만 포함합니다.",
   "usage.range.30d": "30일",
   "usage.range.7d": "7일",

gui/src/i18n/ru.ts

@@ -648,7 +648,11 @@ export const ru: Record<TKey, string> = {
   "usage.empty": "Данных об использовании пока нет. Отправьте запрос через прокси, чтобы увидеть здесь активность.",
   "usage.loadError": "Не удалось загрузить данные об использовании.",
   "usage.range.all": "Все",
-  "usage.range.available": "Доступная история",
+  "usage.range.available":
+  "usage.range.1d": "Сегодня",
+  "usage.range.yesterday": "Вчера",
+  "usage.filterByDate": "Фильтр по дате: {date}",
+  "usage.clearDateFilter": "Сбросить фильтр по дате", "Доступная история",
   "usage.historyTruncated": "Итоги охватывают только доступную историю, поскольку старые данные не загружены.",
   "usage.range.30d": "30 дн.",
   "usage.range.7d": "7 дн.",

gui/src/i18n/zh.ts

@@ -642,7 +642,11 @@ export const zh: Record<TKey, string> = {
   "usage.empty": "尚无用量记录。通过代理发送请求后将在此显示。",
   "usage.loadError": "无法加载用量数据。",
   "usage.range.all": "全部",
-  "usage.range.available": "可用历史",
+  "usage.range.available":
+  "usage.range.1d": "今天",
+  "usage.range.yesterday": "昨天",
+  "usage.filterByDate": "按日期筛选: {date}",
+  "usage.clearDateFilter": "清除日期筛选", "可用历史",
   "usage.historyTruncated": "由于未加载较早的使用记录，合计仅涵盖可用历史。",
   "usage.range.30d": "30 天",
   "usage.range.7d": "7 天",

gui/src/pages/Usage.tsx

@@ -10,7 +10,7 @@ import { DataSurfaceSkeleton } from "../components/data-surface";
 import { SectionTabs } from "../components/section-tabs";
 import { sectionAnchorId } from "../section-anchors";
 
-type Range = "all" | "30d" | "7d";
+type Range = "all" | "30d" | "7d" | "yesterday" | "1d";
 type UsageSurface = "all" | "codex" | "claude" | "grok";
 
 interface UsageSummaryTotals {
@@ -244,7 +244,7 @@ function UsageFilters({
         })}
       </div>
       <div className="usage-segmented" role="group" aria-label={t("usage.title")}>
-        {(["all", "30d", "7d"] as Range[]).map(choice => {
+        {(["all", "30d", "7d", "yesterday", "1d"] as Range[]).map(choice => {
           const label = choice === "all" ? t("usage.range.available") : t(`usage.range.${choice}`);
           return (
             <button

src/server/management/logs-usage-routes.ts

@@ -105,7 +105,7 @@ function usageSummaryExpiresAt(
   now: number,
 ): number {
   let expiresAt = nextLocalMidnight(now);
-  const windowMs = range === "7d" ? 7 * USAGE_DAY_MS : range === "30d" ? 30 * USAGE_DAY_MS : null;
+  const windowMs = range === "1d" ? USAGE_DAY_MS : range === "yesterday" ? 2 * USAGE_DAY_MS : range === "7d" ? 7 * USAGE_DAY_MS : range === "30d" ? 30 * USAGE_DAY_MS : null;
   if (windowMs === null) return expiresAt;
   for (const entry of entries) {
     if (!usageEntryMatchesSurface(entry, surface)) continue;
@@ -116,7 +116,7 @@ function usageSummaryExpiresAt(
 }
 
 function refreshedUsageSummary<T extends UsageSummary & { historyTruncated: boolean }>(summary: T, range: UsageRange, now: number): T {
-  const since = range === "7d" ? now - 7 * USAGE_DAY_MS : range === "30d" ? now - 30 * USAGE_DAY_MS : null;
+  const since = range === "1d" ? now - USAGE_DAY_MS : range === "yesterday" ? now - 2 * USAGE_DAY_MS : range === "7d" ? now - 7 * USAGE_DAY_MS : range === "30d" ? now - 30 * USAGE_DAY_MS : null;
   return { ...summary, since, generatedAt: now };
 }
 

src/usage/summary.ts

@@ -4,7 +4,7 @@ import { usageDisplayTotalTokens } from "./totals";
 import type { PersistedUsageEntry, UsageStatus } from "./log";
 import { estimateComboCost, estimateRequestCost, serviceTierContext } from "./cost";
 
-export type UsageRange = "7d" | "30d" | "all";
+export type UsageRange = "1d" | "yesterday" | "7d" | "30d" | "all";
 export type UsageSurface = "all" | "codex" | "claude" | "grok";
 
 export interface UsageSummaryTotals {
@@ -104,7 +104,9 @@ function retainedBreakdownRows<T>(
 }
 
 export function parseRange(input: string | null | undefined): UsageRange {
-  if (input === "7d" || input === "30d" || input === "all") return input;
+  if (input === "1d" || input === "today" || input === "yesterday" || input === "7d" || input === "30d" || input === "all") {
+    return input === "today" ? "1d" : input;
+  }
   return "30d";
 }
 
@@ -113,7 +115,9 @@ export function parseUsageSurface(input: string | null | undefined): UsageSurfac
   return "all";
 }
 
-function rangeWindow(range: UsageRange, now: number): { since: number | null; days: number } {
+function rangeWindow(range: UsageRange, now: number): { since: number | null; until?: number | null; days: number } {
+  if (range === "1d") return { since: now - DAY_MS, days: 1 };
+  if (range === "yesterday") return { since: now - 2 * DAY_MS, until: now - DAY_MS, days: 1 };
   if (range === "7d") return { since: now - 7 * DAY_MS, days: 7 };
   if (range === "30d") return { since: now - 30 * DAY_MS, days: 30 };
   return { since: null, days: 0 };
@@ -553,9 +557,10 @@ export function summarizeUsage(
   now: number,
   surface: UsageSurface = "all",
 ): UsageSummary {
-  const { since } = rangeWindow(range, now);
+  const { since, until } = rangeWindow(range, now);
   const filteredEntries = entries.filter(entry => {
     if (since !== null && entry.timestamp < since) return false;
+    if (until !== undefined && until !== null && entry.timestamp >= until) return false;
     if (surface === "claude") return entry.surface === "claude" || entry.surface === "claude-desktop";
     if (surface === "grok") return entry.surface === "grok";
     // Codex = the historical unlabelled bucket. Before the grok tag existed every

tests/usage-summary.test.ts

@@ -23,7 +23,10 @@ function entry(overrides: Partial<PersistedUsageEntry> & { ts: number }): Persis
 }
 
 describe("parseRange", () => {
-  test("accepts 7d / 30d / all", () => {
+  test("accepts 1d / yesterday / 7d / 30d / all", () => {
+    expect(parseRange("1d")).toBe("1d");
+    expect(parseRange("today")).toBe("1d");
+    expect(parseRange("yesterday")).toBe("yesterday");
     expect(parseRange("7d")).toBe("7d");
     expect(parseRange("30d")).toBe("30d");
     expect(parseRange("all")).toBe("all");
@@ -704,4 +707,22 @@ describe("summarizeUsage", () => {
     });
   });
 
+
+  test("1d and yesterday ranges filter entries by day window", () => {
+    const DAY_MS = 86_400_000;
+    const entries: PersistedUsageEntry[] = [
+      entry({ ts: FIXED_NOW - 1000, usageStatus: "reported", usage: { inputTokens: 10, outputTokens: 5 }, totalTokens: 15 }),
+      entry({ ts: FIXED_NOW - (DAY_MS + 1000), usageStatus: "reported", usage: { inputTokens: 20, outputTokens: 10 }, totalTokens: 30 }),
+      entry({ ts: FIXED_NOW - (3 * DAY_MS), usageStatus: "reported", usage: { inputTokens: 40, outputTokens: 20 }, totalTokens: 60 }),
+    ];
+
+    const today = summarizeUsage(entries, "1d", FIXED_NOW);
+    expect(today.summary.requests).toBe(1);
+    expect(today.summary.totalTokens).toBe(15);
+
+    const yesterday = summarizeUsage(entries, "yesterday", FIXED_NOW);
+    expect(yesterday.summary.requests).toBe(1);
+    expect(yesterday.summary.totalTokens).toBe(30);
+  });
+
 });