From bd9d89826c2bbd6e91a088040b7708de89658d1a Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Thu, 18 Aug 2016 16:23:12 -0700 Subject: Added `view more` button to transaction list Visible at the end of the transaction list, or if no transactions are listed, displayed right after the `No Transactions` message. --- ui/app/components/transaction-list.js | 33 ++++++++++++++++++++++++++------- 1 file changed, 26 insertions(+), 7 deletions(-) (limited to 'ui/app/components/transaction-list.js') diff --git a/ui/app/components/transaction-list.js b/ui/app/components/transaction-list.js index 886aa7c00..eae1965ff 100644 --- a/ui/app/components/transaction-list.js +++ b/ui/app/components/transaction-list.js @@ -1,6 +1,8 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits +const genAccountLink = require('../../lib/account-link') +const extension = require('../../../app/scripts/lib/extension') const TransactionListItem = require('./transaction-list-item') @@ -13,9 +15,10 @@ function TransactionList () { } TransactionList.prototype.render = function () { - const { txsToRender, network, unconfMsgs } = this.props + const { txsToRender, network, unconfMsgs, address } = this.props const transactions = txsToRender.concat(unconfMsgs) .sort((a, b) => b.time - a.time) + const accountLink = genAccountLink(address, network) return ( @@ -45,11 +48,11 @@ TransactionList.prototype.render = function () { h('.tx-list', { style: { overflowY: 'auto', - height: '305px', + height: '300px', padding: '0 20px', textAlign: 'center', }, - }, ( + }, [ transactions.length ? transactions.map((transaction, i) => { @@ -59,13 +62,29 @@ TransactionList.prototype.render = function () { this.props.viewPendingTx(txId) }, }) - }) - : [h('.flex-center', { + }).concat(viewMoreButton(accountLink)) + : h('.flex-center', { style: { + flexDirection: 'column', height: '100%', }, - }, 'No transaction history...')] - )), + }, [ + 'No transaction history.', + viewMoreButton(accountLink), + ]), + ]), ]) ) } + +function viewMoreButton(url) { + return url ? h('button', { + style: { + margin: '10px', + }, + onClick: (ev) => { + ev.preventDefault() + extension.tabs.create({ url }) + } + }, 'View More') : null +} -- cgit From 4f857e297b2309a8056b6c33cc7eef67e3c2b2f8 Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Thu, 18 Aug 2016 16:27:25 -0700 Subject: Linted --- ui/app/components/transaction-list.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'ui/app/components/transaction-list.js') diff --git a/ui/app/components/transaction-list.js b/ui/app/components/transaction-list.js index eae1965ff..fbe4d41a8 100644 --- a/ui/app/components/transaction-list.js +++ b/ui/app/components/transaction-list.js @@ -85,6 +85,6 @@ function viewMoreButton(url) { onClick: (ev) => { ev.preventDefault() extension.tabs.create({ url }) - } + }, }, 'View More') : null } -- cgit From fe5fff3248bd40803db3b9f3553728d9693e740d Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Thu, 18 Aug 2016 17:47:42 -0700 Subject: Change 'View More' to 'Show More' --- ui/app/components/transaction-list.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'ui/app/components/transaction-list.js') diff --git a/ui/app/components/transaction-list.js b/ui/app/components/transaction-list.js index fbe4d41a8..85744381d 100644 --- a/ui/app/components/transaction-list.js +++ b/ui/app/components/transaction-list.js @@ -86,5 +86,5 @@ function viewMoreButton(url) { ev.preventDefault() extension.tabs.create({ url }) }, - }, 'View More') : null + }, 'Show More') : null } -- cgit From f57cbe59fc9e0d3cfb3ee54da749470248fe2b8b Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Mon, 22 Aug 2016 14:36:21 -0700 Subject: Removed view more button, added account info button. Also: - Also fixed bug that caused React warning when rendering the tx history. - Renamed 'Transactions' to 'History', since it now has more than that. --- ui/app/components/transaction-list.js | 28 ++++++++++++---------------- 1 file changed, 12 insertions(+), 16 deletions(-) (limited to 'ui/app/components/transaction-list.js') diff --git a/ui/app/components/transaction-list.js b/ui/app/components/transaction-list.js index 9348b9fc4..8b9004e69 100644 --- a/ui/app/components/transaction-list.js +++ b/ui/app/components/transaction-list.js @@ -16,7 +16,6 @@ function TransactionList () { TransactionList.prototype.render = function () { const { txsToRender, network, unconfMsgs, address } = this.props - const transactions = txsToRender.concat(unconfMsgs) var shapeShiftTxList if (network === '1'){ shapeShiftTxList = this.props.shapeShiftTxList @@ -47,7 +46,7 @@ TransactionList.prototype.render = function () { paddingBottom: '4px', }, }, [ - 'Transactions', + 'History', ]), h('.tx-list', { @@ -61,13 +60,22 @@ TransactionList.prototype.render = function () { transactions.length ? transactions.map((transaction, i) => { + let key + switch (transaction.key) { + case 'shapeshift': + const { depositAddress, time } = transaction + key = `shift-tx-${depositAddress}-${time}-${i}` + break + default: + key = `tx-${transaction.id}-${i}` + } return h(TransactionListItem, { - transaction, i, network, + transaction, i, network, key, showTx: (txId) => { this.props.viewPendingTx(txId) }, }) - }).concat(viewMoreButton(accountLink)) + }) : h('.flex-center', { style: { flexDirection: 'column', @@ -75,21 +83,9 @@ TransactionList.prototype.render = function () { }, }, [ 'No transaction history.', - viewMoreButton(accountLink), ]), ]), ]) ) } -function viewMoreButton(url) { - return url ? h('button', { - style: { - margin: '10px', - }, - onClick: (ev) => { - ev.preventDefault() - extension.tabs.create({ url }) - }, - }, 'Show More') : null -} -- cgit From 17f3f90d805d91aedac517c8d6607a1f337c6525 Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Mon, 22 Aug 2016 17:21:54 -0700 Subject: Linted --- ui/app/components/transaction-list.js | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) (limited to 'ui/app/components/transaction-list.js') diff --git a/ui/app/components/transaction-list.js b/ui/app/components/transaction-list.js index 8b9004e69..fac289a80 100644 --- a/ui/app/components/transaction-list.js +++ b/ui/app/components/transaction-list.js @@ -2,7 +2,6 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits const genAccountLink = require('../../lib/account-link') -const extension = require('../../../app/scripts/lib/extension') const TransactionListItem = require('./transaction-list-item') @@ -17,12 +16,11 @@ function TransactionList () { TransactionList.prototype.render = function () { const { txsToRender, network, unconfMsgs, address } = this.props var shapeShiftTxList - if (network === '1'){ + if (network === '1') { shapeShiftTxList = this.props.shapeShiftTxList } const transactions = !shapeShiftTxList ? txsToRender.concat(unconfMsgs) : txsToRender.concat(unconfMsgs, shapeShiftTxList) .sort((a, b) => b.time - a.time) - const accountLink = genAccountLink(address, network) return ( -- cgit From 5d24621b56427bffde26ab9281bd6990a04bbfef Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Mon, 22 Aug 2016 17:37:16 -0700 Subject: More linting --- ui/app/components/transaction-list.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) (limited to 'ui/app/components/transaction-list.js') diff --git a/ui/app/components/transaction-list.js b/ui/app/components/transaction-list.js index fac289a80..7e1bedb05 100644 --- a/ui/app/components/transaction-list.js +++ b/ui/app/components/transaction-list.js @@ -1,7 +1,6 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits -const genAccountLink = require('../../lib/account-link') const TransactionListItem = require('./transaction-list-item') @@ -14,7 +13,7 @@ function TransactionList () { } TransactionList.prototype.render = function () { - const { txsToRender, network, unconfMsgs, address } = this.props + const { txsToRender, network, unconfMsgs } = this.props var shapeShiftTxList if (network === '1') { shapeShiftTxList = this.props.shapeShiftTxList -- cgit