old-ui - ens-input - fix params passed to input

old-ui/app/components/ens-input.js

@@ -1,7 +1,6 @@
 const Component = require('react').Component
 const h = require('react-hyperscript')
 const inherits = require('util').inherits
-const extend = require('xtend')
 const debounce = require('debounce')
 const copyToClipboard = require('copy-to-clipboard')
 const ENS = require('ethjs-ens')
@@ -20,55 +19,61 @@ function EnsInput () {
 
 EnsInput.prototype.render = function () {
   const props = this.props
-  const opts = extend(props, {
-    list: 'addresses',
-    onChange: () => {
-      const network = this.props.network
-      const networkHasEnsSupport = getNetworkEnsSupport(network)
-      if (!networkHasEnsSupport) return
-
-      const recipient = document.querySelector('input[name="address"]').value
-      if (recipient.match(ensRE) === null) {
-        return this.setState({
-          loadingEns: false,
-          ensResolution: null,
-          ensFailure: null,
-        })
-      }
 
-      this.setState({
+  function onInputChange() {
-        loadingEns: true,
+    const network = this.props.network
+    const networkHasEnsSupport = getNetworkEnsSupport(network)
+    if (!networkHasEnsSupport) return
+
+    const recipient = document.querySelector('input[name="address"]').value
+    if (recipient.match(ensRE) === null) {
+      return this.setState({
+        loadingEns: false,
+        ensResolution: null,
+        ensFailure: null,
       })
-      this.checkName()
+    }
-    },
+
-  })
+    this.setState({
-  return h('div', {
+      loadingEns: true,
-    style: { width: '100%' },
+    })
-  }, [
+    this.checkName()
-    h('input.large-input', opts),
+  }
-    // The address book functionality.
+
-    h('datalist#addresses',
+  return (
-      [
+    h('div', {
-        // Corresponds to the addresses owned.
+      style: { width: '100%' },
-        Object.keys(props.identities).map((key) => {
+    }, [
-          const identity = props.identities[key]
+      h('input.large-input', {
-          return h('option', {
+        name: props.name,
-            value: identity.address,
+        placeholder: props.placeholder,
-            label: identity.name,
+        list: 'addresses',
-            key: identity.address,
+        onChange: onInputChange.bind(this),
-          })
+      }),
-        }),
+      // The address book functionality.
-        // Corresponds to previously sent-to addresses.
+      h('datalist#addresses',
-        props.addressBook.map((identity) => {
+        [
-          return h('option', {
+          // Corresponds to the addresses owned.
-            value: identity.address,
+          Object.keys(props.identities).map((key) => {
-            label: identity.name,
+            const identity = props.identities[key]
-            key: identity.address,
+            return h('option', {
-          })
+              value: identity.address,
-        }),
+              label: identity.name,
-      ]),
+              key: identity.address,
-    this.ensIcon(),
+            })
-  ])
+          }),
+          // Corresponds to previously sent-to addresses.
+          props.addressBook.map((identity) => {
+            return h('option', {
+              value: identity.address,
+              label: identity.name,
+              key: identity.address,
+            })
+          }),
+        ]),
+      this.ensIcon(),
+    ])
+  )
 }
 
 EnsInput.prototype.componentDidMount = function () {