Refactor transactions list views. Add redesign components

1 files changed, 16 insertions, 6 deletions

diff --git a/ui/app/higher-order-components/with-method-data/with-method-data.component.js b/ui/app/higher-order-components/with-method-data/with-method-data.component.js
index aa38afd8a..c05d33c20 100644
--- a/ui/app/higher-order-components/with-method-data/with-method-data.component.js
+++ b/ui/app/higher-order-components/with-method-data/with-method-data.component.js
@@ -1,6 +1,6 @@
 import React, { PureComponent } from 'react'
 import PropTypes from 'prop-types'
-import { getMethodData } from '../../helpers/confirm-transaction/util'
+import { getMethodData } from '../../helpers/transactions.util'
 
 export default function withMethodData (WrappedComponent) {
   return class MethodDataWrappedComponent extends PureComponent {
@@ -13,7 +13,11 @@ export default function withMethodData (WrappedComponent) {
     }
 
     state = {
-      methodData: {},
+      methodData: {
+        data: {},
+      },
+      isFetching: false,
+      error: null,
     }
 
     componentDidMount () {
@@ -25,18 +29,24 @@ export default function withMethodData (WrappedComponent) {
       const { txParams: { data = '' } = {} } = transaction
 
       if (data) {
-        const methodData = await getMethodData(data)
-        this.setState({ methodData })
+        this.setState({ isFetching: true })
+
+        try {
+          const methodData = await getMethodData(data)
+          this.setState({ methodData, isFetching: false })
+        } catch (error) {
+          this.setState({ isFetching: false, error })
+        }
       }
     }
 
     render () {
-      const { methodData } = this.state
+      const { methodData, isFetching, error } = this.state
 
       return (
         <WrappedComponent
           { ...this.props }
-          methodData={methodData}
+          methodData={{ data: methodData, isFetching, error }}
         />
       )
     }