From c8f407b52fa2b9f33709f521f6ea398b61e2ced6 Mon Sep 17 00:00:00 2001
From: pbca26 <pbca26@gmail.com>
Date: Tue, 16 May 2017 08:29:18 +0300
Subject: [PATCH] addcoin modal animation

---
 react/src/components/addcoin/addcoin.js       | 15 ++++++++++++---
 react/src/components/dashboard/receiveCoin.js |  4 ++--
 react/src/components/dashboard/walletsData.js |  2 +-
 3 files changed, 15 insertions(+), 6 deletions(-)

diff --git a/react/src/components/addcoin/addcoin.js b/react/src/components/addcoin/addcoin.js
index 4f55e92..725b509 100644
--- a/react/src/components/addcoin/addcoin.js
+++ b/react/src/components/addcoin/addcoin.js
@@ -36,6 +36,7 @@ class AddCoin extends React.Component {
       },
       display: false,
       actionsMenu: false,
+      modalClassName: 'hide',
     };
     this.activateCoin = this.activateCoin.bind(this);
     this.dismiss = this.dismiss.bind(this);
@@ -56,7 +57,7 @@ class AddCoin extends React.Component {
   loadCoinSelection() {
     shepherdGetCoinList()
     .then(function(json) {
-      if (json.msg !== 'error') {      
+      if (json.msg !== 'error') {
         this.setState(Object.assign({}, this.state, {
           coins: json.result,
           actionsMenu: false,
@@ -90,10 +91,18 @@ class AddCoin extends React.Component {
   }
 
   componentWillReceiveProps(props) {
-    if (props) {
+    if (props && props.display !== this.state.display) {
       this.setState(Object.assign({}, this.state, {
         display: props.display,
+        modalClassName: props.display ? 'show fade' : 'show fade',
       }));
+
+      setTimeout(function() {
+        this.setState(Object.assign({}, this.state, {
+          display: props.display,
+          modalClassName: props.display ? 'show in' : 'hide',
+        }));
+      }.bind(this), 100);
     }
   }
 
@@ -307,7 +316,7 @@ class AddCoin extends React.Component {
     return (
       <div>
         <div
-          className={'modal modal-3d-sign add-coin-modal ' + (this.state.display ? 'show in' : 'fade hide')}
+          className={'modal modal-3d-sign add-coin-modal ' + this.state.modalClassName}
           id="AddCoinDilogModel-login"
           aria-hidden="true"
           aria-labelledby="AddCoinDilogModel-login"
diff --git a/react/src/components/dashboard/receiveCoin.js b/react/src/components/dashboard/receiveCoin.js
index e3f362f..843f4ee 100644
--- a/react/src/components/dashboard/receiveCoin.js
+++ b/react/src/components/dashboard/receiveCoin.js
@@ -66,10 +66,10 @@ class ReceiveCoin extends React.Component {
         let address = this.props.addresses.public[i];
 
         if (this.props.mode === 'basilisk' && address.amount === 'N/A') {
-          address.amount = this.props.cache[this.props.coin][address.address].getbalance.data && this.props.cache[this.props.coin][address.address].getbalance.data.balance ? this.props.cache[this.props.coin][address.address].getbalance.data.balance : 'N/A';
+          address.amount = this.props.cache && this.props.cache[this.props.coin][address.address] && this.props.cache[this.props.coin][address.address].getbalance.data && this.props.cache[this.props.coin][address.address].getbalance.data.balance ? this.props.cache[this.props.coin][address.address].getbalance.data.balance : 'N/A';
         }
         if (this.props.mode === 'basilisk' && (address.interest === 'N/A' || !address.interest)) {
-          address.interest = this.props.cache[this.props.coin][address.address].getbalance.data && this.props.cache[this.props.coin][address.address].getbalance.data.interest ? this.props.cache[this.props.coin][address.address].getbalance.data.interest : 'N/A';
+          address.interest = this.props.cache && this.props.cache[this.props.coin][address.address] && this.props.cache[this.props.coin][address.address].getbalance.data && this.props.cache[this.props.coin][address.address].getbalance.data.interest ? this.props.cache[this.props.coin][address.address].getbalance.data.interest : 'N/A';
         }
 
         items.push(
diff --git a/react/src/components/dashboard/walletsData.js b/react/src/components/dashboard/walletsData.js
index 010f1ec..db51a4d 100644
--- a/react/src/components/dashboard/walletsData.js
+++ b/react/src/components/dashboard/walletsData.js
@@ -430,7 +430,7 @@ class WalletsData extends React.Component {
           let _amount = address.amount;
 
           if (this.props.ActiveCoin.mode === 'basilisk') {
-            _amount = this.props.ActiveCoin.cache[this.props.ActiveCoin.coin][address.address] && this.props.ActiveCoin.cache[this.props.ActiveCoin.coin][address.address].getbalance.data && this.props.ActiveCoin.cache[this.props.ActiveCoin.coin][address.address].getbalance.data.balance ? this.props.ActiveCoin.cache[this.props.ActiveCoin.coin][address.address].getbalance.data.balance : 'N/A';
+            _amount = this.props.ActiveCoin.cache && this.props.ActiveCoin.cache[this.props.ActiveCoin.coin][address.address] && this.props.ActiveCoin.cache[this.props.ActiveCoin.coin][address.address].getbalance.data && this.props.ActiveCoin.cache[this.props.ActiveCoin.coin][address.address].getbalance.data.balance ? this.props.ActiveCoin.cache[this.props.ActiveCoin.coin][address.address].getbalance.data.balance : 'N/A';
           }
 
           items.push(