feat(BCHA): Added price for BCHA

src/components/admin-lte/configure/index.js

@@ -38,6 +38,7 @@ class Configure extends React.Component {
               setWalletInfo={_this.props.setWalletInfo}
               walletInfo={_this.props.walletInfo}
               setBchWallet={_this.props.setBchWallet}
+              updateBalance={_this.props.updateBalance}
             />
 
             <JsonWebTokens
@@ -63,7 +64,9 @@ class Configure extends React.Component {
 Configure.propTypes = {
   setWalletInfo: PropTypes.func.isRequired,
   walletInfo: PropTypes.object.isRequired,
-  setBchWallet: PropTypes.func.isRequired
+  setBchWallet: PropTypes.func.isRequired,
+  updateBalance: PropTypes.func.isRequired
+
 }
 
 export default Configure

src/components/admin-lte/configure/servers.js

@@ -23,7 +23,8 @@ class Servers extends React.Component {
       errMsg: '',
       selectedServer: '',
       showAddField: false,
-      newServer: ''
+      newServer: '',
+      inFetch: false
     }
     _this.BchWallet = BchWallet
   }
@@ -32,7 +33,10 @@ class Servers extends React.Component {
     return (
       <Row>
         <Col sm={12}>
-          <Box className='hover-shadow border-none mt-2'>
+          <Box
+            className='hover-shadow border-none mt-2'
+            loaded={!_this.state.inFetch}
+          >
             <Row>
               <Col sm={12} className='text-center'>
                 <h1>
@@ -194,6 +198,11 @@ class Servers extends React.Component {
   }
 
   handleUpdateServer () {
+    // Show loader spinner
+    _this.setState({
+      inFetch: true
+    })
+
     _this.handleNewServerUrl()
     // await for state update delay
     setTimeout(() => {
@@ -224,12 +233,21 @@ class Servers extends React.Component {
         bchWalletLib.tokens.utxos.bchjs = new bchWalletLib.BCHJS(bchjsOptions)
 
         _this.props.setBchWallet(bchWalletLib)
+
+        // update server current price
+        _this.handleUpdateBalance(bchWalletLib)
+      } else {
+        // Hide loader spinner
+        _this.setState({
+          inFetch: false
+        })
       }
       _this.saveServer()
     } catch (error) {
       console.warn(error)
       _this.setState({
-        errMsg: error.message
+        errMsg: error.message,
+        inFetch: false
       })
     }
   }
@@ -263,6 +281,44 @@ class Servers extends React.Component {
     }
   }
 
+  // Get wallet balance
+  async handleUpdateBalance (bchWallet) {
+    try {
+      const { mnemonic } = _this.props.walletInfo
+      if (mnemonic && bchWallet) {
+        const bchWalletLib = bchWallet
+        await bchWalletLib.walletInfoPromise
+        const myBalance = await bchWalletLib.getBalance()
+
+        const bchjs = bchWalletLib.bchjs
+
+        let currentRate
+
+        if (bchjs.restURL.includes('abc.fullstack')) {
+          currentRate = await bchjs.Price.getBchaUsd()
+        } else {
+          // BCHN price.
+          currentRate = (await bchjs.Price.getUsd()) * 100
+        }
+
+        _this.setState({
+          currentRate: currentRate
+        })
+        _this.props.updateBalance({ myBalance, currentRate })
+      }
+      // Hide loader spinner
+      _this.setState({
+        inFetch: false
+      })
+    } catch (error) {
+      console.error(error)
+      // Hide loader spinner
+      _this.setState({
+        inFetch: false
+      })
+    }
+  }
+
   // clean the text form field
   resetForm () {
     _this.setState({
@@ -273,7 +329,8 @@ class Servers extends React.Component {
 Servers.propTypes = {
   setWalletInfo: PropTypes.func.isRequired,
   walletInfo: PropTypes.object.isRequired,
-  setBchWallet: PropTypes.func.isRequired
+  setBchWallet: PropTypes.func.isRequired,
+  updateBalance: PropTypes.func.isRequired
 }
 
 export default Servers

src/components/admin-lte/index.js

@@ -60,18 +60,18 @@ class AdminLTEPage extends React.Component {
         <AdminLTE
           title={[siteConfig.title]}
           titleShort={[siteConfig.titleShort]}
-          theme="blue"
+          theme='blue'
         >
           <Sidebar.Core>
-            <Item key="Balance" text="Balance" icon={siteConfig.balanceIcon}>
+            <Item key='Balance' text='Balance' icon={siteConfig.balanceIcon}>
               <Box
-                className="hover-shadow border-none background-none"
+                className='hover-shadow border-none background-none'
                 loaded={!_this.state.inFetch}
               >
-                <div className="sidebar-balance">
+                <div className='sidebar-balance'>
                   <div>
                     {!_this.state.inFetch && (
-                      <div className="siderbar-balance-content">
+                      <div className='siderbar-balance-content'>
                         <span>
                           <h3>{siteConfig.balanceText}</h3>
 
@@ -81,9 +81,9 @@ class AdminLTEPage extends React.Component {
                           <small>USD: ${_this.state.usdBalance}</small>
                         </span>
                         <FontAwesomeIcon
-                          className="ml-1 icon"
-                          size="lg"
-                          icon="redo"
+                          className='ml-1 icon'
+                          size='lg'
+                          icon='redo'
                           onClick={_this.handleGetBalance}
                         />
                       </div>
@@ -101,8 +101,8 @@ class AdminLTEPage extends React.Component {
           <Navbar.Core>
             <VersionStatus />
           </Navbar.Core>
-          <Layout path="/">
-            <div className="components-container">
+          <Layout path='/'>
+            <div className='components-container'>
               {_this.renderNewViewItems(_this.props)}
             </div>
           </Layout>
@@ -137,7 +137,6 @@ class AdminLTEPage extends React.Component {
 
         if (bchjs.restURL.includes('abc.fullstack')) {
           currentRate = await bchjs.Price.getBchaUsd()
-          console.log(`currentRate: ${currentRate}`)
         } else {
           // BCHN price.
           currentRate = (await bchjs.Price.getUsd()) * 100
@@ -198,6 +197,7 @@ class AdminLTEPage extends React.Component {
         _this.changeSection(_this.defaultSection)
       }
     }
+    _this.updateState()
   }
 
   // Update component state when props change
@@ -209,7 +209,11 @@ class AdminLTEPage extends React.Component {
     }
     if (_this.props.bchBalance.bchBalance !== _this.state.bchBalance) {
       _this.setState({
-        bchBalance: _this.props.bchBalance.bchBalance,
+        bchBalance: _this.props.bchBalance.bchBalance
+      })
+    }
+    if (_this.props.bchBalance.usdBalance !== _this.state.usdBalance) {
+      _this.setState({
         usdBalance: _this.props.bchBalance.usdBalance
       })
     }
@@ -358,7 +362,7 @@ class AdminLTEPage extends React.Component {
     return (
       <li style={{ display: 'none' }}>
         {/* Adding this childrens prevents console errors */}
-        <a href="#">
+        <a href='#'>
           <span />
           <span />
         </a>

src/components/admin-lte/wallet/import.js

@@ -148,8 +148,19 @@ class ImportWallet extends React.Component {
 
       const myBalance = await bchWalletLib.getBalance()
       const bchjs = bchWalletLib.bchjs
-      const currentRate = await bchjs.Price.getUsd() * 100
+      let currentRate
 
+      if (bchjs.restURL.includes('abc.fullstack')) {
+        currentRate = await bchjs.Price.getBchaUsd()
+      } else {
+        // BCHN price.
+        currentRate = (await bchjs.Price.getUsd()) * 100
+      }
+
+      _this.setState({
+        currentRate: currentRate
+      })
+      _this.props.updateBalance({ myBalance, currentRate })
       // Update redux state
       _this.props.setWalletInfo(currentWallet)
       _this.props.updateBalance({ myBalance, currentRate })

src/redux/createStore.js

@@ -28,6 +28,7 @@ const reducer = (state, action) => {
   if (action.type === 'UPDATE_BALANCE') {
     // Convert satoshis to bch
     const { myBalance, currentRate } = action.value
+    console.log(`currentRate: ${currentRate}`)
 
     const satoshis = myBalance
     const bch = satoshis / 100000000