diff options
author | Chi Kei Chan <chikeichan@gmail.com> | 2017-09-05 16:48:52 +0800 |
---|---|---|
committer | Chi Kei Chan <chikeichan@gmail.com> | 2017-09-06 15:36:31 +0800 |
commit | 06b2a04a4259a0bc7dff4004328441d353c296de (patch) | |
tree | 3ecb23718c23f244f3216b8f82dc3dc0c7e9e014 /ui/app/components/token-list.js | |
parent | 562d2fadaed93946bce8e5f306d1a2e271e971c7 (diff) | |
download | tangerine-wallet-browser-06b2a04a4259a0bc7dff4004328441d353c296de.tar tangerine-wallet-browser-06b2a04a4259a0bc7dff4004328441d353c296de.tar.gz tangerine-wallet-browser-06b2a04a4259a0bc7dff4004328441d353c296de.tar.bz2 tangerine-wallet-browser-06b2a04a4259a0bc7dff4004328441d353c296de.tar.lz tangerine-wallet-browser-06b2a04a4259a0bc7dff4004328441d353c296de.tar.xz tangerine-wallet-browser-06b2a04a4259a0bc7dff4004328441d353c296de.tar.zst tangerine-wallet-browser-06b2a04a4259a0bc7dff4004328441d353c296de.zip |
Implement tokens list UI
Diffstat (limited to 'ui/app/components/token-list.js')
-rw-r--r-- | ui/app/components/token-list.js | 101 |
1 files changed, 20 insertions, 81 deletions
diff --git a/ui/app/components/token-list.js b/ui/app/components/token-list.js index 5ea31ae8d..7fe072fac 100644 --- a/ui/app/components/token-list.js +++ b/ui/app/components/token-list.js @@ -4,6 +4,17 @@ const inherits = require('util').inherits const TokenTracker = require('eth-token-tracker') const TokenCell = require('./token-cell.js') const normalizeAddress = require('eth-sig-util').normalize +const connect = require('react-redux').connect +const selectors = require('../selectors') + +function mapStateToProps (state) { + + return { + network: state.metamask.network, + tokens: state.metamask.tokens, + userAddress: selectors.getSelectedAddress(state), + } +} const defaultTokens = [] const contracts = require('eth-contract-metadata') @@ -15,7 +26,8 @@ for (const address in contracts) { } } -module.exports = TokenList +module.exports = connect(mapStateToProps)(TokenList) + inherits(TokenList, Component) function TokenList () { @@ -47,81 +59,7 @@ TokenList.prototype.render = function () { return h(TokenCell, tokenData) }) - return h('.full-flex-height', [ - this.renderTokenStatusBar(), - - h('ol.full-flex-height.flex-column', { - style: { - overflowY: 'auto', - display: 'flex', - flexDirection: 'column', - }, - }, [ - h('style', ` - - li.token-cell { - display: flex; - flex-direction: row; - align-items: center; - padding: 10px; - min-height: 50px; - } - - li.token-cell > h3 { - margin-left: 12px; - } - - li.token-cell:hover { - background: white; - cursor: pointer; - } - - `), - ...tokenViews, - h('.flex-grow'), - ]), - ]) -} - -TokenList.prototype.renderTokenStatusBar = function () { - const { tokens } = this.state - - let msg - if (tokens.length === 1) { - msg = `You own 1 token` - } else if (tokens.length === 1) { - msg = `You own ${tokens.length} tokens` - } else { - msg = `No tokens found` - } - - return h('div', { - style: { - display: 'flex', - justifyContent: 'space-between', - alignItems: 'center', - minHeight: '70px', - padding: '10px', - }, - }, [ - h('span', msg), - h('button', { - key: 'reveal-account-bar', - onClick: (event) => { - event.preventDefault() - this.props.addToken() - }, - style: { - display: 'flex', - height: '40px', - padding: '10px', - justifyContent: 'center', - alignItems: 'center', - }, - }, [ - 'ADD TOKEN', - ]), - ]) + return h('div', tokenViews) } TokenList.prototype.message = function (body) { @@ -150,6 +88,7 @@ TokenList.prototype.createFreshTokenTracker = function () { if (!global.ethereumProvider) return const { userAddress } = this.props + this.tracker = new TokenTracker({ userAddress, provider: global.ethereumProvider, @@ -188,10 +127,10 @@ TokenList.prototype.componentWillUpdate = function (nextProps) { } TokenList.prototype.updateBalances = function (tokens) { - const heldTokens = tokens.filter(token => { - return token.balance !== '0' && token.string !== '0.000' - }) - this.setState({ tokens: heldTokens, isLoading: false }) + // const heldTokens = tokens.filter(token => { + // return token.balance !== '0' && token.string !== '0.000' + // }) + this.setState({ tokens: tokens, isLoading: false }) } TokenList.prototype.componentWillUnmount = function () { @@ -199,7 +138,7 @@ TokenList.prototype.componentWillUnmount = function () { this.tracker.stop() } -function uniqueMergeTokens (tokensA, tokensB) { +function uniqueMergeTokens (tokensA, tokensB = []) { const uniqueAddresses = [] const result = [] tokensA.concat(tokensB).forEach((token) => { |