fix(simple buy): lockbox balance

packages/blockchain-wallet-v4-frontend/src/scenes/Home/Balances/CoinBalance/index.tsx

@@ -5,14 +5,12 @@ import { connect } from 'react-redux'
 import { getData } from './selectors'
 import { includes, toLower } from 'ramda'
 import { SkeletonRectangle } from 'blockchain-info-components'
+import { Props as TableProps } from '../Table'
 import Error from './template.error'
 import React from 'react'
 import Success from './template.success'
 
-type OwnProps = {
-  coin: CoinType
-  coinTicker: string
-}
+export type OwnProps = TableProps & { coin: CoinType }
 type LinkDispatchPropsType = {
   bchActions: typeof actions.core.data.bch
   btcActions: typeof actions.core.data.btc
@@ -58,7 +56,7 @@ class CoinBalance extends React.PureComponent<Props> {
   }
 }
 
-const mapStateToProps = (state, ownProps) => ({
+const mapStateToProps = (state, ownProps: OwnProps): LinkStatePropsType => ({
   data: getData(state, ownProps),
   erc20List: selectors.core.walletOptions.getErc20CoinList(state).getOrFail()
 })

packages/blockchain-wallet-v4-frontend/src/scenes/Home/Balances/CoinBalance/selectors.ts

@@ -0,0 +1,53 @@
+import * as lockboxBalanceSelectors from 'components/Balances/lockbox/selectors'
+import * as totalBalanceSelectors from 'components/Balances/total/selectors'
+import * as walletBalanceSelectors from 'components/Balances/wallet/selectors'
+import { OwnProps } from '.'
+import { Remote } from 'blockchain-wallet-v4/src'
+
+export const getData = (state, ownProps: OwnProps) => {
+  switch (ownProps.viewType) {
+    case 'Wallet':
+      switch (ownProps.coin) {
+        case 'BTC':
+          return walletBalanceSelectors.getBtcBalance(state)
+        case 'BCH':
+          return walletBalanceSelectors.getBchBalance(state)
+        case 'ETH':
+          return walletBalanceSelectors.getEthBalance(state)
+        case 'XLM':
+          return walletBalanceSelectors.getXlmBalance(state)
+        case 'PAX':
+          return walletBalanceSelectors.getPaxBalance(state)
+        default:
+          return Remote.Failure('Unsupported Coin Code')
+      }
+    case 'Hardware':
+      switch (ownProps.coin) {
+        case 'BTC':
+          return lockboxBalanceSelectors.getLockboxBtcBalance(state)
+        case 'BCH':
+          return lockboxBalanceSelectors.getLockboxBchBalance(state)
+        case 'ETH':
+          return lockboxBalanceSelectors.getLockboxEthBalance(state)
+        case 'XLM':
+          return lockboxBalanceSelectors.getLockboxXlmBalance(state)
+        default:
+          return Remote.Failure('Unsupported Coin Code')
+      }
+    default:
+      switch (ownProps.coin) {
+        case 'BTC':
+          return totalBalanceSelectors.getBtcBalance(state)
+        case 'BCH':
+          return totalBalanceSelectors.getBchBalance(state)
+        case 'ETH':
+          return totalBalanceSelectors.getEthBalance(state)
+        case 'XLM':
+          return totalBalanceSelectors.getXlmBalance(state)
+        case 'PAX':
+          return totalBalanceSelectors.getPaxBalance(state)
+        default:
+          return Remote.Failure('Unsupported Coin Code')
+      }
+  }
+}

packages/blockchain-wallet-v4-frontend/src/scenes/Home/Balances/Table/index.js → packages/blockchain-wallet-v4-frontend/src/scenes/Home/Balances/Table/index.tsx

@@ -1,11 +1,19 @@
 import { actions, selectors } from 'data'
 import { bindActionCreators } from 'redux'
 import { connect } from 'react-redux'
-
+import { SupportedCoinsType } from 'core/types'
 import React from 'react'
 import Template from './template'
 
-class Table extends React.PureComponent {
+type LinkStatePropsType = {
+  supportedCoins: SupportedCoinsType
+}
+type OwnProps = {
+  viewType: 'Total' | 'Wallet' | 'Hardware'
+}
+export type Props = OwnProps & LinkStatePropsType
+
+class Table extends React.PureComponent<Props> {
   render () {
     const { supportedCoins, viewType } = this.props
 

packages/blockchain-wallet-v4-frontend/src/scenes/Home/Balances/Table/template.tsx

@@ -2,6 +2,7 @@ import { HomeBalanceRow, HomeBalanceTable } from 'components/Balances'
 import { Icon, Text } from 'blockchain-info-components'
 import { LinkContainer } from 'react-router-bootstrap'
 import { mapObjIndexed, toLower, values } from 'ramda'
+import { Props } from '.'
 import { SupportedCoinType } from 'core/types'
 import CoinBalance from '../CoinBalance'
 import React from 'react'
@@ -39,7 +40,7 @@ const Amount = styled.div`
   }
 `
 
-const Success = props => {
+const Success = (props: Props) => {
   const { viewType, supportedCoins } = props
   const coinOrder = [
     supportedCoins.PAX,
@@ -73,7 +74,7 @@ const Success = props => {
                         <CoinName color={'gray-5'}>{coin.displayName}</CoinName>
                       </Coin>
                       <Amount>
-                        <CoinBalance coin={coin.coinCode} />
+                        <CoinBalance {...props} coin={coin.coinCode} />
                       </Amount>
                     </Wrapper>
                   </div>

packages/blockchain-wallet-v4-frontend/src/scenes/Home/Balances/index.js → packages/blockchain-wallet-v4-frontend/src/scenes/Home/Balances/index.tsx

@@ -3,7 +3,12 @@ import { getData } from './selectors'
 import BalancesTable from './template'
 import React from 'react'
 
-class BalancesTableContainer extends React.PureComponent {
+type LinkStatePropsType = {
+  currentTab: 'total' | 'wallet' | 'lockbox'
+  isSilverOrAbove: boolean
+}
+
+class BalancesTableContainer extends React.PureComponent<LinkStatePropsType> {
   render () {
     const { currentTab, isSilverOrAbove } = this.props
     return (

packages/blockchain-wallet-v4-frontend/src/scenes/Home/Balances/template.tsx

@@ -26,9 +26,9 @@ const BalancesTable = props => {
     <Wrapper>
       <TotalRow {...props} />
       <Tabs {...props} />
-      {currentTab === 'total' && <Table viewType='Total' />}
-      {currentTab === 'wallet' && <Table viewType='Wallet' />}
-      {currentTab === 'lockbox' && <Table viewType='Hardware' />}
+      {currentTab === 'total' && <Table viewType='Total' {...props} />}
+      {currentTab === 'wallet' && <Table viewType='Wallet' {...props} />}
+      {currentTab === 'lockbox' && <Table viewType='Hardware' {...props} />}
     </Wrapper>
   )
 }