Latest update conversion date - issue #10741 (#12422)

* conversion date fix

* update in settings conversion date - no internet

* update conversionDate fetch - setting container

* no currency date message updated

app/_locales/en/messages.json

@@ -1782,6 +1782,9 @@
   "noAlreadyHaveSeed": {
     "message": "No, I already have a Secret Recovery Phrase"
   },
+  "noConversionDateAvailable": {
+    "message": "No Currency Conversion Date Available"
+  },
   "noConversionRateAvailable": {
     "message": "No Conversion Rate Available"
   },

ui/pages/settings/settings-tab/settings-tab.component.js

@@ -37,24 +37,32 @@ export default class SettingsTab extends PureComponent {
     currentLocale: PropTypes.string,
     useBlockie: PropTypes.bool,
     currentCurrency: PropTypes.string,
-    conversionDate: PropTypes.number,
     nativeCurrency: PropTypes.string,
     useNativeCurrencyAsPrimaryCurrency: PropTypes.bool,
     setUseNativeCurrencyAsPrimaryCurrencyPreference: PropTypes.func,
     hideZeroBalanceTokens: PropTypes.bool,
     setHideZeroBalanceTokens: PropTypes.func,
+    lastFetchedConversionDate: PropTypes.number,
   };
 
   renderCurrentConversion() {
     const { t } = this.context;
-    const { currentCurrency, conversionDate, setCurrentCurrency } = this.props;
+    const {
+      currentCurrency,
+      setCurrentCurrency,
+      lastFetchedConversionDate,
+    } = this.props;
 
     return (
       <div className="settings-page__content-row">
         <div className="settings-page__content-item">
           <span>{t('currencyConversion')}</span>
           <span className="settings-page__content-description">
-            {t('updatedWithDate', [Date(conversionDate)])}
+            {lastFetchedConversionDate
+              ? t('updatedWithDate', [
+                  new Date(lastFetchedConversionDate * 1000).toString(),
+                ])
+              : t('noConversionDateAvailable')}
           </span>
         </div>
         <div className="settings-page__content-item">

ui/pages/settings/settings-tab/settings-tab.container.js

@@ -10,14 +10,13 @@ import {
 import { getPreferences } from '../../../selectors';
 import SettingsTab from './settings-tab.component';
 
-const mapStateToProps = (state) => {
+const mapStateToProps = (state, ownProps) => {
   const {
     appState: { warning },
     metamask,
   } = state;
   const {
     currentCurrency,
-    conversionDate,
     nativeCurrency,
     useBlockie,
     currentLocale,
@@ -27,15 +26,17 @@ const mapStateToProps = (state) => {
     hideZeroBalanceTokens,
   } = getPreferences(state);
 
+  const { lastFetchedConversionDate } = ownProps;
+
   return {
     warning,
     currentLocale,
     currentCurrency,
-    conversionDate,
     nativeCurrency,
     useBlockie,
     useNativeCurrencyAsPrimaryCurrency,
     hideZeroBalanceTokens,
+    lastFetchedConversionDate,
   };
 };
 

ui/pages/settings/settings.component.js

@@ -41,12 +41,32 @@ class SettingsPage extends PureComponent {
     initialBreadCrumbKey: PropTypes.string,
     mostRecentOverviewPage: PropTypes.string.isRequired,
     addNewNetwork: PropTypes.bool,
+    conversionDate: PropTypes.number,
   };
 
   static contextTypes = {
     t: PropTypes.func,
   };
 
+  state = {
+    lastFetchedConversionDate: null,
+  };
+
+  componentDidMount() {
+    this.handleConversionDate();
+  }
+
+  componentDidUpdate() {
+    this.handleConversionDate();
+  }
+
+  handleConversionDate() {
+    const { conversionDate } = this.props;
+    if (conversionDate !== null) {
+      this.setState({ lastFetchedConversionDate: conversionDate });
+    }
+  }
+
   render() {
     const {
       history,
@@ -227,7 +247,16 @@ class SettingsPage extends PureComponent {
   renderContent() {
     return (
       <Switch>
-        <Route exact path={GENERAL_ROUTE} component={SettingsTab} />
+        <Route
+          exact
+          path={GENERAL_ROUTE}
+          render={(routeProps) => (
+            <SettingsTab
+              {...routeProps}
+              lastFetchedConversionDate={this.state.lastFetchedConversionDate}
+            />
+          )}
+        />
         <Route exact path={ABOUT_US_ROUTE} component={InfoTab} />
         <Route exact path={ADVANCED_ROUTE} component={AdvancedTab} />
         <Route exact path={ALERTS_ROUTE} component={AlertsTab} />
@@ -251,7 +280,14 @@ class SettingsPage extends PureComponent {
           path={`${CONTACT_VIEW_ROUTE}/:id`}
           component={ContactListTab}
         />
-        <Route component={SettingsTab} />
+        <Route
+          render={(routeProps) => (
+            <SettingsTab
+              {...routeProps}
+              lastFetchedConversionDate={this.state.lastFetchedConversionDate}
+            />
+          )}
+        />
       </Switch>
     );
   }

ui/pages/settings/settings.container.js

@@ -47,6 +47,10 @@ const ROUTES_TO_I18N_KEYS = {
 const mapStateToProps = (state, ownProps) => {
   const { location } = ownProps;
   const { pathname } = location;
+  const {
+    metamask: { conversionDate },
+  } = state;
+
   const pathNameTail = pathname.match(/[^/]+$/u)[0];
 
   const isAddressEntryPage = pathNameTail.includes('0x');
@@ -91,6 +95,7 @@ const mapStateToProps = (state, ownProps) => {
     initialBreadCrumbKey,
     mostRecentOverviewPage: getMostRecentOverviewPage(state),
     addNewNetwork,
+    conversionDate,
   };
 };