aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorKevin Serrano <kevgagser@gmail.com>2016-07-08 07:27:37 +0800
committerKevin Serrano <kevgagser@gmail.com>2016-07-08 07:27:37 +0800
commit5343404d0d50f353c972e5b42ff27bfd1f332d53 (patch)
tree3dff304a0ce26f572d3a46fdb4e1bdba6e08bc84
parent570d5609323c9f9b6940c2c2279d9d13e3110c1e (diff)
downloadtangerine-wallet-browser-5343404d0d50f353c972e5b42ff27bfd1f332d53.tar.gz
tangerine-wallet-browser-5343404d0d50f353c972e5b42ff27bfd1f332d53.tar.zst
tangerine-wallet-browser-5343404d0d50f353c972e5b42ff27bfd1f332d53.zip
Add new component for tx-history to avoid messing with other styles. Add fixed width specifically to this style.
-rw-r--r--development/states/account-detail-with-transaction-history.json2
-rw-r--r--ui/app/components/eth-balance-tx-history.js70
-rw-r--r--ui/app/components/transaction-list-item.js2
3 files changed, 72 insertions, 2 deletions
diff --git a/development/states/account-detail-with-transaction-history.json b/development/states/account-detail-with-transaction-history.json
index 7603fe1d4..5006acd8b 100644
--- a/development/states/account-detail-with-transaction-history.json
+++ b/development/states/account-detail-with-transaction-history.json
@@ -72,7 +72,7 @@
"txParams": {
"from": "0x0dcd5d886577d5081b0c52e242ef29e70be3e7bc",
"to": "0x18a3462427bcc9133bb46e88bcbe39cd7ef0e761",
- "value": "0x66c8104aa57038000",
+ "value": "0x99966c8104aa57038000",
"origin": "thelongestdomainnameintheworldandthensomeandthensomemoreandmore.com",
"metamaskId": 1467923203344608,
"metamaskNetworkId": "2"
diff --git a/ui/app/components/eth-balance-tx-history.js b/ui/app/components/eth-balance-tx-history.js
new file mode 100644
index 000000000..9c7f48cf1
--- /dev/null
+++ b/ui/app/components/eth-balance-tx-history.js
@@ -0,0 +1,70 @@
+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
+ var value = formatBalance(state.value)
+ return (
+
+ h('.ether-balance', {
+ style: style,
+ }, [
+ h('.ether-balance-amount', {
+ style: {
+ display: 'inline',
+ width: '55px',
+ overflow: 'hidden',
+ },
+ }, this.renderBalance(value)),
+ ])
+
+ )
+}
+EthBalanceComponent.prototype.renderBalance = function (value) {
+ if (value === 'None') return value
+ var balanceObj = generateBalanceObject(value)
+
+ var 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%',
+ overflow: 'hidden',
+ textOverflow: 'ellipsis',
+ },
+ }, 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 21394c652..a41226343 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')
+const EtherBalance = require('./eth-balance-tx-history')
const addressSummary = require('../util').addressSummary
const explorerLink = require('../../lib/explorer-link')
const CopyButton = require('./copyButton')