watson/umami
1
0
Fork 0
mirror of https://github.com/umami-software/umami.git synced 2026-02-18 19:45:35 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

Updated reports components.

Browse source
This commit is contained in:
Mike Cao 2025-03-26 21:54:23 -07:00
parent f5bc3dc6c2
commit 0f6cdf8b80
95 changed files with 580 additions and 698 deletions
Download patch file Download diff file Expand all files Collapse all files

32
src/app/(main)/websites/[websiteId]/realtime/RealtimeHeader.tsx
View file

@ -1,36 +1,18 @@
import { MetricCard } from '@/components/metrics/MetricCard';
import { useMessages } from '@/components/hooks';
import { RealtimeData } from '@/lib/types';
import styles from './RealtimeHeader.module.css';
import { MetricsBar } from '@/components/metrics/MetricsBar';
export function RealtimeHeader({ data }: { data: RealtimeData }) {
const { formatMessage, labels } = useMessages();
const { totals }: any = data || {};
return (
<div className={styles.header}>
<div className={styles.metrics}>
<MetricCard
className={styles.card}
label={formatMessage(labels.views)}
value={totals.views}
/>
<MetricCard
className={styles.card}
label={formatMessage(labels.visitors)}
value={totals.visitors}
/>
<MetricCard
className={styles.card}
label={formatMessage(labels.events)}
value={totals.events}
/>
<MetricCard
className={styles.card}
label={formatMessage(labels.countries)}
value={totals.countries}
/>
</div>
</div>
<MetricsBar isFetched={true}>
<MetricCard label={formatMessage(labels.views)} value={totals.views} />
<MetricCard label={formatMessage(labels.visitors)} value={totals.visitors} />
<MetricCard label={formatMessage(labels.events)} value={totals.events} />
<MetricCard label={formatMessage(labels.countries)} value={totals.countries} />
</MetricsBar>
);
}

4
src/app/(main)/websites/[websiteId]/realtime/RealtimeHome.tsx
View file

@ -1,7 +1,7 @@
import { useEffect } from 'react';
import { useRouter } from 'next/navigation';
import { Page } from '@/components/layout/Page';
import { PageHeader } from '@/components/layout/PageHeader';
import { Page } from '@/components/common/Page';
import { PageHeader } from '@/components/common/PageHeader';
import { useApi, useMessages } from '@/components/hooks';
import { EmptyPlaceholder } from '@/components/common/EmptyPlaceholder';

10
src/app/(main)/websites/[websiteId]/realtime/WebsiteRealtimePage.tsx
View file

@ -1,9 +1,9 @@
'use client';
import { firstBy } from 'thenby';
import { Grid } from '@umami/react-zen';
import { GridRow } from '@/components/layout/GridRow';
import { Page } from '@/components/layout/Page';
import { Panel } from '@/components/layout/Panel';
import { GridRow } from '@/components/common/GridRow';
import { Page } from '@/components/common/Page';
import { Panel } from '@/components/common/Panel';
import { RealtimeChart } from '@/components/metrics/RealtimeChart';
import { WorldMap } from '@/components/metrics/WorldMap';
import { useRealtimeQuery } from '@/components/hooks';
@ -30,7 +30,9 @@ export function WebsiteRealtimePage({ websiteId }) {
return (
<Grid gap="3">
<WebsiteHeader websiteId={websiteId} />
<RealtimeHeader data={data} />
<Panel>
<RealtimeHeader data={data} />
</Panel>
<Panel>
<RealtimeChart data={data} unit="minute" />
</Panel>