From 53c91591b34eea68e0f8b834e33c451ca48d3a7c Mon Sep 17 00:00:00 2001 From: Simon Liang Date: Thu, 10 Aug 2017 11:17:39 +0800 Subject: [PATCH] redid tx-view and balance-component mapStateToProps logic --- ui/app/components/balance-component.js | 13 ++++++--- ui/app/components/tx-view.js | 37 ++++++++++++-------------- 2 files changed, 27 insertions(+), 23 deletions(-) diff --git a/ui/app/components/balance-component.js b/ui/app/components/balance-component.js index 250bb6479..48efc7b6a 100644 --- a/ui/app/components/balance-component.js +++ b/ui/app/components/balance-component.js @@ -1,10 +1,18 @@ const Component = require('react').Component +const connect = require('react-redux').connect const h = require('react-hyperscript') const inherits = require('util').inherits const { formatBalance, generateBalanceObject } = require('../util') -module.exports = BalanceComponent +module.exports = connect(mapStateToProps)(BalanceComponent) + +function mapStateToProps (state) { + return { + conversionRate: state.metamask.conversionRate, + currentCurrency: state.metamask.currentCurrency, + } +} inherits(BalanceComponent, Component) function BalanceComponent () { @@ -53,8 +61,7 @@ BalanceComponent.prototype.renderBalance = function (formattedBalance) { BalanceComponent.prototype.renderFiatValue = function (formattedBalance) { - const props = this.props - const { conversionRate, currentCurrency } = props + const { conversionRate, currentCurrency } = this.props const fiatDisplayNumber = this.getFiatDisplayNumber(formattedBalance, conversionRate) diff --git a/ui/app/components/tx-view.js b/ui/app/components/tx-view.js index f0a93a2ab..ba93aae8b 100644 --- a/ui/app/components/tx-view.js +++ b/ui/app/components/tx-view.js @@ -20,15 +20,21 @@ const Identicon = require('./identicon') module.exports = connect(mapStateToProps, mapDispatchToProps)(TxView) function mapStateToProps (state) { + const sidebarOpen = state.appState.sidebarOpen + + const identities = state.metamask.identities + const accounts = state.metamask.accounts + const selectedAddress = state.metamask.selectedAddress || Object.keys(accounts)[0] + const checksumAddress = selectedAddress && ethUtil.toChecksumAddress(selectedAddress) + const identity = identities[selectedAddress] + const account = accounts[selectedAddress] + return { - sidebarOpen: state.appState.sidebarOpen, - identities: state.metamask.identities, - accounts: state.metamask.accounts, - address: state.metamask.selectedAddress, - transactions: state.metamask.selectedAddressTxList || [], - shapeShiftTxList: state.metamask.shapeShiftTxList, - conversionRate: state.metamask.conversionRate, - currentCurrency: state.metamask.currentCurrency, + sidebarOpen, + selectedAddress, + checksumAddress, + identity, + account, } } @@ -47,14 +53,7 @@ function TxView () { TxView.prototype.render = function () { - var props = this.props - var selected = props.address || Object.keys(props.accounts)[0] - var checksumAddress = selected && ethUtil.toChecksumAddress(selected) - var identity = props.identities[selected] - var account = props.accounts[selected] - const { conversionRate, currentCurrency, transactions } = props - - console.log(transactions) + const { selectedAddress, identity, account } = this.props return h('div.tx-view.flex-column', { style: {}, @@ -63,7 +62,7 @@ TxView.prototype.render = function () { h('div.flex-row.phone-visible', { style: { margin: '1em 0.9em', - alignItems: 'center' + alignItems: 'center', }, onClick: () => { this.props.sidebarOpen ? this.props.hideSidebar() : this.props.showSidebar() @@ -84,7 +83,7 @@ TxView.prototype.render = function () { }, [ h(Identicon, { diameter: 24, - address: selected, + address: selectedAddress, }), ]), @@ -104,8 +103,6 @@ TxView.prototype.render = function () { h(BalanceComponent, { balanceValue: account && account.balance, - conversionRate, - currentCurrency, style: {}, }),