Fixed paging in events/sessions.

src/app/(main)/websites/[websiteId]/WebsiteTabs.tsx

@@ -23,7 +23,7 @@ export function WebsiteTabs() {
     },
     {
       id: 'sessions',
-      label: formatMessage(labels.users),
+      label: formatMessage(labels.sessions),
       icon: <User />,
       path: '/sessions',
     },

src/app/(main)/websites/[websiteId]/events/EventsDataTable.tsx

@@ -13,7 +13,7 @@ export function EventsDataTable({
   children?: ReactNode;
 }) {
   const { formatMessage, labels } = useMessages();
-  const queryResult = useWebsiteEventsQuery(websiteId);
+  const query = useWebsiteEventsQuery(websiteId);
   const [view, setView] = useState('all');
 
   const buttons = [
@@ -22,12 +22,12 @@ export function EventsDataTable({
       label: formatMessage(labels.all),
     },
     {
-      id: 'page',
+      id: 'views',
-      label: formatMessage(labels.page),
+      label: formatMessage(labels.views),
     },
     {
-      id: 'event',
+      id: 'events',
-      label: formatMessage(labels.event),
+      label: formatMessage(labels.events),
     },
   ];
 
@@ -37,7 +37,7 @@ export function EventsDataTable({
 
   return (
     <DataGrid
-      query={queryResult}
+      query={query}
       allowSearch={true}
       autoFocus={false}
       allowPaging={true}

src/app/api/websites/[websiteId]/events/route.ts

@@ -2,7 +2,7 @@ import { z } from 'zod';
 import { getQueryFilters, parseRequest } from '@/lib/request';
 import { unauthorized, json } from '@/lib/response';
 import { canViewWebsite } from '@/lib/auth';
-import { dateRangeParams, pagingParams, filterParams } from '@/lib/schema';
+import { dateRangeParams, pagingParams, filterParams, searchParams } from '@/lib/schema';
 import { getWebsiteEvents } from '@/queries';
 
 export async function GET(
@@ -13,6 +13,7 @@ export async function GET(
     ...dateRangeParams,
     ...filterParams,
     ...pagingParams,
+    ...searchParams,
   });
 
   const { auth, query, error } = await parseRequest(request, schema);
@@ -27,7 +28,7 @@ export async function GET(
     return unauthorized();
   }
 
-  const filters = await getQueryFilters(query);
+  const filters = await getQueryFilters(query, websiteId);
 
   const data = await getWebsiteEvents(websiteId, filters);
 

src/app/api/websites/[websiteId]/events/series/route.ts

@@ -1,5 +1,5 @@
 import { z } from 'zod';
-import { parseRequest, getQueryFilters, setWebsiteDate } from '@/lib/request';
+import { parseRequest, getQueryFilters } from '@/lib/request';
 import { unauthorized, json } from '@/lib/response';
 import { canViewWebsite } from '@/lib/auth';
 import { filterParams, timezoneParam, unitParam } from '@/lib/schema';
@@ -29,7 +29,7 @@ export async function GET(
     return unauthorized();
   }
 
-  const filters = await setWebsiteDate(websiteId, await getQueryFilters(query));
+  const filters = await getQueryFilters(query, websiteId);
 
   const data = await getEventMetrics(websiteId, filters);
 

src/components/hooks/queries/useWebsiteEventsQuery.ts

@@ -11,7 +11,8 @@ export function useWebsiteEventsQuery(websiteId: string, options?: ReactQueryOpt
 
   return usePagedQuery({
     queryKey: ['websites:events', { websiteId, ...date, ...filters }],
-    queryFn: () => get(`/websites/${websiteId}/events`, { ...date, ...filters, pageSize: 20 }),
+    queryFn: pageParams =>
+      get(`/websites/${websiteId}/events`, { ...date, ...filters, ...pageParams, pageSize: 20 }),
     enabled: !!websiteId,
     ...options,
   });

src/components/hooks/queries/useWebsiteSessionsQuery.ts

@@ -15,11 +15,12 @@ export function useWebsiteSessionsQuery(
 
   return usePagedQuery({
     queryKey: ['sessions', { websiteId, modified, ...params, ...date, ...filters }],
-    queryFn: () => {
+    queryFn: pageParams => {
       return get(`/websites/${websiteId}/sessions`, {
-        ...params,
-        ...filters,
         ...date,
+        ...filters,
+        ...pageParams,
+        ...params,
         pageSize: 20,
       });
     },

src/lib/request.ts

@@ -103,9 +103,13 @@ export async function getQueryFilters(
   params: Record<string, any>,
   websiteId?: string,
 ): Promise<QueryFilters> {
-  const dateRange = await setWebsiteDate(websiteId, getRequestDateRange(params));
+  const dateRange = getRequestDateRange(params);
   const filters = getRequestFilters(params);
-  const segments = await getRequestSegments(websiteId, params);
+  const segments = websiteId ? await getRequestSegments(websiteId, params) : null;
+
+  if (websiteId) {
+    await setWebsiteDate(websiteId, dateRange);
+  }
 
   return {
     ...dateRange,

src/lib/schema.ts

@@ -50,7 +50,6 @@ export const pagingParams = {
 
 export const sortingParams = {
   orderBy: z.string().optional(),
-  sortDescending: z.string().optional(),
 };
 
 export const userRoleParam = z.enum(['admin', 'user', 'view-only']);

src/queries/sql/events/getWebsiteEvents.ts

@@ -16,6 +16,7 @@ async function relationalQuery(websiteId: string, filters: QueryFilters) {
   const { filterQuery, dateQuery, cohortQuery, queryParams } = parseFilters({
     ...filters,
     websiteId,
+    search: `%${search}%`,
   });
 
   const searchQuery = filters.search
@@ -46,7 +47,7 @@ async function relationalQuery(websiteId: string, filters: QueryFilters) {
     ${searchQuery}
     order by created_at desc
     `,
-    { ...queryParams, search: `%${search}%` },
+    queryParams,
     filters,
   );
 }