Refactor code

3 files changed, 24 insertions, 26 deletions

diff --git a/gui/src/renderer/components/Account.tsx b/gui/src/renderer/components/Account.tsx
index aaa3b637c9..7864bfa0da 100644
--- a/gui/src/renderer/components/Account.tsx
+++ b/gui/src/renderer/components/Account.tsx
@@ -1,7 +1,7 @@
-import moment from 'moment';
 import * as React from 'react';
 import { Component, Text, View } from 'reactxp';
 import { pgettext } from '../../shared/gettext';
+import AccountExpiry from '../lib/account-expiry';
 import styles from './AccountStyles';
 import * as AppButton from './AppButton';
 import ClipboardLabel from './ClipboardLabel';
@@ -85,33 +85,21 @@ export default class Account extends Component<IProps> {
 }
 
 function FormattedAccountExpiry(props: { expiry?: string; locale: string }) {
-  if (!props.expiry) {
+  if (props.expiry) {
+    const expiry = new AccountExpiry(props.expiry, props.locale);
+
+    if (expiry.hasExpired()) {
+      return (
+        <Text style={styles.account__out_of_time}>{pgettext('account-view', 'OUT OF TIME')}</Text>
+      );
+    } else {
+      return <Text style={styles.account__row_value}>{expiry.formattedDate()}</Text>;
+    }
+  } else {
     return (
       <Text style={styles.account__row_value}>
         {pgettext('account-view', 'Currently unavailable')}
       </Text>
     );
   }
-
-  const expiry = moment(props.expiry);
-
-  if (expiry.isSameOrBefore(moment())) {
-    return (
-      <Text style={styles.account__out_of_time}>{pgettext('account-view', 'OUT OF TIME')}</Text>
-    );
-  }
-
-  const formatOptions = {
-    day: 'numeric',
-    month: 'long',
-    year: 'numeric',
-    hour: 'numeric',
-    minute: 'numeric',
-  };
-
-  return (
-    <Text style={styles.account__row_value}>
-      {expiry.toDate().toLocaleString(props.locale, formatOptions)}
-    </Text>
-  );
 }
diff --git a/gui/src/renderer/components/NotificationArea.tsx b/gui/src/renderer/components/NotificationArea.tsx
index 543ba90edf..15c5786bc2 100644
--- a/gui/src/renderer/components/NotificationArea.tsx
+++ b/gui/src/renderer/components/NotificationArea.tsx
@@ -150,7 +150,14 @@ export default class NotificationArea extends Component<IProps, State> {
           };
         }
 
-        if (accountExpiry && accountExpiry.willHaveExpiredIn(moment().add(3, 'days'))) {
+        if (
+          accountExpiry &&
+          accountExpiry.willHaveExpiredAt(
+            moment()
+              .add(3, 'days')
+              .toDate(),
+          )
+        ) {
           return {
             visible: true,
             type: 'expires-soon',
diff --git a/gui/src/renderer/components/Settings.tsx b/gui/src/renderer/components/Settings.tsx
index 610de163af..146cfa05b7 100644
--- a/gui/src/renderer/components/Settings.tsx
+++ b/gui/src/renderer/components/Settings.tsx
@@ -22,6 +22,7 @@ import { LoginState } from '../redux/account/reducers';
 export interface IProps {
   loginState: LoginState;
   accountExpiry?: string;
+  expiryLocale: string;
   appVersion: string;
   consistentVersion: boolean;
   upToDateVersion: boolean;
@@ -88,7 +89,9 @@ export default class Settings extends Component<IProps> {
       return null;
     }
 
-    const expiry = this.props.accountExpiry ? new AccountExpiry(this.props.accountExpiry) : null;
+    const expiry = this.props.accountExpiry
+      ? new AccountExpiry(this.props.accountExpiry, this.props.expiryLocale)
+      : null;
     const isOutOfTime = expiry ? expiry.hasExpired() : false;
     const formattedExpiry = expiry ? expiry.remainingTime().toUpperCase() : '';