err no longestchain, err no blocks alt. wording

react/src/components/dashboard/walletsProgress/walletsProgress.js

@@ -2,7 +2,6 @@ import React from 'react';
 import { connect } from 'react-redux';
 import { translate } from '../../../translate/translate';
 import {
-  SyncErrorLongestChainRender,
   SyncErrorBlocksRender,
   SyncPercentageRender,
   LoadingBlocksRender,
@@ -15,9 +14,33 @@ import {
 class WalletsProgress extends React.Component {
   constructor() {
     super();
+    this.state = {
+      prevProgress: {},
+    };
     this.isFullySynced = this.isFullySynced.bind(this);
   }
 
+  componentWillReceiveProps(props) {
+    if (props.ActiveCoin &&
+        props.ActiveCoin.progress &&
+        Number(props.ActiveCoin.progress.longestchain) === 0) {
+      let _progress = props.ActiveCoin.progress;
+
+      if (this.state.prevProgress &&
+          this.state.prevProgress.longestchain &&
+          Number(this.state.prevProgress.longestchain) > 0) {
+        _progress.longestchain = this.state.prevProgress.longestchain;
+      }
+      this.setState(Object.assign({}, this.state, {
+        prevProgress: _progress,
+      }));
+    } else {
+      this.setState(Object.assign({}, this.state, {
+        prevProgress: props.ActiveCoin.progress,
+      }));
+    }
+  }
+
   isFullySynced() {
     const _progress = this.props.ActiveCoin.progress;
 
@@ -96,6 +119,7 @@ class WalletsProgress extends React.Component {
 
   renderSyncPercentagePlaceholder() {
     const _progress = this.props.ActiveCoin.progress;
+    console.warn('renderSyncPercentagePlaceholder', _progress);
 
     // activating best chain
     if (_progress &&
@@ -112,12 +136,6 @@ class WalletsProgress extends React.Component {
       }
     }
 
-    if (_progress &&
-        _progress.blocks > 0 &&
-        _progress.longestchain === 0) {
-      return SyncErrorLongestChainRender.call(this);
-    }
-
     if (_progress &&
         _progress.blocks === 0) {
       return SyncErrorBlocksRender.call(this);
@@ -125,7 +143,7 @@ class WalletsProgress extends React.Component {
 
     if (_progress &&
         _progress.blocks) {
-      const syncPercentage = (parseFloat(parseInt(_progress.blocks, 10) * 100 / parseInt(_progress.longestchain, 10)).toFixed(2) + '%').replace('NaN', 0);
+      const syncPercentage = (parseFloat(parseInt(_progress.blocks, 10) * 100 / parseInt(Number(_progress.longestchain) || Number(this.state.prevProgress.longestchain), 10)).toFixed(2) + '%').replace('NaN', 0);
       return SyncPercentageRender.call(this, syncPercentage === 1000 ? 100 : syncPercentage);
     }
 

react/src/components/dashboard/walletsProgress/walletsProgress.render.js

@@ -1,14 +1,6 @@
 import React from 'react';
 import { translate } from '../../../translate/translate';
 
-export const SyncErrorLongestChainRender = function() {
-  return (
-    <div className="progress-bar progress-bar-info progress-bar-striped active full-width font-size-80-percent">
-      <span className="full-width">{ translate('INDEX.SYNC_ERR_LONGESTCHAIN') }</span>
-    </div>
-  );
-};
-
 export const SyncErrorBlocksRender = function() {
   return (
     <div className="progress-bar progress-bar-info progress-bar-striped active full-width font-size-80-percent">
@@ -27,13 +19,23 @@ export const SyncPercentageRender = function(syncPercentage) {
       </div>
     );
   } else {
-    return (
-      <div
-        className="progress-bar progress-bar-info progress-bar-striped active font-size-80-percent"
-        style={{ width: syncPercentage }}>
-        <span style={{ width: syncPercentage }}>{ syncPercentage } | { this.props.ActiveCoin.progress.blocks } / { this.props.ActiveCoin.progress.longestchain } | { translate('INDEX.CONNECTIONS') }: { this.props.ActiveCoin.progress.connections }</span>
-      </div>
-    );
+    if (syncPercentage === 'Infinity%') {
+      return (
+        <div
+          className="progress-bar progress-bar-info progress-bar-striped active font-size-80-percent"
+          style={{ width: syncPercentage }}>
+          <span style={{ width: syncPercentage }}>Blocks: { this.props.ActiveCoin.progress.blocks } | { translate('INDEX.CONNECTIONS') }: { this.props.ActiveCoin.progress.connections }</span>
+        </div>
+      );
+    } else {
+      return (
+        <div
+          className="progress-bar progress-bar-info progress-bar-striped active font-size-80-percent"
+          style={{ width: syncPercentage }}>
+          <span style={{ width: syncPercentage }}>{ syncPercentage === '100.00%' ? '100%' : syncPercentage } | { this.props.ActiveCoin.progress.blocks } / { this.props.ActiveCoin.progress.longestchain } | { translate('INDEX.CONNECTIONS') }: { this.props.ActiveCoin.progress.connections }</span>
+        </div>
+      );
+    }
   }
 };
 

react/src/translate/en.js

@@ -121,8 +121,7 @@ export const _lang = {
       'PREVIOUS': 'Previous',
       'NEXT': 'Next',
       'ENTRIES_SM': 'entries',
-      'SYNC_ERR_LONGESTCHAIN': 'Unable to get current sync progress. Err: no longestchain param in response',
-      'SYNC_ERR_BLOCKS': 'Unable to get current sync progress. Err: no blocks param in response',
+      'SYNC_ERR_BLOCKS': 'Connecting to peers...',
       'COIN_IS_BUSY': 'Coin is busy processing',
       'REFRESHING_BASILISK_NET': 'Refreshing Basilisk Network Connections',
       'SELECT_A_COIN': 'Select Coin to add to Agama Wallet',