From 37ed73c3723ba01ab5fa706fbce800f0d27d3844 Mon Sep 17 00:00:00 2001 From: Whymarrh Whitby Date: Tue, 20 Aug 2019 12:37:43 -0230 Subject: [PATCH 1/4] Fix styling of .transaction-list --- .../app/transaction-list/index.scss | 33 ++++--------------- 1 file changed, 7 insertions(+), 26 deletions(-) diff --git a/ui/app/components/app/transaction-list/index.scss b/ui/app/components/app/transaction-list/index.scss index 7535137e2169..42eddd31e3a9 100644 --- a/ui/app/components/app/transaction-list/index.scss +++ b/ui/app/components/app/transaction-list/index.scss @@ -11,34 +11,15 @@ } &__header { + flex: 0 0 auto; + font-size: 14px; + line-height: 20px; + color: $Grey-400; border-bottom: 1px solid $Grey-100; + padding: 8px 0 8px 20px; - &__tabs { - display: flex; - } - - &__tab, - &__tab--selected { - flex: 0 0 auto; - font-size: 14px; - line-height: 20px; - color: $Grey-400; - padding: 8px 0 8px 20px; - cursor: pointer; - - &:hover { - font-weight: bold; - } - - @media screen and (max-width: $break-small) { - padding: 8px 0 8px 16px; - } - } - - &__tab--selected { - font-weight: bold; - color: $Blue-400; - cursor: auto; + @media screen and (max-width: $break-small) { + padding: 8px 0 8px 16px; } } From bb0287635765363a20b90d52b0cafa04d6978be8 Mon Sep 17 00:00:00 2001 From: Whymarrh Whitby Date: Tue, 20 Aug 2019 13:02:36 -0230 Subject: [PATCH 2/4] FIlter incomingTxListSelector by network as well --- app/scripts/controllers/incoming-transactions.js | 8 ++++---- ui/app/selectors/transactions.js | 5 ++++- 2 files changed, 8 insertions(+), 5 deletions(-) diff --git a/app/scripts/controllers/incoming-transactions.js b/app/scripts/controllers/incoming-transactions.js index 4b431442726c..81223c15580e 100644 --- a/app/scripts/controllers/incoming-transactions.js +++ b/app/scripts/controllers/incoming-transactions.js @@ -14,10 +14,10 @@ const { MAINNET, } = require('./network/enums') const networkTypeToIdMap = { - [ROPSTEN]: ROPSTEN_CODE, - [RINKEBY]: RINKEYBY_CODE, - [KOVAN]: KOVAN_CODE, - [MAINNET]: MAINNET_CODE, + [ROPSTEN]: String(ROPSTEN_CODE), + [RINKEBY]: String(RINKEYBY_CODE), + [KOVAN]: String(KOVAN_CODE), + [MAINNET]: String(MAINNET_CODE), } class IncomingTransactionsController { diff --git a/ui/app/selectors/transactions.js b/ui/app/selectors/transactions.js index 5450978a66bc..d52170c34dde 100644 --- a/ui/app/selectors/transactions.js +++ b/ui/app/selectors/transactions.js @@ -16,9 +16,12 @@ import txHelper from '../../lib/tx-helper' export const shapeShiftTxListSelector = state => state.metamask.shapeShiftTxList export const incomingTxListSelector = state => { + const network = state.metamask.network const selectedAddress = state.metamask.selectedAddress return Object.values(state.metamask.incomingTransactions) - .filter(({ txParams }) => txParams.to === selectedAddress) + .filter(({ metamaskNetworkId, txParams }) => ( + txParams.to === selectedAddress && metamaskNetworkId === network + )) } export const unapprovedMsgsSelector = state => state.metamask.unapprovedMsgs export const selectedAddressTxListSelector = state => state.metamask.selectedAddressTxList From 2378608f501dab94c708e4cf948a13ba188506d8 Mon Sep 17 00:00:00 2001 From: Whymarrh Whitby Date: Tue, 20 Aug 2019 13:44:23 -0230 Subject: [PATCH 3/4] Start and stop block tracker polling in incoming tx controller --- .../controllers/incoming-transactions.js | 25 ++++++++---- app/scripts/metamask-controller.js | 2 + .../controllers/incoming-transactions-test.js | 39 +++++++++++++------ 3 files changed, 47 insertions(+), 19 deletions(-) diff --git a/app/scripts/controllers/incoming-transactions.js b/app/scripts/controllers/incoming-transactions.js index 81223c15580e..2de508f6742a 100644 --- a/app/scripts/controllers/incoming-transactions.js +++ b/app/scripts/controllers/incoming-transactions.js @@ -33,6 +33,15 @@ class IncomingTransactionsController { this.preferencesController = preferencesController this.getCurrentNetwork = () => networkController.getProviderConfig().type + this._onLatestBlock = async (newBlockNumberHex) => { + const selectedAddress = this.preferencesController.getSelectedAddress() + const newBlockNumberDec = parseInt(newBlockNumberHex, 16) + await this._update({ + address: selectedAddress, + newBlockNumberDec, + }) + } + const initState = Object.assign({ incomingTransactions: {}, incomingTxLastFetchedBlocksByNetwork: { @@ -51,13 +60,6 @@ class IncomingTransactionsController { networkType: newType, }) }) - this.blockTracker.on('latest', async (newBlockNumberHex) => { - const address = this.preferencesController.getSelectedAddress() - await this._update({ - address, - newBlockNumberDec: parseInt(newBlockNumberHex, 16), - }) - }) this.preferencesController.store.subscribe(async ({ selectedAddress }) => { await this._update({ address: selectedAddress, @@ -65,6 +67,15 @@ class IncomingTransactionsController { }) } + start () { + this.blockTracker.removeListener('latest', this._onLatestBlock) + this.blockTracker.addListener('latest', this._onLatestBlock) + } + + stop () { + this.blockTracker.removeListener('latest', this._onLatestBlock) + } + async _update ({ address, newBlockNumberDec, networkType } = {}) { try { const dataForUpdate = await this._getDataForUpdate({ address, newBlockNumberDec, networkType }) diff --git a/app/scripts/metamask-controller.js b/app/scripts/metamask-controller.js index 14fa143f438a..b430ea8b9a40 100644 --- a/app/scripts/metamask-controller.js +++ b/app/scripts/metamask-controller.js @@ -156,8 +156,10 @@ module.exports = class MetamaskController extends EventEmitter { this.on('controllerConnectionChanged', (activeControllerConnections) => { if (activeControllerConnections > 0) { this.accountTracker.start() + this.incomingTransactionsController.start() } else { this.accountTracker.stop() + this.incomingTransactionsController.stop() } }) diff --git a/test/unit/app/controllers/incoming-transactions-test.js b/test/unit/app/controllers/incoming-transactions-test.js index 923da7de9fee..e77c83a3d536 100644 --- a/test/unit/app/controllers/incoming-transactions-test.js +++ b/test/unit/app/controllers/incoming-transactions-test.js @@ -49,7 +49,8 @@ describe('IncomingTransactionsController', () => { } const MOCK_BLOCKTRACKER = { - on: sinon.spy(), + addListener: sinon.spy(), + removeListener: sinon.spy(), testProperty: 'fakeBlockTracker', getCurrentBlock: () => '0xa', } @@ -95,17 +96,6 @@ describe('IncomingTransactionsController', () => { }) incomingTransactionsController._update.resetHistory() - - assert(incomingTransactionsController.blockTracker.on.calledOnce) - assert.equal(incomingTransactionsController.blockTracker.on.getCall(0).args[0], 'latest') - const blockTrackerListenerCallback = incomingTransactionsController.blockTracker.on.getCall(0).args[1] - assert.equal(incomingTransactionsController._update.callCount, 0) - blockTrackerListenerCallback('0xabc') - assert.equal(incomingTransactionsController._update.callCount, 1) - assert.deepEqual(incomingTransactionsController._update.getCall(0).args[0], { - address: '0x0101', - newBlockNumberDec: 2748, - }) }) it('should set the store to a provided initial state', () => { @@ -120,6 +110,31 @@ describe('IncomingTransactionsController', () => { }) }) + describe('#start', () => { + it('should set up a listener for the latest block', () => { + const incomingTransactionsController = new IncomingTransactionsController({ + blockTracker: MOCK_BLOCKTRACKER, + networkController: MOCK_NETWORK_CONTROLLER, + preferencesController: MOCK_PREFERENCES_CONTROLLER, + initState: {}, + }) + sinon.spy(incomingTransactionsController, '_update') + + incomingTransactionsController.start() + + assert(incomingTransactionsController.blockTracker.addListener.calledOnce) + assert.equal(incomingTransactionsController.blockTracker.addListener.getCall(0).args[0], 'latest') + const blockTrackerListenerCallback = incomingTransactionsController.blockTracker.addListener.getCall(0).args[1] + assert.equal(incomingTransactionsController._update.callCount, 0) + blockTrackerListenerCallback('0xabc') + assert.equal(incomingTransactionsController._update.callCount, 1) + assert.deepEqual(incomingTransactionsController._update.getCall(0).args[0], { + address: '0x0101', + newBlockNumberDec: 2748, + }) + }) + }) + describe('_getDataForUpdate', () => { it('should call fetchAll with the correct params when passed a new block number and the current network has no stored block', async () => { const incomingTransactionsController = new IncomingTransactionsController({ From 1254019ea9d954d386302292a92ac1d0716cd4d2 Mon Sep 17 00:00:00 2001 From: Whymarrh Whitby Date: Tue, 20 Aug 2019 14:12:23 -0230 Subject: [PATCH 4/4] Add fetch with abort in bg for IncomingTxController --- .../controllers/incoming-transactions.js | 5 +++- app/scripts/lib/util.js | 24 +++++++++++++++++++ 2 files changed, 28 insertions(+), 1 deletion(-) diff --git a/app/scripts/controllers/incoming-transactions.js b/app/scripts/controllers/incoming-transactions.js index 2de508f6742a..1a970cdfe104 100644 --- a/app/scripts/controllers/incoming-transactions.js +++ b/app/scripts/controllers/incoming-transactions.js @@ -2,7 +2,7 @@ const ObservableStore = require('obs-store') const log = require('loglevel') const BN = require('bn.js') const createId = require('../lib/random-id') -const { bnToHex } = require('../lib/util') +const { bnToHex, fetchWithTimeout } = require('../lib/util') const { MAINNET_CODE, ROPSTEN_CODE, @@ -19,6 +19,9 @@ const networkTypeToIdMap = { [KOVAN]: String(KOVAN_CODE), [MAINNET]: String(MAINNET_CODE), } +const fetch = fetchWithTimeout({ + timeout: 30000, +}) class IncomingTransactionsController { diff --git a/app/scripts/lib/util.js b/app/scripts/lib/util.js index 2eb71c0a0080..09633479494d 100644 --- a/app/scripts/lib/util.js +++ b/app/scripts/lib/util.js @@ -144,6 +144,29 @@ function removeListeners (listeners, emitter) { }) } +function fetchWithTimeout ({ timeout = 120000 } = {}) { + return async function _fetch (url, opts) { + const abortController = new AbortController() + const abortSignal = abortController.signal + const f = fetch(url, { + ...opts, + signal: abortSignal, + }) + + const timer = setTimeout(() => abortController.abort(), timeout) + + try { + const res = await f + clearTimeout(timer) + return res + } catch (e) { + clearTimeout(timer) + throw e + } + } +} + + module.exports = { removeListeners, applyListeners, @@ -154,4 +177,5 @@ module.exports = { hexToBn, bnToHex, BnMultiplyByFraction, + fetchWithTimeout, }