Refactored realtime.

This commit is contained in:
Mike Cao 2024-06-19 21:47:27 -07:00
parent cda3ba345b
commit 5108b91f80
16 changed files with 205 additions and 227 deletions

View file

@ -1,4 +1,5 @@
'use client';
import { firstBy } from 'thenby';
import { Grid, GridRow } from 'components/layout/Grid';
import Page from 'components/layout/Page';
import RealtimeChart from 'components/metrics/RealtimeChart';
@ -10,6 +11,7 @@ import RealtimeUrls from './RealtimeUrls';
import RealtimeCountries from './RealtimeCountries';
import WebsiteHeader from '../WebsiteHeader';
import WebsiteProvider from '../WebsiteProvider';
import { percentFilter } from 'lib/filters';
export function WebsiteRealtimePage({ websiteId }) {
const { data, isLoading, error } = useRealtime(websiteId);
@ -18,6 +20,12 @@ export function WebsiteRealtimePage({ websiteId }) {
return <Page isLoading={isLoading} error={error} />;
}
const countries = percentFilter(
Object.keys(data.countries)
.map(key => ({ x: key, y: data.countries[key] }))
.sort(firstBy('y', -1)),
);
return (
<WebsiteProvider websiteId={websiteId}>
<WebsiteHeader websiteId={websiteId} />
@ -29,8 +37,8 @@ export function WebsiteRealtimePage({ websiteId }) {
<RealtimeLog data={data} />
</GridRow>
<GridRow columns="one-two">
<RealtimeCountries data={data?.countries} />
<WorldMap data={data?.countries} />
<RealtimeCountries data={countries} />
<WorldMap data={countries} />
</GridRow>
</Grid>
</WebsiteProvider>