feat(usage): add live end time option for custom date range (#4438)

* add glm-5.2 pricing

* feat(usage): add live end time option for custom date range

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.

* style(usage): fix prettier formatting for UsageDashboard

* fix(usage): include liveEndTime in React Query cache keys

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.

src/lib/query/usage.ts

@@ -26,6 +26,7 @@ type RequestLogsKey = {
   preset: UsageRangeSelection["preset"];
   customStartDate?: number;
   customEndDate?: number;
+  liveEndTime?: boolean;
   appType?: string;
   providerName?: string;
   model?: string;
@@ -40,6 +41,7 @@ export const usageKeys = {
     customStartDate: number | undefined,
     customEndDate: number | undefined,
     filters?: UsageScopeFilters,
+    liveEndTime?: boolean,
   ) =>
     [
       ...usageKeys.all,
@@ -47,6 +49,7 @@ export const usageKeys = {
       preset,
       customStartDate ?? 0,
       customEndDate ?? 0,
+      liveEndTime ?? false,
       filters?.appType ?? null,
       filters?.providerName ?? null,
       filters?.model ?? null,
@@ -55,7 +58,8 @@ export const usageKeys = {
     preset: UsageRangeSelection["preset"],
     customStartDate: number | undefined,
     customEndDate: number | undefined,
-    filters?: UsageScopeFilters,
+    filters?: Pick<UsageScopeFilters, "providerName" | "model">,
+    liveEndTime?: boolean,
   ) =>
     [
       ...usageKeys.all,
@@ -63,6 +67,7 @@ export const usageKeys = {
       preset,
       customStartDate ?? 0,
       customEndDate ?? 0,
+      liveEndTime ?? false,
       filters?.providerName ?? null,
       filters?.model ?? null,
     ] as const,
@@ -71,6 +76,7 @@ export const usageKeys = {
     customStartDate: number | undefined,
     customEndDate: number | undefined,
     filters?: UsageScopeFilters,
+    liveEndTime?: boolean,
   ) =>
     [
       ...usageKeys.all,
@@ -78,6 +84,7 @@ export const usageKeys = {
       preset,
       customStartDate ?? 0,
       customEndDate ?? 0,
+      liveEndTime ?? false,
       filters?.appType ?? null,
       filters?.providerName ?? null,
       filters?.model ?? null,
@@ -87,6 +94,7 @@ export const usageKeys = {
     customStartDate: number | undefined,
     customEndDate: number | undefined,
     filters?: UsageScopeFilters,
+    liveEndTime?: boolean,
   ) =>
     [
       ...usageKeys.all,
@@ -94,6 +102,7 @@ export const usageKeys = {
       preset,
       customStartDate ?? 0,
       customEndDate ?? 0,
+      liveEndTime ?? false,
       filters?.appType ?? null,
       filters?.providerName ?? null,
       filters?.model ?? null,
@@ -103,6 +112,7 @@ export const usageKeys = {
     customStartDate: number | undefined,
     customEndDate: number | undefined,
     filters?: UsageScopeFilters,
+    liveEndTime?: boolean,
   ) =>
     [
       ...usageKeys.all,
@@ -110,6 +120,7 @@ export const usageKeys = {
       preset,
       customStartDate ?? 0,
       customEndDate ?? 0,
+      liveEndTime ?? false,
       filters?.appType ?? null,
       filters?.providerName ?? null,
       filters?.model ?? null,
@@ -121,6 +132,7 @@ export const usageKeys = {
       key.preset,
       key.customStartDate ?? 0,
       key.customEndDate ?? 0,
+      key.liveEndTime ?? false,
       key.appType ?? "",
       key.providerName ?? "",
       key.model ?? "",
@@ -159,6 +171,7 @@ export function useUsageSummary(
       range.customStartDate,
       range.customEndDate,
       effective,
+      range.liveEndTime,
     ),
     queryFn: () => {
       const { startDate, endDate } = resolveUsageRange(range);
@@ -186,6 +199,7 @@ export function useUsageSummaryByApp(
       range.customStartDate,
       range.customEndDate,
       filters,
+      range.liveEndTime,
     ),
     queryFn: () => {
       const { startDate, endDate } = resolveUsageRange(range);
@@ -213,6 +227,7 @@ export function useUsageTrends(
       range.customStartDate,
       range.customEndDate,
       effective,
+      range.liveEndTime,
     ),
     queryFn: () => {
       const { startDate, endDate } = resolveUsageRange(range);
@@ -241,6 +256,7 @@ export function useProviderStats(
       range.customStartDate,
       range.customEndDate,
       effective,
+      range.liveEndTime,
     ),
     queryFn: () => {
       const { startDate, endDate } = resolveUsageRange(range);
@@ -269,6 +285,7 @@ export function useModelStats(
       range.customStartDate,
       range.customEndDate,
       effective,
+      range.liveEndTime,
     ),
     queryFn: () => {
       const { startDate, endDate } = resolveUsageRange(range);
@@ -296,6 +313,7 @@ export function useRequestLogs({
     preset: range.preset,
     customStartDate: range.customStartDate,
     customEndDate: range.customEndDate,
+    liveEndTime: range.liveEndTime,
     appType: filters.appType,
     providerName: filters.providerName,
     model: filters.model,

src/lib/usageRange.ts

@@ -49,7 +49,9 @@ export function resolveUsageRange(
       };
     case "custom": {
       const startDate = selection.customStartDate ?? endDate - DAY_SECONDS;
-      const customEndDate = selection.customEndDate ?? endDate;
+      const customEndDate = selection.liveEndTime
+        ? endDate
+        : (selection.customEndDate ?? endDate);
       return {
         startDate,
         endDate: customEndDate,