This commit is contained in:
Minseo Lee 2024-08-30 00:15:49 +09:00
parent bb4862a6f7
commit c5ccd53228
6 changed files with 19 additions and 19 deletions

View file

@ -43,19 +43,19 @@ export function WebsiteMetricsBar({
...pageviews,
label: formatMessage(labels.views),
change: pageviews.value - pageviews.prev,
formatValue: (n: number) => intl.formatNumber(+n, formatLongNumberOptions(+n)),
formatValue: (n: number) => intl.formatNumber(n, formatLongNumberOptions(n)),
},
{
...visits,
label: formatMessage(labels.visits),
change: visits.value - visits.prev,
formatValue: (n: number) => intl.formatNumber(+n, formatLongNumberOptions(+n)),
formatValue: (n: number) => intl.formatNumber(n, formatLongNumberOptions(n)),
},
{
...visitors,
label: formatMessage(labels.visitors),
change: visitors.value - visitors.prev,
formatValue: (n: number) => intl.formatNumber(+n, formatLongNumberOptions(+n)),
formatValue: (n: number) => intl.formatNumber(n, formatLongNumberOptions(n)),
},
{
label: formatMessage(labels.bounceRate),

View file

@ -18,22 +18,22 @@ export function EventsMetricsBar({ websiteId }: { websiteId: string }) {
<MetricCard
value={data?.visitors?.value}
label={formatMessage(labels.visitors)}
formatValue={(n: number) => intl.formatNumber(+n, formatLongNumberOptions(+n))}
formatValue={(n: number) => intl.formatNumber(n, formatLongNumberOptions(n))}
/>
<MetricCard
value={data?.visits?.value}
label={formatMessage(labels.visits)}
formatValue={(n: number) => intl.formatNumber(+n, formatLongNumberOptions(+n))}
formatValue={(n: number) => intl.formatNumber(n, formatLongNumberOptions(n))}
/>
<MetricCard
value={data?.pageviews?.value}
label={formatMessage(labels.views)}
formatValue={(n: number) => intl.formatNumber(+n, formatLongNumberOptions(+n))}
formatValue={(n: number) => intl.formatNumber(n, formatLongNumberOptions(n))}
/>
<MetricCard
value={data?.events?.value}
label={formatMessage(labels.events)}
formatValue={(n: number) => intl.formatNumber(+n, formatLongNumberOptions(+n))}
formatValue={(n: number) => intl.formatNumber(n, formatLongNumberOptions(n))}
/>
</MetricsBar>
<WebsiteDateFilter websiteId={websiteId} />

View file

@ -17,25 +17,25 @@ export function RealtimeHeader({ data }: { data: RealtimeData }) {
className={styles.card}
label={formatMessage(labels.views)}
value={totals.views}
formatValue={(n: number) => intl.formatNumber(+n, formatLongNumberOptions(+n))}
formatValue={(n: number) => intl.formatNumber(n, formatLongNumberOptions(n))}
/>
<MetricCard
className={styles.card}
label={formatMessage(labels.visitors)}
value={totals.visitors}
formatValue={(n: number) => intl.formatNumber(+n, formatLongNumberOptions(+n))}
formatValue={(n: number) => intl.formatNumber(n, formatLongNumberOptions(n))}
/>
<MetricCard
className={styles.card}
label={formatMessage(labels.events)}
value={totals.events}
formatValue={(n: number) => intl.formatNumber(+n, formatLongNumberOptions(+n))}
formatValue={(n: number) => intl.formatNumber(n, formatLongNumberOptions(n))}
/>
<MetricCard
className={styles.card}
label={formatMessage(labels.countries)}
value={totals.countries}
formatValue={(n: number) => intl.formatNumber(+n, formatLongNumberOptions(+n))}
formatValue={(n: number) => intl.formatNumber(n, formatLongNumberOptions(n))}
/>
</div>
</div>

View file

@ -18,22 +18,22 @@ export function SessionsMetricsBar({ websiteId }: { websiteId: string }) {
<MetricCard
value={data?.visitors?.value}
label={formatMessage(labels.visitors)}
formatValue={(n: number) => intl.formatNumber(+n, formatLongNumberOptions(+n))}
formatValue={(n: number) => intl.formatNumber(n, formatLongNumberOptions(n))}
/>
<MetricCard
value={data?.visits?.value}
label={formatMessage(labels.visits)}
formatValue={(n: number) => intl.formatNumber(+n, formatLongNumberOptions(+n))}
formatValue={(n: number) => intl.formatNumber(n, formatLongNumberOptions(n))}
/>
<MetricCard
value={data?.pageviews?.value}
label={formatMessage(labels.views)}
formatValue={(n: number) => intl.formatNumber(+n, formatLongNumberOptions(+n))}
formatValue={(n: number) => intl.formatNumber(n, formatLongNumberOptions(n))}
/>
<MetricCard
value={data?.countries?.value}
label={formatMessage(labels.countries)}
formatValue={(n: number) => intl.formatNumber(+n, formatLongNumberOptions(+n))}
formatValue={(n: number) => intl.formatNumber(n, formatLongNumberOptions(n))}
/>
</MetricsBar>
<WebsiteDateFilter websiteId={websiteId} />

View file

@ -13,17 +13,17 @@ export function SessionStats({ data }) {
<MetricCard
label={formatMessage(labels.visits)}
value={data?.visits}
formatValue={(n: number) => intl.formatNumber(+n, formatLongNumberOptions(+n))}
formatValue={(n: number) => intl.formatNumber(n, formatLongNumberOptions(n))}
/>
<MetricCard
label={formatMessage(labels.views)}
value={data?.views}
formatValue={(n: number) => intl.formatNumber(+n, formatLongNumberOptions(+n))}
formatValue={(n: number) => intl.formatNumber(n, formatLongNumberOptions(n))}
/>
<MetricCard
label={formatMessage(labels.events)}
value={data?.events}
formatValue={(n: number) => intl.formatNumber(+n, formatLongNumberOptions(+n))}
formatValue={(n: number) => intl.formatNumber(n, formatLongNumberOptions(n))}
/>
<MetricCard
label={formatMessage(labels.visitDuration)}

View file

@ -97,7 +97,7 @@ const AnimatedRow = ({ label, value = 0, percent, change, animate, showPercentag
<div className={styles.value}>
{change}
<animated.div className={styles.value} title={props?.y as any}>
{props.y?.to((n: number) => intl.formatNumber(+n, formatLongNumberOptions(+n)))}
{props.y?.to((n: number) => intl.formatNumber(n, formatLongNumberOptions(n)))}
</animated.div>
</div>
{showPercentage && (