aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--development/states/account-detail-with-transaction-history.json14
-rw-r--r--ui/app/components/eth-balance-tx-history.js77
-rw-r--r--ui/app/components/eth-balance.js56
-rw-r--r--ui/app/components/transaction-list-item.js2
-rw-r--r--ui/app/util.js16
5 files changed, 54 insertions, 111 deletions
diff --git a/development/states/account-detail-with-transaction-history.json b/development/states/account-detail-with-transaction-history.json
index 5006acd8b..5e4065225 100644
--- a/development/states/account-detail-with-transaction-history.json
+++ b/development/states/account-detail-with-transaction-history.json
@@ -81,6 +81,20 @@
"status": "confirmed",
"containsDelegateCall": false,
"hash": "0x957bbba51e2732a86c10c5e7e8a484a093795a06f2e2c38ad02da1b20aeca620"
+ },
+ {
+ "id": 1467921503489592,
+ "txParams": {
+ "from": "0x0dcd5d886577d5081b0c52e242ef29e70be3e7bc",
+ "to": "0x18a3462427bcc9133bb46e88bcbe39cd7ef0e761",
+ "value": "0x66c899104aa57038000",
+ "origin": "thelongestdomainnameintheworldandthensomeandthensomemoreandmore.com",
+ "metamaskId": 1467921503489592,
+ "metamaskNetworkId": "2"
+ },
+ "time": 1467921503489,
+ "status": "confirmed",
+ "containsDelegateCall": false
}],
"selectedAddress": "0x0dcd5d886577d5081b0c52e242ef29e70be3e7bc",
"network": "2",
diff --git a/ui/app/components/eth-balance-tx-history.js b/ui/app/components/eth-balance-tx-history.js
deleted file mode 100644
index de64dd694..000000000
--- a/ui/app/components/eth-balance-tx-history.js
+++ /dev/null
@@ -1,77 +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')
-module.exports = EthBalanceComponent
-
-inherits(EthBalanceComponent, Component)
-function EthBalanceComponent () {
- Component.call(this)
-}
-
-EthBalanceComponent.prototype.render = function () {
- var state = this.props
- var style = state.style
-
- const value = formatBalance(state.value)
- var width = state.width
-
- return (
-
- h('.ether-balance', {
- style: style,
- }, [
- h('.ether-balance-amount', {
- style: {
- display: 'inline',
- width: width,
- },
- }, this.renderBalance(value, state)),
- ])
-
- )
-}
-EthBalanceComponent.prototype.renderBalance = function (value, state) {
- if (value === 'None') return value
- var balanceObj = generateBalanceObject(value)
- var balance
-
- if (state.shorten) {
- balance = balanceObj.shortBalance
- } else {
- balance = balanceObj.balance
- }
-
- var label = balanceObj.label
-
- return (
- h(Tooltip, {
- position: 'bottom',
- title: value.split(' ')[0],
- }, [
- h('.flex-column', {
- style: {
- alignItems: 'flex-end',
- lineHeight: '13px',
- fontFamily: 'Montserrat Light',
- textRendering: 'geometricPrecision',
- },
- }, [
- h('div', {
- style: {
- width: '100%',
- textAlign: 'right',
- },
- }, balance),
- h('div', {
- style: {
- color: ' #AEAEAE',
- fontSize: '12px',
- },
- }, label),
- ]),
- ])
- )
-}
diff --git a/ui/app/components/eth-balance.js b/ui/app/components/eth-balance.js
index 75b6dcb43..5f99a3e48 100644
--- a/ui/app/components/eth-balance.js
+++ b/ui/app/components/eth-balance.js
@@ -12,10 +12,11 @@ function EthBalanceComponent () {
}
EthBalanceComponent.prototype.render = function () {
- var props = this.props
- var style = props.style
+ var state = this.props
+ var style = state.style
- const value = formatBalance(props.value)
+ const value = formatBalance(state.value)
+ var width = state.width
return (
@@ -25,51 +26,52 @@ EthBalanceComponent.prototype.render = function () {
h('.ether-balance-amount', {
style: {
display: 'inline',
+ width: width,
},
- }, this.renderBalance(value)),
+ }, this.renderBalance(value, state)),
])
)
}
-EthBalanceComponent.prototype.renderBalance = function (value) {
- const props = this.props
+EthBalanceComponent.prototype.renderBalance = function (value, state) {
if (value === 'None') return value
- var balanceObj = generateBalanceObject(value)
- var balance = balanceObj.balance
+ var balanceObj = generateBalanceObject(value, 1)
+ var balance
+
+ if (state.shorten) {
+ balance = balanceObj.shortBalance
+ } else {
+ balance = balanceObj.balance
+ }
+
var label = balanceObj.label
- var tagName = props.inline ? 'span' : 'div'
- var topTag = props.inline ? 'div' : '.flex-column'
return (
-
h(Tooltip, {
position: 'bottom',
title: value.split(' ')[0],
}, [
- h(topTag, {
+ h('.flex-column', {
style: {
alignItems: 'flex-end',
- lineHeight: props.fontSize || '13px',
- fontFamily: 'Montserrat Regular',
+ lineHeight: '13px',
+ fontFamily: 'Montserrat Light',
textRendering: 'geometricPrecision',
},
}, [
- h(tagName, {
+ h('div', {
style: {
- color: props.labelColor || '#AEAEAE',
- fontSize: props.fontSize || '12px',
+ width: '100%',
+ textAlign: 'right',
},
- }, [
- h('div', balance),
- h('div', {
- style: {
- color: '#AEAEAE',
- fontSize: '12px',
- },
- }, label),
- ]),
+ }, balance),
+ h('div', {
+ style: {
+ color: ' #AEAEAE',
+ fontSize: '12px',
+ },
+ }, label),
]),
])
-
)
}
diff --git a/ui/app/components/transaction-list-item.js b/ui/app/components/transaction-list-item.js
index d4207b3ba..2314c7107 100644
--- a/ui/app/components/transaction-list-item.js
+++ b/ui/app/components/transaction-list-item.js
@@ -2,7 +2,7 @@ const Component = require('react').Component
const h = require('react-hyperscript')
const inherits = require('util').inherits
-const EtherBalance = require('./eth-balance-tx-history')
+const EtherBalance = require('./eth-balance')
const addressSummary = require('../util').addressSummary
const explorerLink = require('../../lib/explorer-link')
const CopyButton = require('./copyButton')
diff --git a/ui/app/util.js b/ui/app/util.js
index 0d57f1f96..c04612455 100644
--- a/ui/app/util.js
+++ b/ui/app/util.js
@@ -115,27 +115,31 @@ function formatBalance (balance, decimalsToKeep) {
}
-function generateBalanceObject (formattedBalance) {
+function generateBalanceObject (formattedBalance, decimalsToKeep = 1) {
var balance = formattedBalance.split(' ')[0]
var label = formattedBalance.split(' ')[1]
var beforeDecimal = balance.split('.')[0]
var afterDecimal = balance.split('.')[1]
- var shortBalance = shortenBalance(balance)
+ var shortBalance = shortenBalance(balance, decimalsToKeep)
- if (beforeDecimal === '0' && afterDecimal.substr(0, 5) === '00000') { balance = '< 0.00001' }
+ if (beforeDecimal === '0' && afterDecimal.substr(0, 5) === '00000') { balance = '<1.0e-5' }
return { balance, label, shortBalance }
}
-function shortenBalance (balance) {
+function shortenBalance (balance, decimalsToKeep = 1) {
var truncatedValue
var convertedBalance = parseFloat(balance)
if (convertedBalance > 1000000) {
- truncatedValue = (balance / 1000000).toFixed(1)
+ truncatedValue = (balance / 1000000).toFixed(decimalsToKeep)
return `>${truncatedValue}m`
} else if (convertedBalance > 1000) {
- truncatedValue = (balance / 1000).toFixed(1)
+ truncatedValue = (balance / 1000).toFixed(decimalsToKeep)
return `>${truncatedValue}k`
+ } else if (convertedBalance < 1) {
+ var exponent = balance.match(/\.0*/)[0].length
+ truncatedValue = (convertedBalance * Math.pow(10, exponent)).toFixed(decimalsToKeep)
+ return `<${truncatedValue}e-${exponent}`
} else {
return balance
}