Updated reports components.

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

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>
);
}