mirrors/owncast
1
0
Fork 0
mirror of https://github.com/owncast/owncast.git synced 2024-11-21 12:18:02 +03:00
Code Issues Projects Releases Packages Wiki Activity

Rework stream duration string formatting for the status bar (#3729)

Browse source 
* Use date-fns formatDuration to generate stream duration string

* Remove unneeded pluralize function
This commit is contained in:
mahmed2000 2024-05-03 10:03:26 +05:00 committed by GitHub
parent da46a2ff7f
commit d9ee7578d1
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 13 additions and 21 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

27
web/components/ui/Statusbar/Statusbar.tsx
View file

@ -1,9 +1,8 @@
import { intervalToDuration, formatDistanceToNow } from 'date-fns';
import { intervalToDuration, formatDistanceToNow, formatDuration } from 'date-fns';
import { FC, useEffect, useState } from 'react';
import dynamic from 'next/dynamic';
import classNames from 'classnames';
import styles from './Statusbar.module.scss';
import { pluralize } from '../../../utils/helpers';
// Lazy loaded components
@ -20,23 +19,23 @@ export type StatusbarProps = {
};
function makeDurationString(lastConnectTime: Date): string {
const DAY_LABEL = 'day';
const HOUR_LABEL = 'hour';
const MINUTE_LABEL = 'minute';
const SECOND_LABEL = 'second';
const diff = intervalToDuration({ start: lastConnectTime, end: new Date() });
if (diff.days >= 1) {
return `${diff.days} ${pluralize(DAY_LABEL, diff.days)}
${diff.hours} ${pluralize(HOUR_LABEL, diff.hours)}`;
return formatDuration({
days: diff.days,
hours: diff.hours > 0 ? diff.hours : 0,
});
}
if (diff.hours >= 1) {
return `${diff.hours} ${pluralize(HOUR_LABEL, diff.hours)} ${diff.minutes > 0 ? diff.minutes : ''}
${diff.minutes > 0 ? pluralize(MINUTE_LABEL, diff.minutes) : ''}`;
return formatDuration({
hours: diff.hours,
minutes: diff.minutes > 0 ? diff.minutes : 0,
});
}
return `${diff.minutes > 0 ? diff.minutes : ''} ${diff.minutes > 0 ? pluralize(MINUTE_LABEL, diff.minutes) : ''}
${diff.seconds > 0 ? diff.seconds : ''} ${diff.seconds > 0 ? pluralize(SECOND_LABEL, diff.seconds) : ''}`;
return formatDuration({
minutes: diff.minutes > 0 ? diff.minutes : 0,
seconds: diff.seconds > 0 ? diff.seconds : 0,
});
}
export const Statusbar: FC<StatusbarProps> = ({

7
web/utils/helpers.js
View file

@ -1,12 +1,5 @@
import UAParser from 'ua-parser-js';
export function pluralize(string, count) {
if (count === 1) {
return string;
}
return `${string}s`;
}
export function getDiffInDaysFromNow(timestamp) {
const time = typeof timestamp === 'string' ? new Date(timestamp) : timestamp;
return (new Date() - time) / (24 * 3600 * 1000);