src/app/api/realtime/[websiteId]/route.ts

@@ -1,15 +1,21 @@
 import { REALTIME_RANGE } from '@/lib/constants';
 import { getQueryFilters, parseRequest } from '@/lib/request';
 import { json, unauthorized } from '@/lib/response';
+import { timezoneParam } from '@/lib/schema';
 import { canViewWebsite } from '@/permissions';
 import { getRealtimeData } from '@/queries/sql';
 import { startOfMinute, subMinutes } from 'date-fns';
+import z from 'zod';
 
 export async function GET(
   request: Request,
   { params }: { params: Promise<{ websiteId: string }> },
 ) {
-  const { auth, query, error } = await parseRequest(request);
+  const schema = z.object({
+    timezone: timezoneParam,
+  });
+
+  const { auth, query, error } = await parseRequest(request, schema);
 
   if (error) {
     return error();

src/components/hooks/queries/useRealtimeQuery.ts

@@ -1,13 +1,34 @@
+import { useTimezone } from '@/components/hooks/useTimezone';
 import { REALTIME_INTERVAL } from '@/lib/constants';
 import { useApi } from '../useApi';
-import { RealtimeData } from '@/lib/types';
+
+export interface RealtimeData {
+  countries: Record<string, number>;
+  events: any[];
+  pageviews: any[];
+  referrers: Record<string, number>;
+  timestamp: number;
+  series: {
+    views: any[];
+    visitors: any[];
+  };
+  totals: {
+    views: number;
+    visitors: number;
+    events: number;
+    countries: number;
+  };
+  urls: Record<string, number>;
+  visitors: any[];
+}
 
 export function useRealtimeQuery(websiteId: string) {
   const { get, useQuery } = useApi();
+  const { timezone } = useTimezone();
   const { data, isLoading, error } = useQuery<RealtimeData>({
-    queryKey: ['realtime', { websiteId }],
+    queryKey: ['realtime', { websiteId, timezone }],
     queryFn: async () => {
-      return get(`/realtime/${websiteId}`);
+      return get(`/realtime/${websiteId}`, { timezone });
     },
     enabled: !!websiteId,
     refetchInterval: REALTIME_INTERVAL,

src/lib/clickhouse.ts

@@ -61,7 +61,7 @@ function getDateStringSQL(data: any, unit: string = 'utc', timezone?: string) {
 
 function getDateSQL(field: string, unit: string, timezone?: string) {
   if (timezone) {
-    return `toDateTime(date_trunc('${unit}', ${field}, '${timezone}'))`;
+    return `toDateTime(date_trunc('${unit}', ${field}, '${timezone}'), '${timezone}')`;
   }
   return `toDateTime(date_trunc('${unit}', ${field}))`;
 }

src/lib/types.ts

@@ -116,23 +116,3 @@ export interface PageResult<T> {
   sortDescending?: boolean;
   search?: string;
 }
-
-export interface RealtimeData {
-  countries: Record<string, number>;
-  events: any[];
-  pageviews: any[];
-  referrers: Record<string, number>;
-  timestamp: number;
-  series: {
-    views: any[];
-    visitors: any[];
-  };
-  totals: {
-    views: number;
-    visitors: number;
-    events: number;
-    countries: number;
-  };
-  urls: Record<string, number>;
-  visitors: any[];
-}

src/queries/sql/pageviews/getPageviewStats.ts

@@ -45,7 +45,7 @@ async function clickhouseQuery(
   websiteId: string,
   filters: QueryFilters,
 ): Promise<{ x: string; y: number }[]> {
-  const { timezone = 'UTC', unit = 'day' } = filters;
+  const { timezone = 'utc', unit = 'day' } = filters;
   const { parseFilters, rawQuery, getDateSQL } = clickhouse;
   const { filterQuery, cohortQuery, queryParams } = parseFilters({
     ...filters,

src/queries/sql/sessions/getSessionStats.ts

@@ -45,7 +45,7 @@ async function clickhouseQuery(
   websiteId: string,
   filters: QueryFilters,
 ): Promise<{ x: string; y: number }[]> {
-  const { timezone = 'UTC', unit = 'day' } = filters;
+  const { timezone = 'utc', unit = 'day' } = filters;
   const { parseFilters, rawQuery, getDateSQL } = clickhouse;
   const { filterQuery, cohortQuery, queryParams } = parseFilters({
     ...filters,