4byte fallback (#6551)

* Adds 4byte registry fallback to getMethodData() (#6435)

* Adds fetchWithCache to guard against unnecessary API calls

* Add custom fetch wrapper with abort on timeout

* Use opts and cacheRefreshTime in fetch-with-cache util

* Use custom fetch wrapper with timeout for fetch-with-cache

* Improve contract method data fetching (#6623)

* Remove async call from getTransactionActionKey()

* Stop blocking confirm screen rendering on method data loading, and base screen route on transactionCategory

* Remove use of withMethodData, fix use of knownMethodData, in relation to transaction-list-item.component

* Load data contract method data progressively, making it non-blocking; requires simplifying conf-tx-base lifecycle logic.

* Allow editing of gas price while loading on the confirm screen.

* Fix transactionAction component and its unit tests.

* Fix confirm transaction components for cases of route transitions within metamask.

* Only call toString on id if truthy in getNavigateTxData()

* Fix knownMethodData retrieval and data fetching from fourbyte

1 files changed, 25 insertions, 6 deletions

diff --git a/ui/app/pages/confirm-transaction/confirm-transaction.container.js b/ui/app/pages/confirm-transaction/confirm-transaction.container.js
index 2dd5e833e..993e880c2 100644
--- a/ui/app/pages/confirm-transaction/confirm-transaction.container.js
+++ b/ui/app/pages/confirm-transaction/confirm-transaction.container.js
@@ -8,26 +8,45 @@ import {
 import {
   fetchBasicGasAndTimeEstimates,
 } from '../../ducks/gas/gas.duck'
+
+import {
+  getContractMethodData,
+} from '../../store/actions'
 import ConfirmTransaction from './confirm-transaction.component'
-import { getTotalUnapprovedCount } from '../../selectors/selectors'
 import { unconfirmedTransactionsListSelector } from '../../selectors/confirm-transaction'
 
-const mapStateToProps = state => {
-  const { metamask: { send }, confirmTransaction } = state
+const mapStateToProps = (state, ownProps) => {
+  const { metamask: { send, unapprovedTxs }, confirmTransaction } = state
+  const { match: { params = {} } } = ownProps
+  const { id } = params
+
+  const unconfirmedTransactions = unconfirmedTransactionsListSelector(state)
+  const totalUnconfirmed = unconfirmedTransactions.length
+  const transaction = totalUnconfirmed
+    ? unapprovedTxs[id] || unconfirmedTransactions[totalUnconfirmed - 1]
+    : {}
 
   return {
-    totalUnapprovedCount: getTotalUnapprovedCount(state),
+    totalUnapprovedCount: totalUnconfirmed,
     send,
     confirmTransaction,
-    unconfirmedTransactions: unconfirmedTransactionsListSelector(state),
+    unapprovedTxs,
+    id,
+    paramsTransactionId: id && String(id),
+    transactionId: transaction.id && String(transaction.id),
+    unconfirmedTransactions,
+    transaction,
   }
 }
 
 const mapDispatchToProps = dispatch => {
   return {
-    setTransactionToConfirm: transactionId => dispatch(setTransactionToConfirm(transactionId)),
+    setTransactionToConfirm: transactionId => {
+      dispatch(setTransactionToConfirm(transactionId))
+    },
     clearConfirmTransaction: () => dispatch(clearConfirmTransaction()),
     fetchBasicGasAndTimeEstimates: () => dispatch(fetchBasicGasAndTimeEstimates()),
+    getContractMethodData: (data) => dispatch(getContractMethodData(data)),
   }
 }