Fix home view use api to get balance

__tests__/containers/Home.test.js

@@ -12,7 +12,7 @@ describe('Home', () => {
     walletActions: {
       changeLabel: () => {},
     },
-    selectedNetworkId: 'TestNet',
+    currentNetwork: { name: 'TestNet', apiType: 'neoscan', url: 'http://testnet-api.wallet.cityofzion.io' },
     account: {
       address: 'ARjkxk6VcKPFKqRHhuLNog9TbdYxhKu9be',
       wif: 'KxyKz2LaFSCi2UQtpxnXs3jdzE5uAxguBRSgbiXMi6adkbivt2ub',
@@ -52,9 +52,9 @@ describe('Home', () => {
     wrapper.instance()._getAccountInfo = jest.fn()
     wrapper.update()
 
-    wrapper.instance().componentWillReceiveProps({ selectedNetworkId: 'MainNet' })
+    const currentNetwork = { name: 'MainNet', apiType: 'neoscan', url: 'http://api.wallet.cityofzion.io' }
+    wrapper.instance().componentWillReceiveProps({ currentNetwork: currentNetwork })
 
     expect(wrapper.instance()._getAccountInfo).toHaveBeenCalledTimes(1)
-    expect(wrapper.instance()._getAccountInfo).toHaveBeenCalledWith('MainNet')
   })
 })

src/app/components/AccountInfo/index.js

@@ -18,7 +18,6 @@ const AccountInfo = ({
   getBalance,
   showDropDown,
   toggleDropDownMenu,
-  network,
   updateBalance,
 }) => {
   let dropDownClasses = showDropDown
@@ -71,7 +70,7 @@ const AccountInfo = ({
             <img src={ neonPNG } alt='Neo' className={ style.accountInfoNeoAmountImg } />
             <p className={ style.accountInfoAmountParagraph }>{neo} NEO</p>
           </div>
-          <button className={ style.accountInfoRefreshButton } onClick={ () => updateBalance(network) }>
+          <button className={ style.accountInfoRefreshButton } onClick={ () => updateBalance() }>
             <i className='fas fa-sync' />
           </button>
           <div className={ style.accountInfoGasAmount }>
@@ -94,7 +93,6 @@ AccountInfo.propTypes = {
   getBalance: PropTypes.func.isRequired,
   showDropDown: PropTypes.bool.isRequired,
   toggleDropDownMenu: PropTypes.func.isRequired,
-  network: PropTypes.string.isRequired,
   updateBalance: PropTypes.func.isRequired,
 }
 

src/app/containers/Home/Home.js

@@ -1,7 +1,9 @@
 import React, { Component, Fragment } from 'react'
 import PropTypes from 'prop-types'
 
-import { getAccountName, validateLength, getBalance, getTransactions } from '../../utils/helpers'
+import { api } from '@cityofzion/neon-js'
+import { getAccountName, validateLength, getTransactions } from '../../utils/helpers'
+import { toBigNumber } from '../../utils/math'
 
 import AccountInfo from '../../components/AccountInfo'
 import RenameAccount from '../../components/RenameAccount'
@@ -31,7 +33,7 @@ class Home extends Component {
   }
 
   componentDidMount() {
-    this._getAccountInfo(this.props.selectedNetworkId)
+    this._getAccountInfo()
 
     window.addEventListener('click', this._closeDropDownMenu)
   }
@@ -41,26 +43,37 @@ class Home extends Component {
   }
 
   componentWillReceiveProps(props, newProps) {
-    this._getAccountInfo(props.selectedNetworkId)
+    this._getAccountInfo()
   }
 
-  getHomeScreenBalance = network => {
-    const { account } = this.props
+  getHomeScreenBalance = () => {
+    const { account, currentNetwork } = this.props
 
-    this.setState({ amountsError: '' }, () => {
-      getBalance(network, account)
-        .then(amounts => this.setState({ amounts }))
-        .catch(() => {
-          this.setState({ amountsError: 'Could not retrieve amounts.' })
+    this.setState({ amountsError: '' })
+
+    api[currentNetwork.apiType]
+      .getBalance(currentNetwork.url, account.address)
+      .then(result => {
+        console.log('getBalance: ', result)
+
+        this.setState({
+          amounts: {
+            neo: toBigNumber(result.assets.NEO.balance).toString(),
+            gas: toBigNumber(result.assets.GAS.balance).round(8).toString(),
+          },
         })
-    })
+      })
+      .catch(e => {
+        console.log('error: ', e)
+        this.setState({ amountsError: 'Could not retrieve amounts.' })
+      })
   }
 
-  getHomeScreenTransactions = network => {
-    const { account } = this.props
+  getHomeScreenTransactions = () => {
+    const { account, currentNetwork } = this.props
 
     this.setState({ transactionHistoryError: '' }, () => {
-      getTransactions(network, account)
+      getTransactions(currentNetwork, account)
         .then(results => this.setState({ transactionHistory: results }))
         .catch(() =>
           this.setState({
@@ -74,9 +87,9 @@ class Home extends Component {
     this.setState(prevState => ({ showDropDown: !prevState.showDropDown }))
   }
 
-  _getAccountInfo = network => {
-    this.getHomeScreenBalance(network)
-    this.getHomeScreenTransactions(network)
+  _getAccountInfo = () => {
+    this.getHomeScreenBalance()
+    this.getHomeScreenTransactions()
   }
 
   _closeDropDownMenu = event => {
@@ -107,7 +120,7 @@ class Home extends Component {
   }
 
   render() {
-    const { account, selectedNetworkId } = this.props
+    const { account, currentNetwork } = this.props
     const {
       amounts,
       showInputField,
@@ -142,7 +155,7 @@ class Home extends Component {
                 getBalance={ this.getHomeScreenBalance }
                 toggleDropDownMenu={ this.toggleDropDownMenu }
                 showDropDown={ showDropDown }
-                network={ selectedNetworkId }
+                network={ currentNetwork }
                 updateBalance={ this._getAccountInfo }
               />
             )}
@@ -165,7 +178,7 @@ export default Home
 
 Home.propTypes = {
   walletActions: PropTypes.object.isRequired,
-  selectedNetworkId: PropTypes.string.isRequired,
+  currentNetwork: PropTypes.object.isRequired,
   account: PropTypes.object.isRequired,
   accounts: PropTypes.object.isRequired,
 }

src/app/containers/Home/index.js

@@ -12,7 +12,7 @@ import Home from './Home'
 const mapStateToProps = state => ({
   account: state.account,
   accounts: state.wallet.accounts,
-  selectedNetworkId: state.config.selectedNetworkId,
+  currentNetwork: state.config.networks[state.config.selectedNetworkId],
 })
 
 const mapDispatchToProps = dispatch => ({