From b2ebb6032d3f99eb0e9eb90364a0cd95c7775bde Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Sat, 3 Sep 2016 14:20:27 -0700 Subject: Continuing fiat balance modularization --- ui/app/components/account-eth-balance.js | 81 ++++++-------------------------- ui/app/components/eth-balance.js | 18 ++++--- ui/app/components/fiat-value.js | 80 +++++++++++++++++++++++++++++++ 3 files changed, 106 insertions(+), 73 deletions(-) create mode 100644 ui/app/components/fiat-value.js (limited to 'ui') diff --git a/ui/app/components/account-eth-balance.js b/ui/app/components/account-eth-balance.js index 8d693685f..1e4437405 100644 --- a/ui/app/components/account-eth-balance.js +++ b/ui/app/components/account-eth-balance.js @@ -1,20 +1,12 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits -const connect = require('react-redux').connect const formatBalance = require('../util').formatBalance const generateBalanceObject = require('../util').generateBalanceObject const Tooltip = require('./tooltip.js') +const FiatValue = require('./fiat-value') -module.exports = connect(mapStateToProps)(EthBalanceComponent) - -function mapStateToProps (state) { - return { - conversionRate: state.metamask.conversionRate, - conversionDate: state.metamask.conversionDate, - currentFiat: state.metamask.currentFiat, - } -} +module.exports = EthBalanceComponent inherits(EthBalanceComponent, Component) function EthBalanceComponent () { @@ -22,11 +14,10 @@ function EthBalanceComponent () { } EthBalanceComponent.prototype.render = function () { - var state = this.props - var style = state.style + var props = this.props + var style = props.style - const value = formatBalance(state.value, 6) - var width = state.width + var width = props.width return ( @@ -38,30 +29,23 @@ EthBalanceComponent.prototype.render = function () { display: 'inline', width: width, }, - }, this.renderBalance(value, state)), + }, this.renderBalance()), ]) - ) } -EthBalanceComponent.prototype.renderBalance = function (value, state) { + +EthBalanceComponent.prototype.renderBalance = function () { + const props = this.props + const value = formatBalance(props.value, 6) + if (value === 'None') return value - var balanceObj = generateBalanceObject(value, state.shorten ? 1 : 3) - var balance, fiatDisplayNumber, fiatTooltipNumber + var balanceObj = generateBalanceObject(value, props.shorten ? 1 : 3) + var balance var splitBalance = value.split(' ') var ethNumber = splitBalance[0] var ethSuffix = splitBalance[1] - - if (state.conversionRate !== 0) { - fiatTooltipNumber = Number(splitBalance[0]) * state.conversionRate - fiatDisplayNumber = fiatTooltipNumber.toFixed(2) - } else { - fiatDisplayNumber = 'N/A' - } - - var fiatSuffix = state.currentFiat - - if (state.shorten) { + if (props.shorten) { balance = balanceObj.shortBalance } else { balance = balanceObj.balance @@ -98,43 +82,8 @@ EthBalanceComponent.prototype.renderBalance = function (value, state) { }, label), ]), ]), - h(Tooltip, { - position: 'bottom', - title: `${fiatTooltipNumber} ${fiatSuffix}`, - }, [ - fiatDisplay(fiatDisplayNumber, fiatSuffix), - ]), + h(FiatValue, { value: props.value }), ]) ) } -function fiatDisplay (fiatDisplayNumber, fiatSuffix) { - if (fiatDisplayNumber !== 'N/A') { - return h('.flex-row', { - style: { - alignItems: 'flex-end', - lineHeight: '13px', - fontFamily: 'Montserrat Light', - textRendering: 'geometricPrecision', - }, - }, [ - h('div', { - style: { - width: '100%', - textAlign: 'right', - fontSize: '12px', - color: '#333333', - }, - }, fiatDisplayNumber), - h('div', { - style: { - color: '#AEAEAE', - marginLeft: '5px', - fontSize: '12px', - }, - }, fiatSuffix), - ]) - } else { - return h('div') - } -} diff --git a/ui/app/components/eth-balance.js b/ui/app/components/eth-balance.js index 498873faa..055cf6dd3 100644 --- a/ui/app/components/eth-balance.js +++ b/ui/app/components/eth-balance.js @@ -4,6 +4,7 @@ const inherits = require('util').inherits const formatBalance = require('../util').formatBalance const generateBalanceObject = require('../util').generateBalanceObject const Tooltip = require('./tooltip.js') +const FiatValue = require('./fiat-value.js') module.exports = EthBalanceComponent @@ -13,11 +14,12 @@ function EthBalanceComponent () { } EthBalanceComponent.prototype.render = function () { - var state = this.props - var style = state.style + var props = this.props + var style = props.style var needsParse = this.props.needsParse !== undefined ? this.props.needsParse : true - const value = formatBalance(state.value, 6, needsParse) - var width = state.width + const value = formatBalance(props.value, 6, needsParse) + var width = props.width + const showFiat = 'showFiat' in props ? props.showFiat : true return ( @@ -35,15 +37,15 @@ EthBalanceComponent.prototype.render = function () { ) } EthBalanceComponent.prototype.renderBalance = function (value) { - var state = this.props + var props = this.props if (value === 'None') return value - var balanceObj = generateBalanceObject(value, state.shorten ? 1 : 3) + var balanceObj = generateBalanceObject(value, props.shorten ? 1 : 3) var balance var splitBalance = value.split(' ') var ethNumber = splitBalance[0] var ethSuffix = splitBalance[1] - if (state.shorten) { + if (props.shorten) { balance = balanceObj.shortBalance } else { balance = balanceObj.balance @@ -77,6 +79,8 @@ EthBalanceComponent.prototype.renderBalance = function (value) { }, }, label), ]), + + fiatValue ? h(FiatValue, { value: props.value }) : null, ]) ) } diff --git a/ui/app/components/fiat-value.js b/ui/app/components/fiat-value.js new file mode 100644 index 000000000..0aa7d0bc5 --- /dev/null +++ b/ui/app/components/fiat-value.js @@ -0,0 +1,80 @@ +const Component = require('react').Component +const h = require('react-hyperscript') +const inherits = require('util').inherits +const connect = require('react-redux').connect +const formatBalance = require('../util').formatBalance +const generateBalanceObject = require('../util').generateBalanceObject +const Tooltip = require('./tooltip.js') + +module.exports = connect(mapStateToProps)(FiatValue) + +function mapStateToProps (state) { + return { + conversionRate: state.metamask.conversionRate, + currentFiat: state.metamask.currentFiat, + } +} + +inherits(FiatValue, Component) +function FiatValue () { + Component.call(this) +} + +FiatValue.prototype.render = function () { + const props = this.props + const value = formatBalance(props.value, 6) + + if (value === 'None') return value + var balanceObj = generateBalanceObject(value, props.shorten ? 1 : 3) + var fiatDisplayNumber, fiatTooltipNumber + var splitBalance = value.split(' ') + + if (props.conversionRate !== 0) { + fiatTooltipNumber = Number(splitBalance[0]) * props.conversionRate + fiatDisplayNumber = fiatTooltipNumber.toFixed(2) + } else { + fiatDisplayNumber = 'N/A' + } + + var fiatSuffix = props.currentFiat + + return ( + h(Tooltip, { + position: 'bottom', + title: `${fiatTooltipNumber} ${fiatSuffix}`, + }, [ + fiatDisplay(fiatDisplayNumber, fiatSuffix), + ]) + ) +} + +function fiatDisplay (fiatDisplayNumber, fiatSuffix) { + if (fiatDisplayNumber !== 'N/A') { + return h('.flex-row', { + style: { + alignItems: 'flex-end', + lineHeight: '13px', + fontFamily: 'Montserrat Light', + textRendering: 'geometricPrecision', + }, + }, [ + h('div', { + style: { + width: '100%', + textAlign: 'right', + fontSize: '12px', + color: '#333333', + }, + }, fiatDisplayNumber), + h('div', { + style: { + color: '#AEAEAE', + marginLeft: '5px', + fontSize: '12px', + }, + }, fiatSuffix), + ]) + } else { + return h('div') + } +} -- cgit v1.2.3 From 09dd854a96c2756be02d5043be40089a097cadc1 Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Tue, 6 Sep 2016 16:45:06 -0700 Subject: Nearly finished factoring fiat value into eth-balance --- ui/app/account-detail.js | 4 +- ui/app/accounts/account-list-item.js | 4 +- ui/app/app.js | 15 +++-- ui/app/components/account-eth-balance.js | 89 ------------------------------ ui/app/components/eth-balance.js | 4 +- ui/app/components/fiat-value.js | 3 +- ui/app/components/network.js | 1 - ui/app/components/tooltip.js | 7 ++- ui/app/components/transaction-list-item.js | 1 + 9 files changed, 19 insertions(+), 109 deletions(-) delete mode 100644 ui/app/components/account-eth-balance.js (limited to 'ui') diff --git a/ui/app/account-detail.js b/ui/app/account-detail.js index 486a1a633..cc956fed3 100644 --- a/ui/app/account-detail.js +++ b/ui/app/account-detail.js @@ -10,7 +10,7 @@ const ReactCSSTransitionGroup = require('react-addons-css-transition-group') const valuesFor = require('./util').valuesFor const Identicon = require('./components/identicon') -const AccountEtherBalance = require('./components/account-eth-balance') +const EthBalance = require('./components/eth-balance') const TransactionList = require('./components/transaction-list') const ExportAccountView = require('./components/account-export') const ethUtil = require('ethereumjs-util') @@ -168,7 +168,7 @@ AccountDetailScreen.prototype.render = function () { }, }, [ - h(AccountEtherBalance, { + h(EthBalance, { value: account && account.balance, style: { lineHeight: '7px', diff --git a/ui/app/accounts/account-list-item.js b/ui/app/accounts/account-list-item.js index aa80e0e23..0b4acdfec 100644 --- a/ui/app/accounts/account-list-item.js +++ b/ui/app/accounts/account-list-item.js @@ -3,7 +3,7 @@ const h = require('react-hyperscript') const inherits = require('util').inherits const ethUtil = require('ethereumjs-util') -const AccountEtherBalance = require('../components/account-eth-balance') +const EthBalance = require('../components/eth-balance') const CopyButton = require('../components/copyButton') const Identicon = require('../components/identicon') @@ -50,7 +50,7 @@ NewComponent.prototype.render = function () { textOverflow: 'ellipsis', }, }, ethUtil.toChecksumAddress(identity.address)), - h(AccountEtherBalance, { + h(EthBalance, { value: account.balance, style: { lineHeight: '7px', diff --git a/ui/app/app.js b/ui/app/app.js index b674efff1..2e05f0038 100644 --- a/ui/app/app.js +++ b/ui/app/app.js @@ -245,7 +245,7 @@ App.prototype.renderNetworkDropdown = function () { label: 'Localhost 8545', closeMenu: () => this.setState({ isNetworkMenuOpen: false }), action: () => props.dispatch(actions.setRpcTarget('http://localhost:8545')), - icon: h('i.fa.fa-question-circle.fa-lg', { ariaHidden: true }), + icon: h('i.fa.fa-question-circle.fa-lg'), activeNetworkRender: props.provider.rpcTarget, }), @@ -253,7 +253,7 @@ App.prototype.renderNetworkDropdown = function () { label: 'Custom RPC', closeMenu: () => this.setState({ isNetworkMenuOpen: false }), action: () => this.props.dispatch(actions.showConfigPage()), - icon: h('i.fa.fa-question-circle.fa-lg', { ariaHidden: true }), + icon: h('i.fa.fa-question-circle.fa-lg'), }), this.renderCustomOption(props.provider.rpcTarget), @@ -289,21 +289,21 @@ App.prototype.renderDropdown = function () { label: 'Settings', closeMenu: () => this.setState({ isMainMenuOpen: !isOpen }), action: () => this.props.dispatch(actions.showConfigPage()), - icon: h('i.fa.fa-gear.fa-lg', { ariaHidden: true }), + icon: h('i.fa.fa-gear.fa-lg'), }), h(DropMenuItem, { label: 'Lock', closeMenu: () => this.setState({ isMainMenuOpen: !isOpen }), action: () => this.props.dispatch(actions.lockMetamask()), - icon: h('i.fa.fa-lock.fa-lg', { ariaHidden: true }), + icon: h('i.fa.fa-lock.fa-lg'), }), h(DropMenuItem, { label: 'Help', closeMenu: () => this.setState({ isMainMenuOpen: !isOpen }), action: () => this.props.dispatch(actions.showInfoPage()), - icon: h('i.fa.fa-question.fa-lg', { ariaHidden: true }), + icon: h('i.fa.fa-question.fa-lg'), }), ]) } @@ -312,7 +312,6 @@ App.prototype.renderBackButton = function (style, justArrow = false) { return ( h('.flex-row', { key: 'leftArrow', - transForward: false, style: style, onClick: () => props.dispatch(actions.goBackToInitView()), }, [ @@ -515,14 +514,14 @@ App.prototype.renderCustomOption = function (rpcTarget) { label: 'Custom RPC', closeMenu: () => this.setState({ isNetworkMenuOpen: false }), action: () => this.props.dispatch(actions.showConfigPage()), - icon: h('i.fa.fa-question-circle.fa-lg', { ariaHidden: true }), + icon: h('i.fa.fa-question-circle.fa-lg'), }) default: return h(DropMenuItem, { label: `${rpcTarget}`, closeMenu: () => this.setState({ isNetworkMenuOpen: false }), - icon: h('i.fa.fa-question-circle.fa-lg', { ariaHidden: true }), + icon: h('i.fa.fa-question-circle.fa-lg'), activeNetworkRender: 'custom', }) } diff --git a/ui/app/components/account-eth-balance.js b/ui/app/components/account-eth-balance.js deleted file mode 100644 index 1e4437405..000000000 --- a/ui/app/components/account-eth-balance.js +++ /dev/null @@ -1,89 +0,0 @@ -const Component = require('react').Component -const h = require('react-hyperscript') -const inherits = require('util').inherits -const formatBalance = require('../util').formatBalance -const generateBalanceObject = require('../util').generateBalanceObject -const Tooltip = require('./tooltip.js') -const FiatValue = require('./fiat-value') - -module.exports = EthBalanceComponent - -inherits(EthBalanceComponent, Component) -function EthBalanceComponent () { - Component.call(this) -} - -EthBalanceComponent.prototype.render = function () { - var props = this.props - var style = props.style - - var width = props.width - - return ( - - h('.ether-balance', { - style: style, - }, [ - h('.ether-balance-amount', { - style: { - display: 'inline', - width: width, - }, - }, this.renderBalance()), - ]) - ) -} - -EthBalanceComponent.prototype.renderBalance = function () { - const props = this.props - const value = formatBalance(props.value, 6) - - if (value === 'None') return value - var balanceObj = generateBalanceObject(value, props.shorten ? 1 : 3) - var balance - var splitBalance = value.split(' ') - var ethNumber = splitBalance[0] - var ethSuffix = splitBalance[1] - - if (props.shorten) { - balance = balanceObj.shortBalance - } else { - balance = balanceObj.balance - } - - var label = balanceObj.label - - return ( - h('.flex-column', [ - h(Tooltip, { - position: 'bottom', - title: `${ethNumber} ${ethSuffix}`, - }, [ - h('.flex-row', { - style: { - alignItems: 'flex-end', - lineHeight: '13px', - fontFamily: 'Montserrat Light', - textRendering: 'geometricPrecision', - marginBottom: '5px', - }, - }, [ - h('div', { - style: { - width: '100%', - textAlign: 'right', - }, - }, balance), - h('div', { - style: { - color: '#AEAEAE', - marginLeft: '5px', - }, - }, label), - ]), - ]), - h(FiatValue, { value: props.value }), - ]) - ) -} - diff --git a/ui/app/components/eth-balance.js b/ui/app/components/eth-balance.js index 055cf6dd3..c77bda626 100644 --- a/ui/app/components/eth-balance.js +++ b/ui/app/components/eth-balance.js @@ -19,7 +19,6 @@ EthBalanceComponent.prototype.render = function () { var needsParse = this.props.needsParse !== undefined ? this.props.needsParse : true const value = formatBalance(props.value, 6, needsParse) var width = props.width - const showFiat = 'showFiat' in props ? props.showFiat : true return ( @@ -44,6 +43,7 @@ EthBalanceComponent.prototype.renderBalance = function (value) { var splitBalance = value.split(' ') var ethNumber = splitBalance[0] var ethSuffix = splitBalance[1] + const showFiat = 'showFiat' in props ? props.showFiat : true if (props.shorten) { balance = balanceObj.shortBalance @@ -80,7 +80,7 @@ EthBalanceComponent.prototype.renderBalance = function (value) { }, label), ]), - fiatValue ? h(FiatValue, { value: props.value }) : null, + showFiat ? h(FiatValue, { value: props.value }) : null, ]) ) } diff --git a/ui/app/components/fiat-value.js b/ui/app/components/fiat-value.js index 0aa7d0bc5..7322e43e8 100644 --- a/ui/app/components/fiat-value.js +++ b/ui/app/components/fiat-value.js @@ -4,7 +4,7 @@ const inherits = require('util').inherits const connect = require('react-redux').connect const formatBalance = require('../util').formatBalance const generateBalanceObject = require('../util').generateBalanceObject -const Tooltip = require('./tooltip.js') +const Tooltip = require('./tooltip') module.exports = connect(mapStateToProps)(FiatValue) @@ -25,7 +25,6 @@ FiatValue.prototype.render = function () { const value = formatBalance(props.value, 6) if (value === 'None') return value - var balanceObj = generateBalanceObject(value, props.shorten ? 1 : 3) var fiatDisplayNumber, fiatTooltipNumber var splitBalance = value.split(' ') diff --git a/ui/app/components/network.js b/ui/app/components/network.js index 6826e0685..845861396 100644 --- a/ui/app/components/network.js +++ b/ui/app/components/network.js @@ -75,7 +75,6 @@ Network.prototype.render = function () { default: return h('.network-indicator', [ h('i.fa.fa-question-circle.fa-lg', { - ariaHidden: true, style: { margin: '10px', color: 'rgb(125, 128, 130)', diff --git a/ui/app/components/tooltip.js b/ui/app/components/tooltip.js index fb67c717e..440393b08 100644 --- a/ui/app/components/tooltip.js +++ b/ui/app/components/tooltip.js @@ -12,11 +12,12 @@ function Tooltip () { Tooltip.prototype.render = function () { const props = this.props + const { position, title, children } = props return h(ReactTooltip, { - position: props.position ? props.position : 'left', - title: props.title, + position: position || 'left', + title, fixed: false, - }, props.children) + }, children) } diff --git a/ui/app/components/transaction-list-item.js b/ui/app/components/transaction-list-item.js index 1b85464e1..66a232981 100644 --- a/ui/app/components/transaction-list-item.js +++ b/ui/app/components/transaction-list-item.js @@ -77,6 +77,7 @@ TransactionListItem.prototype.render = function () { value: txParams.value, width: '55px', shorten: true, + showFiat: false, style: {fontSize: '15px'}, }) : h('.flex-column'), ]) -- cgit v1.2.3 From 90638f95c079bf1fbfccb9cdb9eea6bb0823e1bd Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Tue, 6 Sep 2016 16:55:52 -0700 Subject: Fix fiat-value --- ui/app/components/fiat-value.js | 1 - 1 file changed, 1 deletion(-) (limited to 'ui') diff --git a/ui/app/components/fiat-value.js b/ui/app/components/fiat-value.js index 7322e43e8..57c67e117 100644 --- a/ui/app/components/fiat-value.js +++ b/ui/app/components/fiat-value.js @@ -3,7 +3,6 @@ const h = require('react-hyperscript') const inherits = require('util').inherits const connect = require('react-redux').connect const formatBalance = require('../util').formatBalance -const generateBalanceObject = require('../util').generateBalanceObject const Tooltip = require('./tooltip') module.exports = connect(mapStateToProps)(FiatValue) -- cgit v1.2.3 From c46de79c10ba36c67176e4e02bd2b4adcb0e268f Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Tue, 6 Sep 2016 17:08:56 -0700 Subject: Got basic fiat display modularized --- ui/app/components/eth-balance.js | 46 +++++++++++++++++++++------------------- ui/app/components/fiat-value.js | 1 + ui/app/components/tooltip.js | 1 + 3 files changed, 26 insertions(+), 22 deletions(-) (limited to 'ui') diff --git a/ui/app/components/eth-balance.js b/ui/app/components/eth-balance.js index c77bda626..b9caf65b9 100644 --- a/ui/app/components/eth-balance.js +++ b/ui/app/components/eth-balance.js @@ -57,30 +57,32 @@ EthBalanceComponent.prototype.renderBalance = function (value) { h(Tooltip, { position: 'bottom', title: `${ethNumber} ${ethSuffix}`, - }, [ - h('.flex-column', { - style: { - alignItems: 'flex-end', - lineHeight: '13px', - fontFamily: 'Montserrat Light', - textRendering: 'geometricPrecision', - }, - }, [ - h('div', { + }, h('div.flex-column', [ + h('.flex-row', { style: { - width: '100%', - textAlign: 'right', + alignItems: 'flex-end', + lineHeight: '13px', + fontFamily: 'Montserrat Light', + textRendering: 'geometricPrecision', }, - }, this.props.incoming ? `+${balance}` : balance), - h('div', { - style: { - color: ' #AEAEAE', - fontSize: '12px', - }, - }, label), - ]), + }, [ + h('div', { + style: { + width: '100%', + textAlign: 'right', + }, + }, this.props.incoming ? `+${balance}` : balance), + h('div', { + style: { + color: ' #AEAEAE', + fontSize: '12px', + marginLeft: '5px', + }, + }, label), + ]), - showFiat ? h(FiatValue, { value: props.value }) : null, - ]) + showFiat ? h(FiatValue, { value: props.value }) : null, + ]) + ) ) } diff --git a/ui/app/components/fiat-value.js b/ui/app/components/fiat-value.js index 57c67e117..406dcf23f 100644 --- a/ui/app/components/fiat-value.js +++ b/ui/app/components/fiat-value.js @@ -32,6 +32,7 @@ FiatValue.prototype.render = function () { fiatDisplayNumber = fiatTooltipNumber.toFixed(2) } else { fiatDisplayNumber = 'N/A' + fiatTooltipNumber = 'Unknown' } var fiatSuffix = props.currentFiat diff --git a/ui/app/components/tooltip.js b/ui/app/components/tooltip.js index 440393b08..757ad0cd6 100644 --- a/ui/app/components/tooltip.js +++ b/ui/app/components/tooltip.js @@ -11,6 +11,7 @@ function Tooltip () { } Tooltip.prototype.render = function () { + const props = this.props const { position, title, children } = props -- cgit v1.2.3 From 1537e3f5da8d0ad5a48ded40301445c6468521f7 Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Tue, 6 Sep 2016 17:28:25 -0700 Subject: Add fiat balances to tx conf view --- ui/app/components/pending-tx-details.js | 11 +++++------ ui/app/send.js | 5 ++--- 2 files changed, 7 insertions(+), 9 deletions(-) (limited to 'ui') diff --git a/ui/app/components/pending-tx-details.js b/ui/app/components/pending-tx-details.js index 2fb0eae3f..c2e39a1ca 100644 --- a/ui/app/components/pending-tx-details.js +++ b/ui/app/components/pending-tx-details.js @@ -4,9 +4,8 @@ const inherits = require('util').inherits const carratInline = require('fs').readFileSync('./images/forward-carrat.svg', 'utf8') const MiniAccountPanel = require('./mini-account-panel') -const EtherBalance = require('./eth-balance') +const EthBalance = require('./eth-balance') const addressSummary = require('../util').addressSummary -const formatBalance = require('../util').formatBalance const nameForAddress = require('../../lib/contract-namer') const ethUtil = require('ethereumjs-util') const BN = ethUtil.BN @@ -70,7 +69,7 @@ PTXP.render = function () { fontFamily: 'Montserrat Light, Montserrat, sans-serif', }, }, [ - h(EtherBalance, { + h(EthBalance, { value: balance, inline: true, labelColor: '#F7861C', @@ -107,12 +106,12 @@ PTXP.render = function () { h('.row', [ h('.cell.label', 'Amount'), - h('.cell.value', formatBalance(txParams.value)), + h(EthBalance, { value: txParams.value }), ]), h('.cell.row', [ h('.cell.label', 'Max Transaction Fee'), - h('.cell.value', formatBalance(txFee.toString(16))), + h(EthBalance, { value: txFee.toString(16) }), ]), h('.cell.row', { @@ -129,7 +128,7 @@ PTXP.render = function () { alignItems: 'center', }, }, [ - h(EtherBalance, { + h(EthBalance, { value: maxCost.toString(16), inline: true, labelColor: 'black', diff --git a/ui/app/send.js b/ui/app/send.js index cf1b43b1d..009866cf7 100644 --- a/ui/app/send.js +++ b/ui/app/send.js @@ -7,7 +7,7 @@ const actions = require('./actions') const util = require('./util') const numericBalance = require('./util').numericBalance const addressSummary = require('./util').addressSummary -const EtherBalance = require('./components/eth-balance') +const EthBalance = require('./components/eth-balance') const ethUtil = require('ethereumjs-util') module.exports = connect(mapStateToProps)(SendTransactionScreen) @@ -107,8 +107,7 @@ SendTransactionScreen.prototype.render = function () { // balance h('.flex-row.flex-center', [ - // h('div', formatBalance(account && account.balance)), - h(EtherBalance, { + h(EthBalance, { value: account && account.balance, }), -- cgit v1.2.3 From 0186e05a0da718169c58e33b40760bdcf869b1c8 Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Tue, 6 Sep 2016 17:30:38 -0700 Subject: Linted --- ui/app/components/eth-balance.js | 45 ++++++++++++++++++++-------------------- 1 file changed, 22 insertions(+), 23 deletions(-) (limited to 'ui') diff --git a/ui/app/components/eth-balance.js b/ui/app/components/eth-balance.js index b9caf65b9..46127bed5 100644 --- a/ui/app/components/eth-balance.js +++ b/ui/app/components/eth-balance.js @@ -58,31 +58,30 @@ EthBalanceComponent.prototype.renderBalance = function (value) { position: 'bottom', title: `${ethNumber} ${ethSuffix}`, }, h('div.flex-column', [ - h('.flex-row', { + h('.flex-row', { + style: { + alignItems: 'flex-end', + lineHeight: '13px', + fontFamily: 'Montserrat Light', + textRendering: 'geometricPrecision', + }, + }, [ + h('div', { + style: { + width: '100%', + textAlign: 'right', + }, + }, this.props.incoming ? `+${balance}` : balance), + h('div', { style: { - alignItems: 'flex-end', - lineHeight: '13px', - fontFamily: 'Montserrat Light', - textRendering: 'geometricPrecision', + color: ' #AEAEAE', + fontSize: '12px', + marginLeft: '5px', }, - }, [ - h('div', { - style: { - width: '100%', - textAlign: 'right', - }, - }, this.props.incoming ? `+${balance}` : balance), - h('div', { - style: { - color: ' #AEAEAE', - fontSize: '12px', - marginLeft: '5px', - }, - }, label), - ]), + }, label), + ]), - showFiat ? h(FiatValue, { value: props.value }) : null, - ]) - ) + showFiat ? h(FiatValue, { value: props.value }) : null, + ])) ) } -- cgit v1.2.3 From d6619a25e90f206eef6dad46b09406b529f84b80 Mon Sep 17 00:00:00 2001 From: John Weldon Date: Wed, 7 Sep 2016 14:44:56 -0700 Subject: Fix typo --- ui/app/info.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'ui') diff --git a/ui/app/info.js b/ui/app/info.js index 4e540bd03..5c06409bd 100644 --- a/ui/app/info.js +++ b/ui/app/info.js @@ -67,7 +67,7 @@ InfoScreen.prototype.render = function () { `For more information on MetaMask you can visit our web site. If you want to contact us with questions or just - say 'Hi', you can find us on theise platforms:`), + say 'Hi', you can find us on these platforms:`), h('div', { style: { -- cgit v1.2.3 From c3dbcb5b02a54bd3772fb768c1b28f2c94a74e58 Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Thu, 8 Sep 2016 10:57:10 -0700 Subject: Fix double tooltip --- ui/app/components/fiat-value.js | 11 +---------- 1 file changed, 1 insertion(+), 10 deletions(-) (limited to 'ui') diff --git a/ui/app/components/fiat-value.js b/ui/app/components/fiat-value.js index 406dcf23f..a5c36e5cb 100644 --- a/ui/app/components/fiat-value.js +++ b/ui/app/components/fiat-value.js @@ -3,7 +3,6 @@ const h = require('react-hyperscript') const inherits = require('util').inherits const connect = require('react-redux').connect const formatBalance = require('../util').formatBalance -const Tooltip = require('./tooltip') module.exports = connect(mapStateToProps)(FiatValue) @@ -28,7 +27,6 @@ FiatValue.prototype.render = function () { var splitBalance = value.split(' ') if (props.conversionRate !== 0) { - fiatTooltipNumber = Number(splitBalance[0]) * props.conversionRate fiatDisplayNumber = fiatTooltipNumber.toFixed(2) } else { fiatDisplayNumber = 'N/A' @@ -37,14 +35,7 @@ FiatValue.prototype.render = function () { var fiatSuffix = props.currentFiat - return ( - h(Tooltip, { - position: 'bottom', - title: `${fiatTooltipNumber} ${fiatSuffix}`, - }, [ - fiatDisplay(fiatDisplayNumber, fiatSuffix), - ]) - ) + return fiatDisplay(fiatDisplayNumber, fiatSuffix) } function fiatDisplay (fiatDisplayNumber, fiatSuffix) { -- cgit v1.2.3 From ab3b409438d4816e5154a3d6c71218a9963e3b5a Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Thu, 8 Sep 2016 11:03:47 -0700 Subject: Restore broken variable reference --- ui/app/components/fiat-value.js | 1 + 1 file changed, 1 insertion(+) (limited to 'ui') diff --git a/ui/app/components/fiat-value.js b/ui/app/components/fiat-value.js index a5c36e5cb..13ee48245 100644 --- a/ui/app/components/fiat-value.js +++ b/ui/app/components/fiat-value.js @@ -27,6 +27,7 @@ FiatValue.prototype.render = function () { var splitBalance = value.split(' ') if (props.conversionRate !== 0) { + fiatTooltipNumber = Number(splitBalance[0]) * props.conversionRate fiatDisplayNumber = fiatTooltipNumber.toFixed(2) } else { fiatDisplayNumber = 'N/A' -- cgit v1.2.3