From ff20543c598ac1534adc531e030373b57e88c891 Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Thu, 19 May 2016 19:00:14 -0700 Subject: Render failed tx in tx list --- ui/app/account-detail.js | 2 -- ui/app/components/transaction-list.js | 35 ++++++++++++++++++++++++++++------- 2 files changed, 28 insertions(+), 9 deletions(-) (limited to 'ui') diff --git a/ui/app/account-detail.js b/ui/app/account-detail.js index 489392473..c708580c4 100644 --- a/ui/app/account-detail.js +++ b/ui/app/account-detail.js @@ -179,8 +179,6 @@ AccountDetailScreen.prototype.transactionList = function() { .filter(tx => tx.txParams.from === state.address) // only transactions that are on the current network .filter(tx => tx.txParams.metamaskNetworkId === state.networkVersion) - // only transactions that have a hash - .filter(tx => tx.hash) // sort by recency .sort((a, b) => b.time - a.time) diff --git a/ui/app/components/transaction-list.js b/ui/app/components/transaction-list.js index 5e9ec8b87..e912e36f6 100644 --- a/ui/app/components/transaction-list.js +++ b/ui/app/components/transaction-list.js @@ -57,10 +57,10 @@ module.exports = function(transactions, network) { ) - function renderTransaction(transaction){ + function renderTransaction(transaction, i){ var panelOpts = { - key: `tx-${transaction.hash}`, + key: `tx-${transaction.id + i}`, identiconKey: transaction.txParams.to, onClick: (event) => { var url = explorerLink(transaction.hash, parseInt(network)) @@ -88,7 +88,7 @@ module.exports = function(transactions, network) { return ( h('.transaction-list-item.flex-row.flex-space-between.cursor-pointer', { - key: `tx-${transaction.hash}`, + key: `tx-${transaction.id + i}`, onClick: (event) => { var url = explorerLink(transaction.hash, parseInt(network)) chrome.tabs.create({ url }) @@ -107,7 +107,7 @@ module.exports = function(transactions, network) { h('div', date), - recipientField(txParams), + recipientField(txParams, transaction), ]), @@ -120,14 +120,17 @@ module.exports = function(transactions, network) { } } -function recipientField(txParams) { +function recipientField(txParams, transaction) { if (txParams.to) { return h('div', { style: { fontSize: 'small', color: '#ABA9AA', }, - }, addressSummary(txParams.to)) + }, [ + addressSummary(txParams.to), + failIfFailed(transaction), + ]) } else { @@ -136,7 +139,11 @@ function recipientField(txParams) { fontSize: 'small', color: '#ABA9AA', }, - }, 'Contract Published') + },[ + 'Contract Published', + failIfFailed(transaction), + ]) + } } @@ -145,6 +152,14 @@ function formatDate(date){ } function identicon(txParams, transaction) { + if (transaction.status === 'rejected') { + return h('i.fa.fa-exclamation-triangle.fa-lg.error', { + style: { + width: '24px', + } + }) + } + if (txParams.to) { return h(Identicon, { diameter: 24, @@ -158,3 +173,9 @@ function identicon(txParams, transaction) { }) } } + +function failIfFailed(transaction) { + if (transaction.status === 'rejected') { + return h('span.error', ' (Failed)') + } +} -- cgit From d71ee6927f3b380c324c62f0b557cadaad54b037 Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Thu, 19 May 2016 19:06:06 -0700 Subject: Do not forward to null tx explorer page --- ui/app/components/transaction-list.js | 1 + 1 file changed, 1 insertion(+) (limited to 'ui') diff --git a/ui/app/components/transaction-list.js b/ui/app/components/transaction-list.js index e912e36f6..6cc35243f 100644 --- a/ui/app/components/transaction-list.js +++ b/ui/app/components/transaction-list.js @@ -63,6 +63,7 @@ module.exports = function(transactions, network) { key: `tx-${transaction.id + i}`, identiconKey: transaction.txParams.to, onClick: (event) => { + if (!transaction.hash) return var url = explorerLink(transaction.hash, parseInt(network)) chrome.tabs.create({ url }) }, -- cgit From 2a6d6fcd158d0e108b50c51a6deb5405505eeda6 Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Thu, 19 May 2016 19:11:53 -0700 Subject: Improve tx list style Tx list no longer enlarges on hover, and failed transactions no longer have hover styles nor direct to an explorer page. --- ui/app/components/transaction-list.js | 27 ++------------------------- ui/app/css/lib.css | 5 ++++- 2 files changed, 6 insertions(+), 26 deletions(-) (limited to 'ui') diff --git a/ui/app/components/transaction-list.js b/ui/app/components/transaction-list.js index 6cc35243f..f85aab70f 100644 --- a/ui/app/components/transaction-list.js +++ b/ui/app/components/transaction-list.js @@ -59,38 +59,15 @@ module.exports = function(transactions, network) { function renderTransaction(transaction, i){ - var panelOpts = { - key: `tx-${transaction.id + i}`, - identiconKey: transaction.txParams.to, - onClick: (event) => { - if (!transaction.hash) return - var url = explorerLink(transaction.hash, parseInt(network)) - chrome.tabs.create({ url }) - }, - attributes: [ - { - key: 'TIME', - value: formatDate(transaction.time), - }, - { - key: 'TO', - value: addressSummary(transaction.txParams.to), - }, - { - key: 'VALUE', - value: formatBalance(transaction.txParams.value), - }, - ] - } - var txParams = transaction.txParams var date = formatDate(transaction.time) return ( - h('.transaction-list-item.flex-row.flex-space-between.cursor-pointer', { + h(`.transaction-list-item.flex-row.flex-space-between${transaction.hash ? '.pointer' : ''}`, { key: `tx-${transaction.id + i}`, onClick: (event) => { + if (!transaction.hash) return var url = explorerLink(transaction.hash, parseInt(network)) chrome.tabs.create({ url }) }, diff --git a/ui/app/css/lib.css b/ui/app/css/lib.css index 60c56422d..1eba7465b 100644 --- a/ui/app/css/lib.css +++ b/ui/app/css/lib.css @@ -5,7 +5,7 @@ } .color-forest { - color: #0A5448; + color: #0A5448; } /* lib */ @@ -107,6 +107,9 @@ user-select: none; } +.pointer { + cursor: pointer; +} .cursor-pointer { cursor: pointer; transform-origin: center center; -- cgit