watson/umami
1
0
Fork 0
mirror of https://github.com/umami-software/umami.git synced 2026-02-19 20:15:41 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

formatShortTime

Browse source
This commit is contained in:
Minseo Lee 2024-08-30 22:32:47 +09:00
parent 8b80a774fd
commit 504e4c926b
5 changed files with 36 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

6
src/app/(main)/reports/insights/InsightsTable.tsx
View file

@ -67,7 +67,11 @@ export function InsightsTable() {
>
{row => {
const n = row?.totaltime / row?.visits;
return `${+n < 0 ? '-' : ''}${formatShortTime(intl, Math.abs(~~n))}`;
return `${+n < 0 ? '-' : ''}${formatShortTime(
intl,
{ formatMessage, labels },
Math.abs(~~n),
)}`;
}}
</GridColumn>
</GridTable>

7
src/app/(main)/websites/[websiteId]/WebsiteMetricsBar.tsx
View file

@ -72,7 +72,12 @@ 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(intl, Math.abs(~~n))}`,
formatValue: (n: number) =>
`${+n < 0 ? '-' : ''}${formatShortTime(
intl,
{ formatMessage, labels },
Math.abs(~~n),
)}`,
},
]
: [];

4
src/app/(main)/websites/[websiteId]/sessions/[sessionId]/SessionStats.tsx
View file

@ -28,7 +28,9 @@ export function SessionStats({ data }) {
<MetricCard
label={formatMessage(labels.visitDuration)}
value={data?.totaltime / data?.visits}
formatValue={n => `${+n < 0 ? '-' : ''}${formatShortTime(intl, Math.abs(~~n))}`}
formatValue={n =>
`${+n < 0 ? '-' : ''}${formatShortTime(intl, { formatMessage, labels }, Math.abs(~~n))}`
}
/>
</MetricsBar>
);

5
src/components/messages.ts
View file

@ -278,6 +278,11 @@ export const labels = defineMessages({
lastSeen: { id: 'label.last-seen', defaultMessage: 'Last seen' },
firstSeen: { id: 'label.first-seen', defaultMessage: 'First seen' },
properties: { id: 'label.properties', defaultMessage: 'Properties' },
days: { id: 'label.days', defaultMessage: '{x}d' },
hours: { id: 'label.hours', defaultMessage: '{x}h' },
minutes: { id: 'label.minutes', defaultMessage: '{x}m' },
seconds: { id: 'label.seconds', defaultMessage: '{x}s' },
milliseconds: { id: 'label.milliseconds', defaultMessage: '{x}ms' },
});
export const messages = defineMessages({

23
src/lib/format.ts
View file

@ -25,15 +25,26 @@ export function formatTime(val: number) {
return `${h}${m}:${s}`;
}
export function formatShortTime(intl: IntlShape, val: number, formats = ['m', 's']) {
export function formatShortTime(
intl: IntlShape,
useMessages: any,
val: number,
formats = ['m', 's'],
) {
const { formatMessage, labels } = useMessages;
const { days, hours, minutes, seconds, ms } = parseTime(val);
let t = '';
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 (days > 0 && formats.indexOf('d') !== -1)
t += `${formatMessage(labels.days, { x: intl.formatNumber(days) })} `;
if (hours > 0 && formats.indexOf('h') !== -1)
t += `${formatMessage(labels.hours, { x: intl.formatNumber(hours) })} `;
if (minutes > 0 && formats.indexOf('m') !== -1)
t += `${formatMessage(labels.minutes, { x: intl.formatNumber(minutes) })} `;
if (seconds > 0 && formats.indexOf('s') !== -1)
t += `${formatMessage(labels.seconds, { x: intl.formatNumber(seconds) })} `;
if (ms > 0 && formats.indexOf('ms') !== -1)
t += formatMessage(labels.milliseconds, { x: intl.formatNumber(ms) });
if (!t) {
return `0${formats[formats.length - 1]}`;