Update WebsiteMetricsBar.tsx

This commit is contained in:
Minseo Lee 2024-08-29 21:31:50 +09:00
parent 2a04809a91
commit 2660c44a6a

View file

@ -37,6 +37,7 @@ export function WebsiteMetricsBar({
const { pageviews, visitors, visits, bounces, totaltime } = data || {}; const { pageviews, visitors, visits, bounces, totaltime } = data || {};
const optionsNumber: FormatNumberOptions = { notation: 'compact', maximumSignificantDigits: 3 }; const optionsNumber: FormatNumberOptions = { notation: 'compact', maximumSignificantDigits: 3 };
const optionsSmallNumber: FormatNumberOptions = { notation: 'compact' };
const optionsPercent: FormatNumberOptions = { style: 'percent' }; const optionsPercent: FormatNumberOptions = { style: 'percent' };
const metrics = data const metrics = data
@ -45,19 +46,22 @@ export function WebsiteMetricsBar({
...pageviews, ...pageviews,
label: formatMessage(labels.views), label: formatMessage(labels.views),
change: pageviews.value - pageviews.prev, change: pageviews.value - pageviews.prev,
formatValue: (n: number) => intl.formatNumber(+n, optionsNumber), formatValue: (n: number) =>
intl.formatNumber(+n, +n < 100 ? optionsSmallNumber : optionsNumber),
}, },
{ {
...visits, ...visits,
label: formatMessage(labels.visits), label: formatMessage(labels.visits),
change: visits.value - visits.prev, change: visits.value - visits.prev,
formatValue: (n: number) => intl.formatNumber(+n, optionsNumber), formatValue: (n: number) =>
intl.formatNumber(+n, +n < 100 ? optionsSmallNumber : optionsNumber),
}, },
{ {
...visitors, ...visitors,
label: formatMessage(labels.visitors), label: formatMessage(labels.visitors),
change: visitors.value - visitors.prev, change: visitors.value - visitors.prev,
formatValue: (n: number) => intl.formatNumber(+n, optionsNumber), formatValue: (n: number) =>
intl.formatNumber(+n, +n < 100 ? optionsSmallNumber : optionsNumber),
}, },
{ {
label: formatMessage(labels.bounceRate), label: formatMessage(labels.bounceRate),