From 16a085f784db511eafe46b0c29ae3a6941074727 Mon Sep 17 00:00:00 2001
From: Erik Marks <rekmarks@protonmail.com>
Date: Wed, 13 Nov 2019 10:12:28 -0800
Subject: [PATCH 1/4] fix batch transaction ui; update json-rpc-engine

Default to showing the earliest created transaction when routing to confirm screens
---
 .../transactions/tx-state-manager.js          |  1 +
 package.json                                  |  4 +--
 .../confirm-transaction-base.component.js     |  2 +-
 .../confirm-transaction-base.container.js     | 10 +++----
 .../confirm-transaction-switch.container.js   |  2 +-
 .../confirm-transaction.container.js          |  2 +-
 ui/index.js                                   |  2 +-
 yarn.lock                                     | 30 +++++++++++++++----
 8 files changed, 37 insertions(+), 16 deletions(-)

diff --git a/app/scripts/controllers/transactions/tx-state-manager.js b/app/scripts/controllers/transactions/tx-state-manager.js
index ffbe6f0107b0..1795474e4c9e 100644
--- a/app/scripts/controllers/transactions/tx-state-manager.js
+++ b/app/scripts/controllers/transactions/tx-state-manager.js
@@ -167,6 +167,7 @@ class TransactionStateManager extends EventEmitter {
         transactions.splice(index, 1)
       }
     }
+
     const newTxIndex = transactions
       .findIndex((currentTxMeta) => currentTxMeta.time > txMeta.time)
 
diff --git a/package.json b/package.json
index db81f3fcabcd..072c43aeeff3 100644
--- a/package.json
+++ b/package.json
@@ -96,7 +96,7 @@
     "eth-json-rpc-errors": "^2.0.0",
     "eth-json-rpc-filters": "^4.1.1",
     "eth-json-rpc-infura": "^4.0.1",
-    "eth-json-rpc-middleware": "^4.2.0",
+    "eth-json-rpc-middleware": "^4.4.0",
     "eth-keyring-controller": "^5.3.0",
     "eth-ledger-bridge-keyring": "^0.2.0",
     "eth-method-registry": "^1.2.0",
@@ -122,7 +122,7 @@
     "gaba": "^1.9.0",
     "human-standard-token-abi": "^2.0.0",
     "jazzicon": "^1.2.0",
-    "json-rpc-engine": "^5.1.5",
+    "json-rpc-engine": "^5.1.6",
     "json-rpc-middleware-stream": "^2.1.1",
     "jsonschema": "^1.2.4",
     "lodash.debounce": "^4.0.8",
diff --git a/ui/app/pages/confirm-transaction-base/confirm-transaction-base.component.js b/ui/app/pages/confirm-transaction-base/confirm-transaction-base.component.js
index 6cb8b7dd9cce..d9ef41d65c35 100644
--- a/ui/app/pages/confirm-transaction-base/confirm-transaction-base.component.js
+++ b/ui/app/pages/confirm-transaction-base/confirm-transaction-base.component.js
@@ -551,7 +551,7 @@ export default class ConfirmTransactionBase extends Component {
 
   getNavigateTxData () {
     const { currentNetworkUnapprovedTxs, txData: { id } = {} } = this.props
-    const enumUnapprovedTxs = Object.keys(currentNetworkUnapprovedTxs).reverse()
+    const enumUnapprovedTxs = Object.keys(currentNetworkUnapprovedTxs)
     const currentPosition = enumUnapprovedTxs.indexOf(id ? id.toString() : '')
 
     return {
diff --git a/ui/app/pages/confirm-transaction-base/confirm-transaction-base.container.js b/ui/app/pages/confirm-transaction-base/confirm-transaction-base.container.js
index e391c1877449..6a1ea553942d 100644
--- a/ui/app/pages/confirm-transaction-base/confirm-transaction-base.container.js
+++ b/ui/app/pages/confirm-transaction-base/confirm-transaction-base.container.js
@@ -1,7 +1,6 @@
 import { connect } from 'react-redux'
 import { compose } from 'recompose'
 import { withRouter } from 'react-router-dom'
-import R from 'ramda'
 import contractMap from 'eth-contract-metadata'
 import ConfirmTransactionBase from './confirm-transaction-base.component'
 import {
@@ -68,7 +67,9 @@ const mapStateToProps = (state, ownProps) => {
     nonce,
   } = confirmTransaction
   const { txParams = {}, lastGasPrice, id: transactionId, transactionCategory } = txData
-  const transaction = Object.values(unapprovedTxs).find(({ id }) => id === (transactionId || Number(paramsTransactionId))) || {}
+  const transaction = Object.values(unapprovedTxs).find(
+    ({ id }) => id === (transactionId || Number(paramsTransactionId))
+  ) || {}
   const {
     from: fromAddress,
     to: txParamsToAddress,
@@ -108,9 +109,8 @@ const mapStateToProps = (state, ownProps) => {
     txData.simulationFails = transaction.simulationFails
   }
 
-  const currentNetworkUnapprovedTxs = R.filter(
-    ({ metamaskNetworkId }) => metamaskNetworkId === network,
-    unapprovedTxs,
+  const currentNetworkUnapprovedTxs = Object.values(unapprovedTxs).filter(
+    ({ metamaskNetworkId }) => metamaskNetworkId === network
   )
   const unapprovedTxCount = valuesFor(currentNetworkUnapprovedTxs).length
 
diff --git a/ui/app/pages/confirm-transaction-switch/confirm-transaction-switch.container.js b/ui/app/pages/confirm-transaction-switch/confirm-transaction-switch.container.js
index d13291806c07..bb5bc12c0faf 100644
--- a/ui/app/pages/confirm-transaction-switch/confirm-transaction-switch.container.js
+++ b/ui/app/pages/confirm-transaction-switch/confirm-transaction-switch.container.js
@@ -12,7 +12,7 @@ const mapStateToProps = (state, ownProps) => {
   const unconfirmedTransactions = unconfirmedTransactionsListSelector(state)
   const totalUnconfirmed = unconfirmedTransactions.length
   const transaction = totalUnconfirmed
-    ? unapprovedTxs[transactionId] || unconfirmedTransactions[totalUnconfirmed - 1]
+    ? unapprovedTxs[transactionId] || unconfirmedTransactions[0]
     : {}
 
   return {
diff --git a/ui/app/pages/confirm-transaction/confirm-transaction.container.js b/ui/app/pages/confirm-transaction/confirm-transaction.container.js
index e097942dc226..d59a9d14e29d 100644
--- a/ui/app/pages/confirm-transaction/confirm-transaction.container.js
+++ b/ui/app/pages/confirm-transaction/confirm-transaction.container.js
@@ -33,7 +33,7 @@ const mapStateToProps = (state, ownProps) => {
   const unconfirmedTransactions = unconfirmedTransactionsListSelector(state)
   const totalUnconfirmed = unconfirmedTransactions.length
   const transaction = totalUnconfirmed
-    ? unapprovedTxs[id] || unconfirmedTransactions[totalUnconfirmed - 1]
+    ? unapprovedTxs[id] || unconfirmedTransactions[0]
     : {}
   const { id: transactionId, transactionCategory } = transaction
 
diff --git a/ui/index.js b/ui/index.js
index 028aa3d051ef..bd382ae6364d 100644
--- a/ui/index.js
+++ b/ui/index.js
@@ -65,7 +65,7 @@ async function startApp (metamaskState, backgroundConnection, opts) {
   const numberOfUnapprivedTx = unapprovedTxsAll.length
   if (numberOfUnapprivedTx > 0) {
     store.dispatch(actions.showConfTxPage({
-      id: unapprovedTxsAll[numberOfUnapprivedTx - 1].id,
+      id: unapprovedTxsAll[0].id,
     }))
   }
 
diff --git a/yarn.lock b/yarn.lock
index feda024e4e4a..27b5ef008796 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -10423,7 +10423,7 @@ eth-json-rpc-middleware@^1.5.0:
     promise-to-callback "^1.0.0"
     tape "^4.6.3"
 
-eth-json-rpc-middleware@^4.1.4, eth-json-rpc-middleware@^4.1.5, eth-json-rpc-middleware@^4.2.0:
+eth-json-rpc-middleware@^4.1.4, eth-json-rpc-middleware@^4.1.5:
   version "4.2.0"
   resolved "https://registry.yarnpkg.com/eth-json-rpc-middleware/-/eth-json-rpc-middleware-4.2.0.tgz#cfb77c5056cb8001548c6c7d54f4af5fce04d489"
   integrity sha512-90LljqRyJhkg7fOwKunh1lu1Mr5bspXMBDitaTGyGPPNiFTbMrhtfbf9fteYlXRFCbq+aIFWwl/X+P7nkrdkLg==
@@ -10443,6 +10443,26 @@ eth-json-rpc-middleware@^4.1.4, eth-json-rpc-middleware@^4.1.5, eth-json-rpc-mid
     pify "^3.0.0"
     safe-event-emitter "^1.0.1"
 
+eth-json-rpc-middleware@^4.4.0:
+  version "4.4.0"
+  resolved "https://registry.yarnpkg.com/eth-json-rpc-middleware/-/eth-json-rpc-middleware-4.4.0.tgz#ef63b783b48dcbea9c1fe25c79e6ea01510e5877"
+  integrity sha512-IeOsil/XiHsybJO9nFf86+1+YIqGQWPPfiTEp3WLkpLZhJm97kw6tFM7GttIZXIcwtaO3zEXgY6PWAH1jkB3ag==
+  dependencies:
+    btoa "^1.2.1"
+    clone "^2.1.1"
+    eth-json-rpc-errors "^1.0.1"
+    eth-query "^2.1.2"
+    eth-sig-util "^1.4.2"
+    ethereumjs-block "^1.6.0"
+    ethereumjs-tx "^1.3.7"
+    ethereumjs-util "^5.1.2"
+    ethereumjs-vm "^2.6.0"
+    fetch-ponyfill "^4.0.0"
+    json-rpc-engine "^5.1.3"
+    json-stable-stringify "^1.0.1"
+    pify "^3.0.0"
+    safe-event-emitter "^1.0.1"
+
 eth-keyring-controller@^5.3.0:
   version "5.3.0"
   resolved "https://registry.yarnpkg.com/eth-keyring-controller/-/eth-keyring-controller-5.3.0.tgz#8d85a67b894360ab7d601222ca71df8ed5f456c6"
@@ -16189,10 +16209,10 @@ json-rpc-engine@^3.4.0, json-rpc-engine@^3.6.0:
     promise-to-callback "^1.0.0"
     safe-event-emitter "^1.0.1"
 
-json-rpc-engine@^5.1.3, json-rpc-engine@^5.1.5:
-  version "5.1.5"
-  resolved "https://registry.yarnpkg.com/json-rpc-engine/-/json-rpc-engine-5.1.5.tgz#a5f9915356ea916d5305716354080723c63dede7"
-  integrity sha512-HTT9HixG4j8vHYrmJIckgbISW9Q8tCkySv7x7Q8zjMpcw10wSe/dZSQ0w08VkDm3y195K4074UlvD3hxaznvlw==
+json-rpc-engine@^5.1.3, json-rpc-engine@^5.1.5, json-rpc-engine@^5.1.6:
+  version "5.1.6"
+  resolved "https://registry.yarnpkg.com/json-rpc-engine/-/json-rpc-engine-5.1.6.tgz#3823c1e227657ac5f22a36351db5bb76fa70cf38"
+  integrity sha512-9nDeIIu6o7cvzWRrHNuNi+TiGe+YWOp3ZQkHtpPnQzXuX8Y5ZU2Oot3FDI+DaQyXIqQ6SjtM6rixDOJTjjA8NA==
   dependencies:
     async "^2.0.1"
     eth-json-rpc-errors "^2.0.0"

From a47b38473a869e7367ac7c04bbf95776b976c461 Mon Sep 17 00:00:00 2001
From: Erik Marks <rekmarks@protonmail.com>
Date: Wed, 8 Jan 2020 13:21:35 -0800
Subject: [PATCH 2/4] fix tx request numbering

---
 app/scripts/controllers/transactions/tx-state-manager.js    | 1 -
 .../confirm-transaction-base.container.js                   | 6 +++---
 2 files changed, 3 insertions(+), 4 deletions(-)

diff --git a/app/scripts/controllers/transactions/tx-state-manager.js b/app/scripts/controllers/transactions/tx-state-manager.js
index 1795474e4c9e..ffbe6f0107b0 100644
--- a/app/scripts/controllers/transactions/tx-state-manager.js
+++ b/app/scripts/controllers/transactions/tx-state-manager.js
@@ -167,7 +167,6 @@ class TransactionStateManager extends EventEmitter {
         transactions.splice(index, 1)
       }
     }
-
     const newTxIndex = transactions
       .findIndex((currentTxMeta) => currentTxMeta.time > txMeta.time)
 
diff --git a/ui/app/pages/confirm-transaction-base/confirm-transaction-base.container.js b/ui/app/pages/confirm-transaction-base/confirm-transaction-base.container.js
index 6a1ea553942d..eb6a8d9c46c6 100644
--- a/ui/app/pages/confirm-transaction-base/confirm-transaction-base.container.js
+++ b/ui/app/pages/confirm-transaction-base/confirm-transaction-base.container.js
@@ -109,9 +109,9 @@ const mapStateToProps = (state, ownProps) => {
     txData.simulationFails = transaction.simulationFails
   }
 
-  const currentNetworkUnapprovedTxs = Object.values(unapprovedTxs).filter(
-    ({ metamaskNetworkId }) => metamaskNetworkId === network
-  )
+  const currentNetworkUnapprovedTxs = Object.keys(unapprovedTxs)
+    .filter(key => unapprovedTxs[key].metamaskNetworkId === network)
+    .reduce((acc, key) => ({ ...acc, [key]: unapprovedTxs[key] }), {})
   const unapprovedTxCount = valuesFor(currentNetworkUnapprovedTxs).length
 
   const insufficientBalance = !isBalanceSufficient({

From 5d120b3e0d1bd36e96d5c19244da32ddfe0cbb05 Mon Sep 17 00:00:00 2001
From: Erik Marks <rekmarks@protonmail.com>
Date: Wed, 8 Jan 2020 15:10:38 -0800
Subject: [PATCH 3/4] fix UI console error

---
 ui/app/components/ui/button/button.component.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ui/app/components/ui/button/button.component.js b/ui/app/components/ui/button/button.component.js
index a43c140a287f..a059a7f00888 100644
--- a/ui/app/components/ui/button/button.component.js
+++ b/ui/app/components/ui/button/button.component.js
@@ -26,7 +26,7 @@ const typeHash = {
 
 const Button = ({ type, submit, large, children, className, ...buttonProps }) => (
   <button
-    type={submit && 'submit'}
+    type={submit ? 'submit' : undefined}
     className={classnames(
       'button',
       typeHash[type] || CLASSNAME_DEFAULT,

From 5ed849403aea6f235b8514efe5afc3cf1728e5e7 Mon Sep 17 00:00:00 2001
From: Erik Marks <rekmarks@protonmail.com>
Date: Thu, 9 Jan 2020 07:10:50 -0800
Subject: [PATCH 4/4] update e2e and integration tests

---
 test/e2e/metamask-ui.spec.js                 | 10 +++++-----
 test/integration/lib/confirm-sig-requests.js | 16 ++++++++--------
 2 files changed, 13 insertions(+), 13 deletions(-)

diff --git a/test/e2e/metamask-ui.spec.js b/test/e2e/metamask-ui.spec.js
index 076c26069583..3dc9b21dd405 100644
--- a/test/e2e/metamask-ui.spec.js
+++ b/test/e2e/metamask-ui.spec.js
@@ -568,11 +568,11 @@ describe('MetaMask', function () {
       await delay(regularDelayMs)
 
       let transactions = await findElements(driver, By.css('.transaction-list-item'))
-      await transactions[3].click()
+      await transactions[0].click()
       await delay(regularDelayMs)
       try {
         transactions = await findElements(driver, By.css('.transaction-list-item'), 1000)
-        await transactions[3].click()
+        await transactions[0].click()
       } catch (e) {
         console.log(e)
       }
@@ -646,7 +646,7 @@ describe('MetaMask', function () {
 
       navigationElement = await findElement(driver, By.css('.confirm-page-container-navigation'))
       navigationText = await navigationElement.getText()
-      assert.equal(navigationText.includes('3'), true, 'correct transaction in focus')
+      assert.equal(navigationText.includes('2'), true, 'correct (same) transaction in focus')
     })
 
     it('confirms a transaction', async () => {
@@ -853,9 +853,9 @@ describe('MetaMask', function () {
     it('renders the correct ETH balance', async () => {
       const balance = await findElement(driver, By.css('.transaction-view-balance__primary-balance'))
       await delay(regularDelayMs)
-      await driver.wait(until.elementTextMatches(balance, /^87.*\s*ETH.*$/), 10000)
+      await driver.wait(until.elementTextMatches(balance, /^90.*\s*ETH.*$/), 10000)
       const tokenAmount = await balance.getText()
-      assert.ok(/^87.*\s*ETH.*$/.test(tokenAmount))
+      assert.ok(/^90.*\s*ETH.*$/.test(tokenAmount))
       await delay(regularDelayMs)
     })
   })
diff --git a/test/integration/lib/confirm-sig-requests.js b/test/integration/lib/confirm-sig-requests.js
index b5b4e171fc44..fa6c3d09025a 100644
--- a/test/integration/lib/confirm-sig-requests.js
+++ b/test/integration/lib/confirm-sig-requests.js
@@ -36,8 +36,8 @@ async function runConfirmSigRequestsTest (assert) {
 
   const pendingRequestItem = $.find('.transaction-list-item .transaction-list-item__grid')
 
-  if (pendingRequestItem[2]) {
-    pendingRequestItem[2].click()
+  if (pendingRequestItem[0]) {
+    pendingRequestItem[0].click()
   }
 
   await timeout(1000)
@@ -45,11 +45,9 @@ async function runConfirmSigRequestsTest (assert) {
   let confirmSigHeadline = await queryAsync($, '.request-signature__headline')
   assert.equal(confirmSigHeadline[0].textContent, 'Your signature is being requested')
 
-  const confirmSigMessage = await queryAsync($, '.request-signature__notice')
-  assert.ok(confirmSigMessage[0].textContent.match(/^Signing\sthis\smessage/))
-
   let confirmSigRowValue = await queryAsync($, '.request-signature__row-value')
-  assert.equal(confirmSigRowValue[0].textContent, '0x879a053d4800c6354e76c7985a865d2922c82fb5b3f4577b2fe08b998954f2e0')
+  assert.equal(confirmSigRowValue[0].textContent, 'Hi, Alice!')
+  assert.equal(confirmSigRowValue[1].textContent, '1337')
 
   let confirmSigSignButton = await queryAsync($, 'button.btn-secondary.btn--large')
   confirmSigSignButton[0].click()
@@ -66,9 +64,11 @@ async function runConfirmSigRequestsTest (assert) {
   confirmSigHeadline = await queryAsync($, '.request-signature__headline')
   assert.equal(confirmSigHeadline[0].textContent, 'Your signature is being requested')
 
+  const confirmSigMessage = await queryAsync($, '.request-signature__notice')
+  assert.ok(confirmSigMessage[0].textContent.match(/^Signing\sthis\smessage/))
+
   confirmSigRowValue = await queryAsync($, '.request-signature__row-value')
-  assert.equal(confirmSigRowValue[0].textContent, 'Hi, Alice!')
-  assert.equal(confirmSigRowValue[1].textContent, '1337')
+  assert.equal(confirmSigRowValue[0].textContent, '0x879a053d4800c6354e76c7985a865d2922c82fb5b3f4577b2fe08b998954f2e0')
 
   confirmSigSignButton = await queryAsync($, 'button.btn-secondary.btn--large')
   confirmSigSignButton[0].click()