Add withMethodData HOC, add higher-order-component folder

2 files changed, 45 insertions, 0 deletions

diff --git a/ui/app/higher-order-components/with-method-data/index.js b/ui/app/higher-order-components/with-method-data/index.js
new file mode 100644
index 000000000..f511e1ae7
--- /dev/null
+++ b/ui/app/higher-order-components/with-method-data/index.js
@@ -0,0 +1 @@
+export { default } from './with-method-data.component'
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
new file mode 100644
index 000000000..aa38afd8a
--- /dev/null
+++ b/ui/app/higher-order-components/with-method-data/with-method-data.component.js
@@ -0,0 +1,44 @@
+import React, { PureComponent } from 'react'
+import PropTypes from 'prop-types'
+import { getMethodData } from '../../helpers/confirm-transaction/util'
+
+export default function withMethodData (WrappedComponent) {
+  return class MethodDataWrappedComponent extends PureComponent {
+    static propTypes = {
+      transaction: PropTypes.object,
+    }
+
+    static defaultProps = {
+      transaction: {},
+    }
+
+    state = {
+      methodData: {},
+    }
+
+    componentDidMount () {
+      this.fetchMethodData()
+    }
+
+    async fetchMethodData () {
+      const { transaction } = this.props
+      const { txParams: { data = '' } = {} } = transaction
+
+      if (data) {
+        const methodData = await getMethodData(data)
+        this.setState({ methodData })
+      }
+    }
+
+    render () {
+      const { methodData } = this.state
+
+      return (
+        <WrappedComponent
+          { ...this.props }
+          methodData={methodData}
+        />
+      )
+    }
+  }
+}