diff options
author | kumavis <kumavis@users.noreply.github.com> | 2016-05-07 05:49:38 +0800 |
---|---|---|
committer | kumavis <kumavis@users.noreply.github.com> | 2016-05-07 05:49:38 +0800 |
commit | 601d870592b5d79b4a109a2dd825cb7966457dd7 (patch) | |
tree | 1a4f8aeb96d4b8456d35cf3dbb8ee14357944edf /ui/app/components/transaction-list.js | |
parent | edf4e2bc5b5964446104b8ab4a7d6eae2d0ed0cd (diff) | |
parent | c30a67b2deb06c5d47990ccac74d9d55384bfe2e (diff) | |
download | tangerine-wallet-browser-601d870592b5d79b4a109a2dd825cb7966457dd7.tar.gz tangerine-wallet-browser-601d870592b5d79b4a109a2dd825cb7966457dd7.tar.zst tangerine-wallet-browser-601d870592b5d79b4a109a2dd825cb7966457dd7.zip |
Merge pull request #180 from MetaMask/PrettierTransactionList
Prettier transaction list
Diffstat (limited to 'ui/app/components/transaction-list.js')
-rw-r--r-- | ui/app/components/transaction-list.js | 72 |
1 files changed, 48 insertions, 24 deletions
diff --git a/ui/app/components/transaction-list.js b/ui/app/components/transaction-list.js index 115fd91f8..3e153aecf 100644 --- a/ui/app/components/transaction-list.js +++ b/ui/app/components/transaction-list.js @@ -2,30 +2,54 @@ const h = require('react-hyperscript') const formatBalance = require('../util').formatBalance const addressSummary = require('../util').addressSummary const explorerLink = require('../../lib/explorer-link') +const Panel = require('./panel') module.exports = function(transactions, network) { - return h('.tx-list', { - style: { - overflowY: 'auto', - height: '180px', - textAlign: 'center', + return h('section', [ + + h('.current-domain-panel.flex-center.font-small', [ + h('span', 'Transactions'), + ]), + + h('.tx-list', { + style: { + overflowY: 'auto', + height: '180px', + textAlign: 'center', + }, }, - }, - - [ - h('div.font-small', {style: {display: 'inline'}}, 'Transactions'), - - transactions.map((transaction) => { - return h('.tx.flex-row.flex-space-around', [ - h('a.font-small', - { - href: explorerLink(transaction.hash, parseInt(network)), - target: '_blank', - }, - addressSummary(transaction.txParams.to)), - h('div.font-small', formatBalance(transaction.txParams.value)) - ]) - }) - ] - ) -} + + [ + + transactions.map((transaction) => { + console.dir(transaction) + + var panelOpts = { + key: `tx-${transaction.hash}`, + identiconKey: transaction.txParams.to, + style: { + cursor: 'pointer', + }, + onClick: (event) => { + var url = explorerLink(transaction.hash, parseInt(network)) + chrome.tabs.create({ url }); + }, + attributes: [ + { + key: 'TO', + value: addressSummary(transaction.txParams.to), + }, + { + key: 'VALUE', + value: formatBalance(transaction.txParams.value), + }, + ] + } + + return h(Panel, panelOpts) + }) + ] + ) + + ]) + } |