From 9c982a4bd679c9f5a7a108e64744ff9f0e6e99e1 Mon Sep 17 00:00:00 2001 From: Frankie Date: Thu, 15 Sep 2016 18:13:13 -0700 Subject: [PATCH 1/4] add tx-viz link to transaction history --- ui/app/components/transaction-list-item.js | 39 +++++++++++++++------- 1 file changed, 27 insertions(+), 12 deletions(-) diff --git a/ui/app/components/transaction-list-item.js b/ui/app/components/transaction-list-item.js index 66a232981..3adc07185 100644 --- a/ui/app/components/transaction-list-item.js +++ b/ui/app/components/transaction-list-item.js @@ -44,7 +44,30 @@ TransactionListItem.prototype.render = function () { return ( h(`.transaction-list-item.flex-row.flex-space-between${isClickable ? '.pointer' : ''}`, { - onClick: (event) => { + style: { + padding: '20px 0', + }, + }, [ + + // large identicon + h('.identicon-wrapper.flex-column.flex-center.select-none', [ + transaction.status === 'unconfirmed' ? h('i.fa.fa-ellipsis-h', { + style: { + fontSize: '27px' + } + }) : h( '.pop-hover', { + onClick: () => { + if (!isTx || isPending) return + var url = `https://metamask.github.io/eth-tx-viz/?tx=${transaction.hash}` + extension.tabs.create({ url }) + }, + }, [ + h(TransactionIcon, { txParams, transaction, isTx, isMsg }), + ]), + ]), + + h('.flex-column', { + onClick: (event) => { if (isPending) { this.props.showTx(transaction.id) } @@ -54,17 +77,9 @@ TransactionListItem.prototype.render = function () { extension.tabs.create({ url }) }, style: { - padding: '20px 0', - }, - }, [ - - // large identicon - h('.identicon-wrapper.flex-column.flex-center.select-none', [ - transaction.status === 'unconfirmed' ? h('i.fa.fa-ellipsis-h', {style: { fontSize: '27px' }}) - : h(TransactionIcon, { txParams, transaction, isTx, isMsg }), - ]), - - h('.flex-column', {style: {width: '200px', overflow: 'hidden'}}, [ + width: '200px', + overflow: 'hidden'} + }, [ domainField(txParams), h('div', date), recipientField(txParams, transaction, isTx, isMsg), From bc33c88ae53fbc08e75db025888d5bc3bcfe236d Mon Sep 17 00:00:00 2001 From: Frankie Date: Thu, 15 Sep 2016 18:16:15 -0700 Subject: [PATCH 2/4] Add to CHANGELOG.md --- CHANGELOG.md | 3 +++ 1 file changed, 3 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 63264622d..c87760cd0 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,6 +2,9 @@ ## Current Master +- Add a link to the transaction in history that goes to https://metamask.github.io/eth-tx-viz +too help visualize transactions and to where they are going. + ## 2.12.1 2016-09-14 - Fixed bug where if you send a transaction from within MetaMask extension the From 3682a2a1f91cc788de332df70445bdf76c658173 Mon Sep 17 00:00:00 2001 From: Frankie Date: Thu, 15 Sep 2016 18:25:05 -0700 Subject: [PATCH 3/4] linting --- ui/app/components/transaction-list-item.js | 41 +++++++++++----------- 1 file changed, 21 insertions(+), 20 deletions(-) diff --git a/ui/app/components/transaction-list-item.js b/ui/app/components/transaction-list-item.js index 3adc07185..8f96e2942 100644 --- a/ui/app/components/transaction-list-item.js +++ b/ui/app/components/transaction-list-item.js @@ -53,32 +53,33 @@ TransactionListItem.prototype.render = function () { h('.identicon-wrapper.flex-column.flex-center.select-none', [ transaction.status === 'unconfirmed' ? h('i.fa.fa-ellipsis-h', { style: { - fontSize: '27px' - } - }) : h( '.pop-hover', { - onClick: () => { - if (!isTx || isPending) return - var url = `https://metamask.github.io/eth-tx-viz/?tx=${transaction.hash}` - extension.tabs.create({ url }) - }, - }, [ + fontSize: '27px', + }, + }) : h( '.pop-hover', { + onClick: () => { + if (!isTx || isPending) return + var url = `https://metamask.github.io/eth-tx-viz/?tx=${transaction.hash}` + extension.tabs.create({ url }) + }, + }, [ h(TransactionIcon, { txParams, transaction, isTx, isMsg }), ]), ]), h('.flex-column', { - onClick: (event) => { - if (isPending) { - this.props.showTx(transaction.id) - } + onClick: (event) => { + if (isPending) { + this.props.showTx(transaction.id) + } - if (!transaction.hash || !isLinkable) return - var url = explorerLink(transaction.hash, parseInt(network)) - extension.tabs.create({ url }) - }, - style: { - width: '200px', - overflow: 'hidden'} + if (!transaction.hash || !isLinkable) return + var url = explorerLink(transaction.hash, parseInt(network)) + extension.tabs.create({ url }) + }, + style: { + width: '200px', + overflow: 'hidden', + }, }, [ domainField(txParams), h('div', date), From 77ef71448d32ab125da3b8738c8dd7af915ec596 Mon Sep 17 00:00:00 2001 From: Frankie Date: Thu, 15 Sep 2016 19:35:04 -0700 Subject: [PATCH 4/4] Fix CHANGELOG.md and restructure onClick events --- CHANGELOG.md | 2 +- ui/app/components/transaction-list-item.js | 29 +++++++++------------- 2 files changed, 13 insertions(+), 18 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 1e6feb1ed..c1483b7cc 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,10 +1,10 @@ # Changelog ## Current Master -- Show "Buy Ether" button and warning on tx confirmation when sender balance is insufficient - Add a link to the transaction in history that goes to https://metamask.github.io/eth-tx-viz too help visualize transactions and to where they are going. +- Show "Buy Ether" button and warning on tx confirmation when sender balance is insufficient ## 2.12.1 2016-09-14 diff --git a/ui/app/components/transaction-list-item.js b/ui/app/components/transaction-list-item.js index 8f96e2942..491e90c7c 100644 --- a/ui/app/components/transaction-list-item.js +++ b/ui/app/components/transaction-list-item.js @@ -44,19 +44,28 @@ TransactionListItem.prototype.render = function () { return ( h(`.transaction-list-item.flex-row.flex-space-between${isClickable ? '.pointer' : ''}`, { + onClick: (event) => { + if (isPending) { + this.props.showTx(transaction.id) + } + event.stopPropagation() + if (!transaction.hash || !isLinkable) return + var url = explorerLink(transaction.hash, parseInt(network)) + extension.tabs.create({ url }) + }, style: { padding: '20px 0', }, }, [ - // large identicon h('.identicon-wrapper.flex-column.flex-center.select-none', [ transaction.status === 'unconfirmed' ? h('i.fa.fa-ellipsis-h', { style: { fontSize: '27px', }, }) : h( '.pop-hover', { - onClick: () => { + onClick: (event) => { + event.stopPropagation() if (!isTx || isPending) return var url = `https://metamask.github.io/eth-tx-viz/?tx=${transaction.hash}` extension.tabs.create({ url }) @@ -66,21 +75,7 @@ TransactionListItem.prototype.render = function () { ]), ]), - h('.flex-column', { - onClick: (event) => { - if (isPending) { - this.props.showTx(transaction.id) - } - - if (!transaction.hash || !isLinkable) return - var url = explorerLink(transaction.hash, parseInt(network)) - extension.tabs.create({ url }) - }, - style: { - width: '200px', - overflow: 'hidden', - }, - }, [ + h('.flex-column', {style: {width: '200px', overflow: 'hidden'}}, [ domainField(txParams), h('div', date), recipientField(txParams, transaction, isTx, isMsg),