formatShortTime

This commit is contained in:
Minseo Lee 2024-08-30 10:36:37 +09:00
parent 16f86c7715
commit 8f4a6278c4
3 changed files with 11 additions and 10 deletions

View file

@ -4,12 +4,14 @@ import { useFormat, useMessages } from 'components/hooks';
import { ReportContext } from '../[reportId]/Report';
import EmptyPlaceholder from 'components/common/EmptyPlaceholder';
import { formatShortTime } from 'lib/format';
import { useIntl } from 'react-intl';
export function InsightsTable() {
const [fields, setFields] = useState([]);
const { report } = useContext(ReportContext);
const { formatMessage, labels } = useMessages();
const { formatValue } = useFormat();
const intl = useIntl();
useEffect(
() => {
@ -65,7 +67,7 @@ export function InsightsTable() {
>
{row => {
const n = row?.totaltime / row?.visits;
return `${+n < 0 ? '-' : ''}${formatShortTime(Math.abs(~~n), ['m', 's'], ' ')}`;
return `${+n < 0 ? '-' : ''}${formatShortTime(intl, Math.abs(~~n))}`;
}}
</GridColumn>
</GridTable>

View file

@ -72,8 +72,7 @@ export function WebsiteMetricsBar({
value: totaltime.value / visits.value,
prev: totaltime.prev / visits.prev,
change: totaltime.value / visits.value - totaltime.prev / visits.prev,
formatValue: (n: number) =>
`${+n < 0 ? '-' : ''}${formatShortTime(Math.abs(~~n), ['m', 's'], ' ')}`,
formatValue: (n: number) => `${+n < 0 ? '-' : ''}${formatShortTime(intl, Math.abs(~~n))}`,
},
]
: [];

View file

@ -1,4 +1,4 @@
import type { FormatNumberOptions } from 'react-intl';
import type { FormatNumberOptions, IntlShape } from 'react-intl';
export function parseTime(val: number) {
const days = ~~(val / 86400);
@ -25,15 +25,15 @@ export function formatTime(val: number) {
return `${h}${m}:${s}`;
}
export function formatShortTime(val: number, formats = ['m', 's'], space = '') {
export function formatShortTime(intl: IntlShape, val: number, formats = ['m', 's']) {
const { days, hours, minutes, seconds, ms } = parseTime(val);
let t = '';
if (days > 0 && formats.indexOf('d') !== -1) t += `${days}d${space}`;
if (hours > 0 && formats.indexOf('h') !== -1) t += `${hours}h${space}`;
if (minutes > 0 && formats.indexOf('m') !== -1) t += `${minutes}m${space}`;
if (seconds > 0 && formats.indexOf('s') !== -1) t += `${seconds}s${space}`;
if (ms > 0 && formats.indexOf('ms') !== -1) t += `${ms}ms`;
if (days > 0 && formats.indexOf('d') !== -1) t += `${intl.formatNumber(days)}d `;
if (hours > 0 && formats.indexOf('h') !== -1) t += `${intl.formatNumber(hours)}h `;
if (minutes > 0 && formats.indexOf('m') !== -1) t += `${intl.formatNumber(minutes)}m `;
if (seconds > 0 && formats.indexOf('s') !== -1) t += `${intl.formatNumber(seconds)}s `;
if (ms > 0 && formats.indexOf('ms') !== -1) t += `${intl.formatNumber(ms)}ms`;
if (!t) {
return `0${formats[formats.length - 1]}`;