Focus amount input when click anywhere in amount field container

2 files changed, 4 insertions, 0 deletions

diff --git a/ui/app/components/currency-input.js b/ui/app/components/currency-input.js
index f192ee531..016f14d3e 100644
--- a/ui/app/components/currency-input.js
+++ b/ui/app/components/currency-input.js
@@ -76,6 +76,7 @@ CurrencyInput.prototype.render = function () {
     className,
     placeholder,
     readOnly,
+    inputRef,
   } = this.props
 
   const inputSizeMultiplier = readOnly ? 1 : 1.2
@@ -89,5 +90,6 @@ CurrencyInput.prototype.render = function () {
     size: valueToRender.length * inputSizeMultiplier,
     readOnly,
     onChange: e => this.handleChange(e.target.value),
+    ref: inputRef, 
   })
 }
diff --git a/ui/app/components/send/currency-display.js b/ui/app/components/send/currency-display.js
index 5057c413c..5bf8d6aa0 100644
--- a/ui/app/components/send/currency-display.js
+++ b/ui/app/components/send/currency-display.js
@@ -82,6 +82,7 @@ CurrencyDisplay.prototype.render = function () {
     style: {
       borderColor: inError ? 'red' : null,
     },
+    onClick: () => this.currencyInput.focus(),
   }, [
 
     h('div.currency-display__primary-row', [
@@ -96,6 +97,7 @@ CurrencyDisplay.prototype.render = function () {
           onInputChange: newValue => {
             handleChange(this.getAmount(newValue))
           },
+          inputRef: input => { this.currencyInput = input; },
         }),
 
         h('span.currency-display__currency-symbol', primaryCurrency),