fix: charts and logs data count

apps/dashboard/app/(app)/apis/[apiId]/_overview/components/charts/bar-chart/hooks/use-fetch-timeseries.ts

@@ -1,5 +1,5 @@
 import { formatTimestampForChart } from "@/components/logs/chart/utils/format-timestamp";
-import { TIMESERIES_DATA_WINDOW } from "@/components/logs/constants";
+import { HISTORICAL_DATA_WINDOW } from "@/components/logs/constants";
 import { trpc } from "@/lib/trpc/client";
 import { KEY_VERIFICATION_OUTCOMES } from "@unkey/clickhouse/src/keys/keys";
 import { useMemo } from "react";
@@ -13,7 +13,7 @@ export const useFetchVerificationTimeseries = (apiId: string | null) => {
 
   const queryParams = useMemo(() => {
     const params: KeysOverviewQueryTimeseriesPayload = {
-      startTime: dateNow - TIMESERIES_DATA_WINDOW * 24,
+      startTime: dateNow - HISTORICAL_DATA_WINDOW,
       endTime: dateNow,
       keyIds: { filters: [] },
       outcomes: { filters: [] },

apps/dashboard/app/(app)/apis/[apiId]/_overview/components/charts/line-chart/hooks/use-fetch-timeseries.ts

@@ -1,5 +1,5 @@
 import { formatTimestampForChart } from "@/components/logs/chart/utils/format-timestamp";
-import { TIMESERIES_DATA_WINDOW } from "@/components/logs/constants";
+import { HISTORICAL_DATA_WINDOW } from "@/components/logs/constants";
 import { trpc } from "@/lib/trpc/client";
 import { KEY_VERIFICATION_OUTCOMES } from "@unkey/clickhouse/src/keys/keys";
 import { useMemo } from "react";
@@ -13,7 +13,7 @@ export const useFetchActiveKeysTimeseries = (apiId: string | null) => {
 
   const queryParams = useMemo(() => {
     const params: KeysOverviewQueryTimeseriesPayload = {
-      startTime: dateNow - TIMESERIES_DATA_WINDOW * 24,
+      startTime: dateNow - HISTORICAL_DATA_WINDOW,
       endTime: dateNow,
       keyIds: { filters: [] },
       outcomes: { filters: [] },

apps/dashboard/app/(app)/apis/_components/hooks/use-query-timeseries.ts

@@ -1,5 +1,5 @@
 import { formatTimestampForChart } from "@/components/logs/chart/utils/format-timestamp";
-import { TIMESERIES_DATA_WINDOW } from "@/components/logs/constants";
+import { HISTORICAL_DATA_WINDOW } from "@/components/logs/constants";
 import { trpc } from "@/lib/trpc/client";
 import { useEffect, useMemo, useState } from "react";
 import type { VerificationQueryTimeseriesPayload } from "./query-timeseries.schema";
@@ -13,7 +13,7 @@ export const useFetchVerificationTimeseries = (keyspaceId: string | null) => {
   const queryParams = useMemo(() => {
     const params: VerificationQueryTimeseriesPayload = {
       keyspaceId: keyspaceId ?? "",
-      startTime: dateNow - TIMESERIES_DATA_WINDOW * 24,
+      startTime: dateNow - HISTORICAL_DATA_WINDOW,
       endTime: dateNow,
       since: "",
     };

apps/dashboard/app/(app)/logs/components/charts/hooks/use-fetch-timeseries.ts

@@ -1,5 +1,5 @@
 import { formatTimestampForChart } from "@/components/logs/chart/utils/format-timestamp";
-import { TIMESERIES_DATA_WINDOW } from "@/components/logs/constants";
+import { HISTORICAL_DATA_WINDOW } from "@/components/logs/constants";
 import { trpc } from "@/lib/trpc/client";
 import { useMemo } from "react";
 import type { z } from "zod";
@@ -12,7 +12,7 @@ export const useFetchTimeseries = () => {
   const dateNow = useMemo(() => Date.now(), []);
   const queryParams = useMemo(() => {
     const params: z.infer<typeof queryTimeseriesPayload> = {
-      startTime: dateNow - TIMESERIES_DATA_WINDOW,
+      startTime: dateNow - HISTORICAL_DATA_WINDOW,
       endTime: dateNow,
       host: { filters: [] },
       method: { filters: [] },

apps/dashboard/app/(app)/ratelimits/[namespaceId]/_overview/components/charts/bar-chart/hooks/use-fetch-timeseries.ts

@@ -1,5 +1,5 @@
 import { formatTimestampForChart } from "@/components/logs/chart/utils/format-timestamp";
-import { TIMESERIES_DATA_WINDOW } from "@/components/logs/constants";
+import { HISTORICAL_DATA_WINDOW } from "@/components/logs/constants";
 import { trpc } from "@/lib/trpc/client";
 import { useQueryTime } from "@/providers/query-time-provider";
 import { useMemo } from "react";
@@ -13,7 +13,7 @@ export const useFetchRatelimitOverviewTimeseries = (namespaceId: string) => {
   const queryParams = useMemo(() => {
     const params: RatelimitOverviewQueryTimeseriesPayload = {
       namespaceId,
-      startTime: timestamp - TIMESERIES_DATA_WINDOW,
+      startTime: timestamp - HISTORICAL_DATA_WINDOW,
       endTime: timestamp,
       identifiers: { filters: [] },
       since: "",

apps/dashboard/app/(app)/ratelimits/[namespaceId]/_overview/components/charts/line-chart/hooks/use-fetch-timeseries.ts

@@ -1,19 +1,20 @@
 import { formatTimestampForChart } from "@/components/logs/chart/utils/format-timestamp";
-import { TIMESERIES_DATA_WINDOW } from "@/components/logs/constants";
+import { HISTORICAL_DATA_WINDOW } from "@/components/logs/constants";
 import { trpc } from "@/lib/trpc/client";
+import { useQueryTime } from "@/providers/query-time-provider";
 import { useMemo } from "react";
 import { useFilters } from "../../../../hooks/use-filters";
 import type { RatelimitOverviewQueryTimeseriesPayload } from "../../bar-chart/query-timeseries.schema";
 
 export const useFetchRatelimitOverviewLatencyTimeseries = (namespaceId: string) => {
   const { filters } = useFilters();
-  const dateNow = useMemo(() => Date.now(), []);
+  const { queryTime: timestamp } = useQueryTime();
 
   const queryParams = useMemo(() => {
     const params: RatelimitOverviewQueryTimeseriesPayload = {
       namespaceId,
-      startTime: dateNow - TIMESERIES_DATA_WINDOW,
-      endTime: dateNow,
+      startTime: timestamp - HISTORICAL_DATA_WINDOW,
+      endTime: timestamp,
       identifiers: { filters: [] },
       since: "",
     };
@@ -52,7 +53,7 @@ export const useFetchRatelimitOverviewLatencyTimeseries = (namespaceId: string)
     });
 
     return params;
-  }, [filters, dateNow, namespaceId]);
+  }, [filters, timestamp, namespaceId]);
 
   const { data, isLoading, isError } =
     trpc.ratelimit.overview.logs.queryRatelimitLatencyTimeseries.useQuery(queryParams, {

apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/components/charts/hooks/use-fetch-timeseries.ts

@@ -1,5 +1,5 @@
 import { formatTimestampForChart } from "@/components/logs/chart/utils/format-timestamp";
-import { TIMESERIES_DATA_WINDOW } from "@/components/logs/constants";
+import { HISTORICAL_DATA_WINDOW } from "@/components/logs/constants";
 import { trpc } from "@/lib/trpc/client";
 import { useQueryTime } from "@/providers/query-time-provider";
 import { useMemo } from "react";
@@ -13,7 +13,7 @@ export const useFetchRatelimitTimeseries = (namespaceId: string) => {
   const queryParams = useMemo(() => {
     const params: RatelimitQueryTimeseriesPayload = {
       namespaceId,
-      startTime: timestamp - TIMESERIES_DATA_WINDOW,
+      startTime: timestamp - HISTORICAL_DATA_WINDOW,
       endTime: timestamp,
       identifiers: { filters: [] },
       since: "",

apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/components/table/hooks/use-logs-query.test.ts → apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/components/table/hooks/use-logs-query.test.tsx

@@ -1,12 +1,23 @@
 import { trpc } from "@/lib/trpc/client";
+import { QueryTimeProvider } from "@/providers/query-time-provider";
 import { act, renderHook } from "@testing-library/react";
 import type { RatelimitLog } from "@unkey/clickhouse/src/ratelimits";
+// biome-ignore lint/style/useImportType: we need react for mocking
+import * as React from "react";
 import { beforeEach, describe, expect, it, vi } from "vitest";
 import { useRatelimitLogsQuery } from "./use-logs-query";
 
 let mockFilters: any[] = [];
 const mockDate = 1706024400000;
 
+vi.mock("@/providers/query-time-provider", () => ({
+  QueryTimeProvider: ({ children }: { children: React.ReactNode }) => children,
+  useQueryTime: () => ({
+    queryTime: new Date(mockDate),
+    refreshQueryTime: vi.fn(),
+  }),
+}));
+
 vi.mock("@/lib/trpc/client", () => {
   const useInfiniteQuery = vi.fn().mockReturnValue({
     data: null,
@@ -76,7 +87,7 @@ describe("useRatelimitLogsQuery filter processing", () => {
       { field: "status", operator: "is", value: {} },
     ];
     renderHook(() => useRatelimitLogsQuery({ namespaceId: "test-namspace" }));
-    expect(consoleMock).toHaveBeenCalledTimes(3);
+    expect(consoleMock).toHaveBeenCalledTimes(6);
   });
 
   it("handles time-based filters", () => {
@@ -146,7 +157,10 @@ describe("useRatelimitLogsQuery realtime logs", () => {
           pollIntervalMs,
           namespaceId: "test-namespace",
         }),
-      { initialProps: { startPolling: true, pollIntervalMs: 1000 } },
+      {
+        initialProps: { startPolling: true, pollIntervalMs: 1000 },
+        wrapper: ({ children }) => <QueryTimeProvider>{children}</QueryTimeProvider>,
+      },
     );
 
     expect(result.current.historicalLogs).toHaveLength(2);

apps/dashboard/components/logs/constants.ts

@@ -1,3 +1,2 @@
 // Those two setting is being used by every log table and chart. So be carefuly when you are making changes. Consult to core team.
 export const HISTORICAL_DATA_WINDOW = 12 * 60 * 60 * 1000;
-export const TIMESERIES_DATA_WINDOW = 60 * 60 * 1000;