diff --git a/CHANGELOG.md b/CHANGELOG.md index 14b96ce70..63e59617f 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,6 +2,8 @@ ## 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. - Show "Buy Ether" button and warning on tx confirmation when sender balance is insufficient - Show loading indication when selecting ShapeShift as purchasing method. diff --git a/ui/app/components/transaction-list-item.js b/ui/app/components/transaction-list-item.js index 66a232981..491e90c7c 100644 --- a/ui/app/components/transaction-list-item.js +++ b/ui/app/components/transaction-list-item.js @@ -48,7 +48,7 @@ TransactionListItem.prototype.render = function () { 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 }) @@ -58,10 +58,21 @@ TransactionListItem.prototype.render = function () { }, }, [ - // 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 }), + transaction.status === 'unconfirmed' ? h('i.fa.fa-ellipsis-h', { + style: { + fontSize: '27px', + }, + }) : h( '.pop-hover', { + onClick: (event) => { + event.stopPropagation() + 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', {style: {width: '200px', overflow: 'hidden'}}, [