zias/stats
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

fix(dashboard): reduce re-renders for pages table

Browse Source
This commit is contained in:
Carl-Gerhard Lindesvärd
2024-09-05 22:10:20 +02:00
parent b19a874a0b
commit 27b814eba2
2 changed files with 113 additions and 104 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/pages/pages-table.tsx
View File

@@ -1,13 +1,16 @@
'use client'; 'use client';
import { memo } from 'react';
import { LazyChart } from '@/components/report/chart/LazyChart'; import { LazyChart } from '@/components/report/chart/LazyChart';
import { useNumber } from '@/hooks/useNumerFormatter'; import { useNumber } from '@/hooks/useNumerFormatter';
import { cn } from '@/utils/cn'; import { cn } from '@/utils/cn';
import isEqual from 'lodash.isequal';
import { ExternalLinkIcon } from 'lucide-react'; import { ExternalLinkIcon } from 'lucide-react';
import type { IServicePage } from '@openpanel/db'; import type { IServicePage } from '@openpanel/db';
export function PagesTable({ data }: { data: IServicePage[] }) { export const PagesTable = memo(
({ data }: { data: IServicePage[] }) => {
const number = useNumber(); const number = useNumber();
const cell = const cell =
'flex min-h-12 whitespace-nowrap px-4 align-middle shadow-[0_0_0_0.5px] shadow-border'; 'flex min-h-12 whitespace-nowrap px-4 align-middle shadow-[0_0_0_0.5px] shadow-border';
@@ -111,4 +114,10 @@ export function PagesTable({ data }: { data: IServicePage[] }) {
</div> </div>
</div> </div>
); );
},
(prevProps, nextProps) => {
return isEqual(prevProps.data, nextProps.data);
} }
);
PagesTable.displayName = 'PagesTable';

2
packages/db/src/services/event.service.ts
View File

@@ -618,7 +618,7 @@ export async function getTopPages({
WHERE name = 'screen_view' WHERE name = 'screen_view'
AND project_id = ${escape(projectId)} AND project_id = ${escape(projectId)}
AND created_at > now() - INTERVAL 30 DAY AND created_at > now() - INTERVAL 30 DAY
${search ? `AND path LIKE '%${search}%'` : ''} ${search ? `AND path ILIKE '%${search}%'` : ''}
GROUP BY path, project_id, origin GROUP BY path, project_id, origin
ORDER BY count desc ORDER BY count desc
LIMIT ${take} LIMIT ${take}