update websitesession, add session duration

This commit is contained in:
Francis Cao 2024-08-09 17:27:06 -07:00
parent 3646039e54
commit 136dd6794e
6 changed files with 25 additions and 8 deletions

View file

@ -1,15 +1,31 @@
import MetricCard from 'components/metrics/MetricCard';
import { useMessages } from 'components/hooks';
import MetricCard from 'components/metrics/MetricCard';
import MetricsBar from 'components/metrics/MetricsBar';
import { formatShortTime } from 'lib/format';
export function SessionStats({ data }) {
const { formatMessage, labels } = useMessages();
const duration = (new Date(data?.lastAt).getTime() - new Date(data?.firstAt).getTime()) / 1000;
let dateFormat;
if (duration > 86400) {
dateFormat = ['d', 'm'];
} else if (duration > 3600) {
dateFormat = ['h', 'm'];
} else {
dateFormat = ['m', 's'];
}
return (
<MetricsBar isFetched={true}>
<MetricCard label={formatMessage(labels.visits)} value={data?.visits} />
<MetricCard label={formatMessage(labels.views)} value={data?.views} />
<MetricCard label={formatMessage(labels.events)} value={data?.events} />
<MetricCard
label={formatMessage(labels.sessionDuration)}
value={duration}
formatValue={n => `${+n < 0 ? '-' : ''}${formatShortTime(Math.abs(~~n), dateFormat, ' ')}`}
/>
</MetricsBar>
);
}