Convert InputNumber component to use JSX (#7503)

ui/app/components/app/input-number.js

@@ -1,5 +1,5 @@
+import React from 'react'
 const Component = require('react').Component
-const h = require('react-hyperscript')
 const inherits = require('util').inherits
 const {
   addCurrencies,
@@ -52,32 +52,35 @@ InputNumber.prototype.setValue = function (newValue) {
   }
 }
 
-InputNumber.prototype.render = function () {
+InputNumber.prototype.render = function InputNumber () {
   const { unitLabel, step = 1, placeholder, value } = this.props
 
-  return h('div.customize-gas-input-wrapper', {}, [
+  return (
-    h('input', {
+    <div className="customize-gas-input-wrapper">
-      className: 'customize-gas-input',
+      <input
-      value,
+        className="customize-gas-input"
-      placeholder,
+        value={value}
-      type: 'number',
+        placeholder={placeholder}
-      onChange: e => {
+        type="number"
-        this.setValue(e.target.value)
+        onChange={e => {
-      },
+          this.setValue(e.target.value)
-      min: 0,
+        }}
-    }),
+        min={0}
-    h('span.gas-tooltip-input-detail', {}, [unitLabel]),
+      />
-    h('div.gas-tooltip-input-arrows', {}, [
+      <span className="gas-tooltip-input-detail">{unitLabel}</span>
-      h('div.gas-tooltip-input-arrow-wrapper', {
+      <div className="gas-tooltip-input-arrows">
-        onClick: () => this.setValue(addCurrencies(value, step, { toNumericBase: 'dec' })),
+        <div className="gas-tooltip-input-arrow-wrapper"
-      }, [
+          onClick={() => this.setValue(addCurrencies(value, step, { toNumericBase: 'dec' }))}
-        h('i.fa.fa-angle-up'),
+        >
-      ]),
+          <i className="fa fa-angle-up" />
-      h('div.gas-tooltip-input-arrow-wrapper', {
+        </div>
-        onClick: () => this.setValue(subtractCurrencies(value, step, { toNumericBase: 'dec' })),
+        <div
-      }, [
+          className="gas-tooltip-input-arrow-wrapper"
-        h('i.fa.fa-angle-down'),
+          onClick={() => this.setValue(subtractCurrencies(value, step, { toNumericBase: 'dec' }))}
-      ]),
+        >
-    ]),
+          <i className="fa fa-angle-down" />
-  ])
+        </div>
+      </div>
+    </div>
+  )
 }