move common time functions

interface/src/project/DashboardData.tsx

@@ -27,8 +27,6 @@ import TableCell, { tableCellClasses } from '@mui/material/TableCell';
 
 import { styled } from '@mui/material/styles';
 
-import parseMilliseconds from 'parse-ms';
-
 import { useSnackbar } from 'notistack';
 
 import RefreshIcon from '@mui/icons-material/Refresh';
@@ -44,6 +42,8 @@ import DeviceIcon from './DeviceIcon';
 
 import { IconContext } from 'react-icons';
 
+import { formatDurationMin, pluralize } from '../utils';
+
 import { AuthenticatedContext } from '../contexts/authentication';
 
 import { ButtonRow, FormLoader, ValidatedTextField, SectionContent, MessageBox } from '../components';
@@ -152,33 +152,15 @@ const DashboardData: FC = () => {
     }
   };
 
-  const pluralize = (count: number, noun: string, suffix = 's') =>
-    ` ${Intl.NumberFormat().format(count)} ${noun}${count !== 1 ? suffix : ''} `;
-
-  const formatDuration = (duration_min: number) => {
-    const { days, hours, minutes } = parseMilliseconds(duration_min * 60000);
-    let formatted = '';
-    if (days) {
-      formatted += pluralize(days, 'day');
-    }
-    if (hours) {
-      formatted += pluralize(hours, 'hour');
-    }
-    if (minutes) {
-      formatted += pluralize(minutes, 'minute');
-    }
-    return formatted;
-  };
-
   function formatValue(value: any, uom: number) {
     if (value === undefined) {
       return '';
     }
     switch (uom) {
       case DeviceValueUOM.HOURS:
-        return value ? formatDuration(value * 60) : '0 hours';
+        return value ? formatDurationMin(value * 60) : '0 hours';
       case DeviceValueUOM.MINUTES:
-        return value ? formatDuration(value) : '0 minutes';
+        return value ? formatDurationMin(value) : '0 minutes';
       case DeviceValueUOM.NONE:
         if (typeof value === 'number') {
           return new Intl.NumberFormat().format(value);

interface/src/project/DashboardStatus.tsx

@@ -34,6 +34,8 @@ import { ButtonRow, FormLoader, SectionContent } from '../components';
 
 import { Status, busConnectionStatus } from './types';
 
+import { formatDurationSec, pluralize } from '../utils';
+
 import * as EMSESP from './api';
 
 import { extractErrorMessage, useRest } from '../utils';
@@ -66,27 +68,6 @@ const busStatus = ({ status }: Status) => {
   }
 };
 
-const pluralize = (count: number, noun: string) =>
-  `${Intl.NumberFormat().format(count)} ${noun}${count !== 1 ? 's' : ''}`;
-
-const formatDuration = (duration_sec: number) => {
-  if (duration_sec === 0) {
-    return ' ';
-  }
-  const roundTowardsZero = duration_sec > 0 ? Math.floor : Math.ceil;
-  return (
-    ', ' +
-    roundTowardsZero(duration_sec / 86400) +
-    'd ' +
-    (roundTowardsZero(duration_sec / 3600) % 24) +
-    'h ' +
-    (roundTowardsZero(duration_sec / 60) % 60) +
-    'm ' +
-    (roundTowardsZero(duration_sec) % 60) +
-    's'
-  );
-};
-
 const formatRow = (name: string, success: number, fail: number, quality: number) => {
   if (success === 0 && fail === 0) {
     return (
@@ -182,7 +163,7 @@ const DashboardStatus: FC = () => {
                 <DirectionsBusIcon />
               </Avatar>
             </ListItemAvatar>
-            <ListItemText primary="EMS Bus Status" secondary={busStatus(data) + formatDuration(data.uptime)} />
+            <ListItemText primary="EMS Bus Status" secondary={busStatus(data) + formatDurationSec(data.uptime)} />
           </ListItem>
           <ListItem>
             <ListItemAvatar>

interface/src/utils/time.ts

@@ -18,23 +18,38 @@ export const formatLocalDateTime = (date: Date) => {
   return new Date(date.getTime() - date.getTimezoneOffset() * 60000).toISOString().slice(0, -1).substr(0, 19);
 };
 
-export const formatDuration = (duration: number) => {
-  const { days, hours, minutes, seconds } = parseMilliseconds(duration * 1000);
-  var formatted = '';
+export const pluralize = (count: number, noun: string) =>
+  `${Intl.NumberFormat().format(count)} ${noun}${count !== 1 ? 's' : ''}`;
+
+export const formatDurationMin = (duration_min: number) => {
+  const { days, hours, minutes } = parseMilliseconds(duration_min * 60000);
+  let formatted = '';
   if (days) {
-    formatted += pluralize(days, 'day');
+    formatted += pluralize(days, 'day') + ' ';
   }
-  if (formatted || hours) {
-    formatted += pluralize(hours, 'hour');
+  if (hours) {
+    formatted += pluralize(hours, 'hour') + ' ';
   }
-  if (formatted || minutes) {
-    formatted += pluralize(minutes, 'minute');
-  }
-  if (formatted || seconds) {
-    formatted += pluralize(seconds, 'second');
+  if (minutes) {
+    formatted += pluralize(minutes, 'minute') + ' ';
   }
   return formatted;
 };
 
-const pluralize = (count: number, noun: string, suffix: string = 's') =>
-  ` ${count} ${noun}${count !== 1 ? suffix : ''} `;
+export const formatDurationSec = (duration_sec: number) => {
+  if (duration_sec === 0) {
+    return ' ';
+  }
+  const roundTowardsZero = duration_sec > 0 ? Math.floor : Math.ceil;
+  return (
+    ', ' +
+    roundTowardsZero(duration_sec / 86400) +
+    'd ' +
+    (roundTowardsZero(duration_sec / 3600) % 24) +
+    'h ' +
+    (roundTowardsZero(duration_sec / 60) % 60) +
+    'm ' +
+    (roundTowardsZero(duration_sec) % 60) +
+    's'
+  );
+};