update ntp lib to moment

interface/src/ntp/NTPStatusForm.tsx

@@ -13,7 +13,7 @@ import RefreshIcon from '@material-ui/icons/Refresh';
 
 import { RestFormProps, FormButton, HighlightAvatar } from '../components';
 import { isNtpActive, ntpStatusHighlight, ntpStatus } from './NTPStatus';
-import { formatDuration, formatDateTime, formatLocalDateTimeNow, formatLocalDateTime } from './TimeFormat';
+import { formatDuration, formatDateTime, formatLocalDateTime } from './TimeFormat';
 import { NTPStatus, Time } from './types';
 import { redirectingAuthorizedFetch, withAuthenticatedContext, AuthenticatedContextProps } from '../authentication';
 import { TIME_ENDPOINT } from '../api';
@@ -38,18 +38,27 @@ class NTPStatusForm extends Component<NTPStatusFormProps, NTPStatusFormState> {
   }
 
   updateLocalTime = (event: React.ChangeEvent<HTMLInputElement>) => {
-    this.setState({ localTime: event.target.value });
+    this.setState({
+      localTime: event.target.value
+    });
   }
 
   openSetTime = () => {
-    this.setState({ localTime: formatLocalDateTimeNow(), settingTime: true, });
+    this.setState({
+      localTime: formatLocalDateTime(new Date()),
+      settingTime: true
+    });
   }
 
   closeSetTime = () => {
-    this.setState({ settingTime: false });
+    this.setState({
+      settingTime: false
+    });
   }
 
-  createTime = (): Time => ({ local_time: formatLocalDateTime(this.state.localTime) });
+  createTime = (): Time => ({
+    local_time: formatLocalDateTime(new Date(this.state.localTime))
+  });
 
   configureTime = () => {
     this.setState({ processing: true });
@@ -185,4 +194,4 @@ class NTPStatusForm extends Component<NTPStatusFormProps, NTPStatusFormState> {
   }
 }
 
-export default withAuthenticatedContext(withTheme(NTPStatusForm));
+export default withAuthenticatedContext(withTheme(NTPStatusForm));

interface/src/ntp/TimeFormat.ts

@@ -1,45 +1,45 @@
 import parseMilliseconds from 'parse-ms';
 
-const LOCALE_FORMAT = new Intl.DateTimeFormat('default', {
-  day: 'numeric',
-  month: 'short',
-  year: 'numeric',
-  hour: 'numeric',
-  minute: 'numeric',
-  second: 'numeric',
-  hour12: false
-});
+const LOCALE_FORMAT = new Intl.DateTimeFormat(
+  [...window.navigator.languages],
+  {
+    day: 'numeric',
+    month: 'short',
+    year: 'numeric',
+    hour: 'numeric',
+    minute: 'numeric',
+    second: 'numeric',
+    hour12: false
+  }
+);
 
 export const formatDateTime = (dateTime: string) => {
   return LOCALE_FORMAT.format(new Date(dateTime.substr(0, 19)));
 }
 
-export const formatLocalDateTimeNow = () => {
-  return formatIsoDateTime(new Date()).substr(0, 19);
-}
-
-export const formatLocalDateTime = (dateTime: string) => {
-  return formatIsoDateTime(new Date(dateTime)).substr(0, 19);
-}
-
-export const formatIsoDateTime = (date: Date) => {
-  return new Date(date.getTime() - date.getTimezoneOffset() * 60000).toISOString().slice(0, -1);
+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 = '';
   if (days) {
-    formatted += days + ' days ';
+    formatted += pluralize(days, 'day');
   }
   if (formatted || hours) {
-    formatted += hours + ' hours ';
+    formatted += pluralize(hours, 'hour');
   }
   if (formatted || minutes) {
-    formatted += minutes + ' minutes ';
+    formatted += pluralize(minutes, 'minute');
   }
   if (formatted || seconds) {
-    formatted += seconds + ' seconds';
+    formatted += pluralize(seconds, 'second');
   }
   return formatted;
-}
+}
+
+const pluralize = (count: number, noun: string, suffix: string = 's') => ` ${count} ${noun}${count !== 1 ? suffix : ''} `;

interface/src/ntp/types.ts

@@ -1,4 +1,3 @@
-  
 export enum NTPSyncStatus {
   NTP_INACTIVE = 0,
   NTP_ACTIVE = 1