From ea7926c211965e2e529e5795a4e1655e97e32144 Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Mon, 9 Oct 2017 13:55:23 -0230
Subject: Adds amount and gas field to sendV2.

---
 ui/app/components/send/currency-display.js | 85 ++++++++++++++++++++++++++++++
 1 file changed, 85 insertions(+)
 create mode 100644 ui/app/components/send/currency-display.js

(limited to 'ui/app/components/send/currency-display.js')

diff --git a/ui/app/components/send/currency-display.js b/ui/app/components/send/currency-display.js
new file mode 100644
index 000000000..e0147012f
--- /dev/null
+++ b/ui/app/components/send/currency-display.js
@@ -0,0 +1,85 @@
+const Component = require('react').Component
+const h = require('react-hyperscript')
+const inherits = require('util').inherits
+const Identicon = require('../identicon')
+const AutosizeInput = require('react-input-autosize').default
+const { conversionUtil } = require('../../conversion-util')
+
+module.exports = CurrencyDisplay
+
+inherits(CurrencyDisplay, Component)
+function CurrencyDisplay () {
+  Component.call(this)
+
+  this.state = {
+    minWidth: null,
+  }
+}
+
+function isValidNumber (text) {
+  const re = /^([1-9]\d*|0)(\.|\.\d*)?$/
+  return re.test(text)
+}
+
+CurrencyDisplay.prototype.componentDidMount = function () {
+  this.setState({ minWidth: this.refs.currencyDisplayInput.sizer.scrollWidth + 10 })
+}
+
+CurrencyDisplay.prototype.render = function () {
+  const {
+    className,
+    primaryCurrency,
+    convertedCurrency,
+    value = '',
+    placeholder = '0',
+    conversionRate,
+    convertedPrefix = '',
+    readOnly = false,
+    handleChange,
+    inputFontSize,
+  } = this.props
+  const { minWidth } = this.state
+
+  const convertedValue = conversionUtil(value, {
+    fromNumericBase: 'dec',
+    fromCurrency: primaryCurrency,
+    toCurrency: convertedCurrency,
+    conversionRate,
+  })
+
+  return h('div.currency-display', {
+    className,
+  }, [
+
+    h('div.currency-display__primary-row', [
+
+      h(AutosizeInput, {
+        ref: 'currencyDisplayInput',
+        className: 'currency-display__input-wrapper',
+        inputClassName: 'currency-display__input',
+        value,
+        placeholder,
+        readOnly,
+        minWidth,
+        onChange: (event) => {
+          const newValue = event.target.value
+          if (newValue && !isValidNumber(newValue)) {
+            event.preventDefault()
+          }
+          else {
+            handleChange(newValue)
+          }
+        },
+        style: { fontSize: inputFontSize },
+      }),
+
+      h('span.currency-display__primary-currency', {}, primaryCurrency),
+
+    ]),
+
+    h('div.currency-display__converted-value', {}, `${convertedPrefix}${convertedValue} ${convertedCurrency}`),
+
+  ])
+    
+}
+
-- 
cgit 


From 2898914a544c4f934cdbe592b7b44df4d08127c8 Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Tue, 10 Oct 2017 22:15:31 -0230
Subject: Send v2 amount unit moves correctly.

---
 ui/app/components/send/currency-display.js | 20 +++++++++++++++++++-
 1 file changed, 19 insertions(+), 1 deletion(-)

(limited to 'ui/app/components/send/currency-display.js')

diff --git a/ui/app/components/send/currency-display.js b/ui/app/components/send/currency-display.js
index e0147012f..2ffddb178 100644
--- a/ui/app/components/send/currency-display.js
+++ b/ui/app/components/send/currency-display.js
@@ -13,6 +13,7 @@ function CurrencyDisplay () {
 
   this.state = {
     minWidth: null,
+    currentScrollWidth: null,
   }
 }
 
@@ -22,7 +23,24 @@ function isValidNumber (text) {
 }
 
 CurrencyDisplay.prototype.componentDidMount = function () {
-  this.setState({ minWidth: this.refs.currencyDisplayInput.sizer.scrollWidth + 10 })
+  this.setState({
+    minWidth: this.refs.currencyDisplayInput.sizer.clientWidth + 10,
+    currentclientWidth: this.refs.currencyDisplayInput.sizer.clientWidth,
+  })
+}
+
+CurrencyDisplay.prototype.componentWillUpdate = function ({ value: nextValue }) {
+  const { value: currentValue } = this.props
+  const { currentclientWidth } = this.state
+  const newclientWidth = this.refs.currencyDisplayInput.sizer.clientWidth
+
+  if (currentclientWidth !== newclientWidth) {
+    const clientWidthChange = newclientWidth - currentclientWidth
+    this.setState({
+      minWidth: this.state.minWidth + clientWidthChange,
+      currentclientWidth: newclientWidth,
+    })
+  }
 }
 
 CurrencyDisplay.prototype.render = function () {
-- 
cgit 


From 7ec77e0b4580c52bbf1723ed52d647c9d7516bd5 Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Wed, 11 Oct 2017 10:48:27 -0230
Subject: Refactor amount input: dynamic input width with vanilla js.

---
 ui/app/components/send/currency-display.js | 73 +++++++++++++-----------------
 1 file changed, 32 insertions(+), 41 deletions(-)

(limited to 'ui/app/components/send/currency-display.js')

diff --git a/ui/app/components/send/currency-display.js b/ui/app/components/send/currency-display.js
index 2ffddb178..332d722ec 100644
--- a/ui/app/components/send/currency-display.js
+++ b/ui/app/components/send/currency-display.js
@@ -2,7 +2,6 @@ const Component = require('react').Component
 const h = require('react-hyperscript')
 const inherits = require('util').inherits
 const Identicon = require('../identicon')
-const AutosizeInput = require('react-input-autosize').default
 const { conversionUtil } = require('../../conversion-util')
 
 module.exports = CurrencyDisplay
@@ -17,29 +16,16 @@ function CurrencyDisplay () {
   }
 }
 
-function isValidNumber (text) {
+function isValidInput (text) {
   const re = /^([1-9]\d*|0)(\.|\.\d*)?$/
   return re.test(text)
 }
 
-CurrencyDisplay.prototype.componentDidMount = function () {
-  this.setState({
-    minWidth: this.refs.currencyDisplayInput.sizer.clientWidth + 10,
-    currentclientWidth: this.refs.currencyDisplayInput.sizer.clientWidth,
-  })
-}
+function resetCaretIfPastEnd (value, event) {
+  const caretPosition = event.target.selectionStart
 
-CurrencyDisplay.prototype.componentWillUpdate = function ({ value: nextValue }) {
-  const { value: currentValue } = this.props
-  const { currentclientWidth } = this.state
-  const newclientWidth = this.refs.currencyDisplayInput.sizer.clientWidth
-
-  if (currentclientWidth !== newclientWidth) {
-    const clientWidthChange = newclientWidth - currentclientWidth
-    this.setState({
-      minWidth: this.state.minWidth + clientWidthChange,
-      currentclientWidth: newclientWidth,
-    })
+  if (caretPosition > value.length) {
+    event.target.setSelectionRange(value.length, value.length)
   }
 }
 
@@ -54,7 +40,6 @@ CurrencyDisplay.prototype.render = function () {
     convertedPrefix = '',
     readOnly = false,
     handleChange,
-    inputFontSize,
   } = this.props
   const { minWidth } = this.state
 
@@ -71,27 +56,33 @@ CurrencyDisplay.prototype.render = function () {
 
     h('div.currency-display__primary-row', [
 
-      h(AutosizeInput, {
-        ref: 'currencyDisplayInput',
-        className: 'currency-display__input-wrapper',
-        inputClassName: 'currency-display__input',
-        value,
-        placeholder,
-        readOnly,
-        minWidth,
-        onChange: (event) => {
-          const newValue = event.target.value
-          if (newValue && !isValidNumber(newValue)) {
-            event.preventDefault()
-          }
-          else {
-            handleChange(newValue)
-          }
-        },
-        style: { fontSize: inputFontSize },
-      }),
-
-      h('span.currency-display__primary-currency', {}, primaryCurrency),
+      h('div.currency-display__input-wrapper', [
+
+        h('input.currency-display__input', {
+          value: `${value} ${primaryCurrency}`,
+          placeholder: `${0} ${primaryCurrency}`,
+          readOnly,
+          onChange: (event) => {
+            let newValue = event.target.value.split(' ')[0]
+
+            if (newValue === '') {
+              handleChange('0')
+            }
+            else if (newValue.match(/^0[1-9]$/)) {
+              handleChange(newValue.match(/[1-9]/)[0])
+            }
+            else if (newValue && !isValidInput(newValue)) {
+              event.preventDefault()
+            }
+            else {
+              handleChange(newValue)
+            }
+          },
+          onKeyUp: event => resetCaretIfPastEnd(value, event),
+          onClick: event => resetCaretIfPastEnd(value, event),
+        }),
+
+      ]),
 
     ]),
 
-- 
cgit 


From 803eaaf968161f16aaf72d59b979dfbb7fb9b352 Mon Sep 17 00:00:00 2001
From: Dan J Miller <danjm.com@gmail.com>
Date: Fri, 13 Oct 2017 16:19:22 -0400
Subject: [NewUI] SendV2-#8: Send container handles tokens; gas info dynamic
 from state (#2364)

* Adds memo field to send-v2.

* Vertical align transaction with flexbox.

* Customize Gas UI

* Remove internal state from InputNumber and fix use in gastooltip.

* Move customize-gas-modal to its own folder and minor cleanup

* Create send container, get account info from state, and make currency display more reusable

* Adjusts send-v2 and container for send-token. Dynamically getting suggested gas prices.
---
 ui/app/components/send/currency-display.js | 61 +++++++++++++++++++++---------
 1 file changed, 43 insertions(+), 18 deletions(-)

(limited to 'ui/app/components/send/currency-display.js')

diff --git a/ui/app/components/send/currency-display.js b/ui/app/components/send/currency-display.js
index 332d722ec..ed9847fdb 100644
--- a/ui/app/components/send/currency-display.js
+++ b/ui/app/components/send/currency-display.js
@@ -11,8 +11,7 @@ function CurrencyDisplay () {
   Component.call(this)
 
   this.state = {
-    minWidth: null,
-    currentScrollWidth: null,
+    value: null,
   }
 }
 
@@ -29,28 +28,50 @@ function resetCaretIfPastEnd (value, event) {
   }
 }
 
+CurrencyDisplay.prototype.handleChangeInHexWei = function (value) {
+  const { handleChange } = this.props
+
+  const valueInHexWei = conversionUtil(value, {
+    fromNumericBase: 'dec',
+    toNumericBase: 'hex',
+    toDenomination: 'WEI',
+  })
+
+  handleChange(valueInHexWei)
+}
+
 CurrencyDisplay.prototype.render = function () {
   const {
-    className,
+    className = 'currency-display',
+    primaryBalanceClassName = 'currency-display__input',
+    convertedBalanceClassName = 'currency-display__converted-value',
+    conversionRate,
     primaryCurrency,
     convertedCurrency,
-    value = '',
-    placeholder = '0',
-    conversionRate,
     convertedPrefix = '',
+    placeholder = '0',
     readOnly = false,
-    handleChange,
+    value: initValue,
   } = this.props
-  const { minWidth } = this.state
+  const { value } = this.state
+
+  const initValueToRender = conversionUtil(initValue, {
+    fromNumericBase: 'hex',
+    toNumericBase: 'dec',
+    fromDenomination: 'WEI',
+    numberOfDecimals: 6,
+    conversionRate,
+  })
 
-  const convertedValue = conversionUtil(value, {
+  const convertedValue = conversionUtil(value || initValueToRender, {
     fromNumericBase: 'dec',
     fromCurrency: primaryCurrency,
     toCurrency: convertedCurrency,
+    numberOfDecimals: 2,
     conversionRate,
   })
 
-  return h('div.currency-display', {
+  return h('div', {
     className,
   }, [
 
@@ -58,35 +79,39 @@ CurrencyDisplay.prototype.render = function () {
 
       h('div.currency-display__input-wrapper', [
 
-        h('input.currency-display__input', {
-          value: `${value} ${primaryCurrency}`,
+        h('input', {
+          className: primaryBalanceClassName,
+          value: `${value || initValueToRender} ${primaryCurrency}`,
           placeholder: `${0} ${primaryCurrency}`,
           readOnly,
           onChange: (event) => {
             let newValue = event.target.value.split(' ')[0]
 
             if (newValue === '') {
-              handleChange('0')
+              this.setState({ value: '0' })
             }
             else if (newValue.match(/^0[1-9]$/)) {
-              handleChange(newValue.match(/[1-9]/)[0])
+              this.setState({ value: newValue.match(/[1-9]/)[0] })
             }
             else if (newValue && !isValidInput(newValue)) {
               event.preventDefault()
             }
             else {
-              handleChange(newValue)
+              this.setState({ value: newValue })
             }
           },
-          onKeyUp: event => resetCaretIfPastEnd(value, event),
-          onClick: event => resetCaretIfPastEnd(value, event),
+          onBlur: event => this.handleChangeInHexWei(event.target.value.split(' ')[0]),
+          onKeyUp: event => resetCaretIfPastEnd(value || initValueToRender, event),
+          onClick: event => resetCaretIfPastEnd(value || initValueToRender, event),
         }),
 
       ]),
 
     ]),
 
-    h('div.currency-display__converted-value', {}, `${convertedPrefix}${convertedValue} ${convertedCurrency}`),
+    h('div', {
+      className: convertedBalanceClassName,
+    }, `${convertedPrefix}${convertedValue} ${convertedCurrency}`),
 
   ])
     
-- 
cgit 


From ac43872c1a1468057974648c8ae90bf1edd708d7 Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Thu, 12 Oct 2017 14:59:03 -0230
Subject: Enable send-v2 functionality.

---
 ui/app/components/send/currency-display.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

(limited to 'ui/app/components/send/currency-display.js')

diff --git a/ui/app/components/send/currency-display.js b/ui/app/components/send/currency-display.js
index ed9847fdb..d56c119f1 100644
--- a/ui/app/components/send/currency-display.js
+++ b/ui/app/components/send/currency-display.js
@@ -100,9 +100,9 @@ CurrencyDisplay.prototype.render = function () {
               this.setState({ value: newValue })
             }
           },
-          onBlur: event => this.handleChangeInHexWei(event.target.value.split(' ')[0]),
-          onKeyUp: event => resetCaretIfPastEnd(value || initValueToRender, event),
-          onClick: event => resetCaretIfPastEnd(value || initValueToRender, event),
+          onBlur: event => !readOnly && this.handleChangeInHexWei(event.target.value.split(' ')[0]),
+          onKeyUp: event => !readOnly && resetCaretIfPastEnd(value || initValueToRender, event),
+          onClick: event => !readOnly && resetCaretIfPastEnd(value || initValueToRender, event),
         }),
 
       ]),
-- 
cgit 


From 60eda592b5979ac1fdbfb6d5b3418a4924abc14d Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Tue, 17 Oct 2017 17:43:20 -0230
Subject: Handling to and amount errors.

---
 ui/app/components/send/currency-display.js | 23 +++++++++++++++--------
 1 file changed, 15 insertions(+), 8 deletions(-)

(limited to 'ui/app/components/send/currency-display.js')

diff --git a/ui/app/components/send/currency-display.js b/ui/app/components/send/currency-display.js
index d56c119f1..f7fbb2379 100644
--- a/ui/app/components/send/currency-display.js
+++ b/ui/app/components/send/currency-display.js
@@ -28,16 +28,12 @@ function resetCaretIfPastEnd (value, event) {
   }
 }
 
-CurrencyDisplay.prototype.handleChangeInHexWei = function (value) {
-  const { handleChange } = this.props
-
-  const valueInHexWei = conversionUtil(value, {
+function toHexWei (value) {
+  return conversionUtil(value, {
     fromNumericBase: 'dec',
     toNumericBase: 'hex',
     toDenomination: 'WEI',
   })
-
-  handleChange(valueInHexWei)
 }
 
 CurrencyDisplay.prototype.render = function () {
@@ -51,7 +47,10 @@ CurrencyDisplay.prototype.render = function () {
     convertedPrefix = '',
     placeholder = '0',
     readOnly = false,
+    inError = false,
     value: initValue,
+    handleChange,
+    validate,
   } = this.props
   const { value } = this.state
 
@@ -73,6 +72,9 @@ CurrencyDisplay.prototype.render = function () {
 
   return h('div', {
     className,
+    style: {
+      borderColor: inError ? 'red' : null,
+    },
   }, [
 
     h('div.currency-display__primary-row', [
@@ -100,8 +102,13 @@ CurrencyDisplay.prototype.render = function () {
               this.setState({ value: newValue })
             }
           },
-          onBlur: event => !readOnly && this.handleChangeInHexWei(event.target.value.split(' ')[0]),
-          onKeyUp: event => !readOnly && resetCaretIfPastEnd(value || initValueToRender, event),
+          onBlur: event => !readOnly && handleChange(toHexWei(event.target.value.split(' ')[0])),
+          onKeyUp: event => {
+            if (!readOnly) {
+              validate(toHexWei(value || initValueToRender))
+              resetCaretIfPastEnd(value || initValueToRender, event)
+            }
+          },
           onClick: event => !readOnly && resetCaretIfPastEnd(value || initValueToRender, event),
         }),
 
-- 
cgit 


From 332c7441b656ec82ebfba863e3feb4dbf365d67b Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Wed, 18 Oct 2017 23:39:26 -0230
Subject: Get currency from state in account details, send and confirm screens.

---
 ui/app/components/send/currency-display.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'ui/app/components/send/currency-display.js')

diff --git a/ui/app/components/send/currency-display.js b/ui/app/components/send/currency-display.js
index f7fbb2379..2c9a2d33b 100644
--- a/ui/app/components/send/currency-display.js
+++ b/ui/app/components/send/currency-display.js
@@ -118,7 +118,7 @@ CurrencyDisplay.prototype.render = function () {
 
     h('div', {
       className: convertedBalanceClassName,
-    }, `${convertedPrefix}${convertedValue} ${convertedCurrency}`),
+    }, `${convertedValue} ${convertedCurrency.toUpperCase()}`),
 
   ])
     
-- 
cgit 


From 8f3b762461ada222f82089e686a61183dd167428 Mon Sep 17 00:00:00 2001
From: Chi Kei Chan <chikeichan@gmail.com>
Date: Fri, 20 Oct 2017 18:26:18 -0700
Subject: Fix Conversions bugs; Fiat value bugs

---
 ui/app/components/send/currency-display.js | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

(limited to 'ui/app/components/send/currency-display.js')

diff --git a/ui/app/components/send/currency-display.js b/ui/app/components/send/currency-display.js
index 2c9a2d33b..7180b94d3 100644
--- a/ui/app/components/send/currency-display.js
+++ b/ui/app/components/send/currency-display.js
@@ -36,6 +36,16 @@ function toHexWei (value) {
   })
 }
 
+CurrencyDisplay.prototype.getAmount = function (value) {
+  const { selectedToken } = this.props
+  const { decimals } = selectedToken || {}
+  const multiplier = Math.pow(10, Number(decimals || 0))
+  const sendAmount = '0x' + Number(value * multiplier).toString(16)
+  return selectedToken
+    ? sendAmount
+    : toHexWei(value)
+}
+
 CurrencyDisplay.prototype.render = function () {
   const {
     className = 'currency-display',
@@ -102,7 +112,7 @@ CurrencyDisplay.prototype.render = function () {
               this.setState({ value: newValue })
             }
           },
-          onBlur: event => !readOnly && handleChange(toHexWei(event.target.value.split(' ')[0])),
+          onBlur: event => !readOnly && handleChange(this.getAmount(event.target.value.split(' ')[0])),
           onKeyUp: event => {
             if (!readOnly) {
               validate(toHexWei(value || initValueToRender))
-- 
cgit 


From b3dad510b7119c6bd89afb0059d95a6684402538 Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Fri, 20 Oct 2017 23:27:59 -0230
Subject: Improve precision in send and confirm.

---
 ui/app/components/send/currency-display.js | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

(limited to 'ui/app/components/send/currency-display.js')

diff --git a/ui/app/components/send/currency-display.js b/ui/app/components/send/currency-display.js
index 7180b94d3..799e9b56d 100644
--- a/ui/app/components/send/currency-display.js
+++ b/ui/app/components/send/currency-display.js
@@ -2,7 +2,7 @@ const Component = require('react').Component
 const h = require('react-hyperscript')
 const inherits = require('util').inherits
 const Identicon = require('../identicon')
-const { conversionUtil } = require('../../conversion-util')
+const { conversionUtil, multiplyCurrencies } = require('../../conversion-util')
 
 module.exports = CurrencyDisplay
 
@@ -40,7 +40,9 @@ CurrencyDisplay.prototype.getAmount = function (value) {
   const { selectedToken } = this.props
   const { decimals } = selectedToken || {}
   const multiplier = Math.pow(10, Number(decimals || 0))
-  const sendAmount = '0x' + Number(value * multiplier).toString(16)
+
+  const sendAmount = multiplyCurrencies(value, multiplier, {toNumericBase: 'hex'})
+
   return selectedToken
     ? sendAmount
     : toHexWei(value)
-- 
cgit 


From 09d659614ed8a3d7627002eb77f0953b7f495f7e Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Mon, 23 Oct 2017 09:35:53 -0230
Subject: Cleaner implementation of currency-display input.

---
 ui/app/components/send/currency-display.js | 36 ++++++++++++------------------
 1 file changed, 14 insertions(+), 22 deletions(-)

(limited to 'ui/app/components/send/currency-display.js')

diff --git a/ui/app/components/send/currency-display.js b/ui/app/components/send/currency-display.js
index 799e9b56d..5dba6a8dd 100644
--- a/ui/app/components/send/currency-display.js
+++ b/ui/app/components/send/currency-display.js
@@ -20,14 +20,6 @@ function isValidInput (text) {
   return re.test(text)
 }
 
-function resetCaretIfPastEnd (value, event) {
-  const caretPosition = event.target.selectionStart
-
-  if (caretPosition > value.length) {
-    event.target.setSelectionRange(value.length, value.length)
-  }
-}
-
 function toHexWei (value) {
   return conversionUtil(value, {
     fromNumericBase: 'dec',
@@ -82,6 +74,8 @@ CurrencyDisplay.prototype.render = function () {
     conversionRate,
   })
 
+  const inputSizeMultiplier = readOnly ? 1 : 1.2;
+
   return h('div', {
     className,
     style: {
@@ -95,35 +89,33 @@ CurrencyDisplay.prototype.render = function () {
 
         h('input', {
           className: primaryBalanceClassName,
-          value: `${value || initValueToRender} ${primaryCurrency}`,
-          placeholder: `${0} ${primaryCurrency}`,
+          value: `${value || initValueToRender}`,
+          placeholder: '0',
+          size: (value || initValueToRender).length * inputSizeMultiplier,
           readOnly,
           onChange: (event) => {
-            let newValue = event.target.value.split(' ')[0]
+            let newValue = event.target.value
 
             if (newValue === '') {
-              this.setState({ value: '0' })
+              newValue = '0'
             }
             else if (newValue.match(/^0[1-9]$/)) {
-              this.setState({ value: newValue.match(/[1-9]/)[0] })
+              newValue = newValue.match(/[1-9]/)[0]
             }
-            else if (newValue && !isValidInput(newValue)) {
+
+            if (newValue && !isValidInput(newValue)) {
               event.preventDefault()
             }
             else {
+              validate(this.getAmount(newValue))
               this.setState({ value: newValue })
             }
           },
-          onBlur: event => !readOnly && handleChange(this.getAmount(event.target.value.split(' ')[0])),
-          onKeyUp: event => {
-            if (!readOnly) {
-              validate(toHexWei(value || initValueToRender))
-              resetCaretIfPastEnd(value || initValueToRender, event)
-            }
-          },
-          onClick: event => !readOnly && resetCaretIfPastEnd(value || initValueToRender, event),
+          onBlur: event => !readOnly && handleChange(this.getAmount(event.target.value)),
         }),
 
+        h('span.currency-display__currency-symbol', primaryCurrency),
+
       ]),
 
     ]),
-- 
cgit 


From 5a94775b3fa22517a71232ebe229ee83e9debcf1 Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Thu, 2 Nov 2017 00:00:33 -0230
Subject: Lint fixes for NewUI-flat.

---
 ui/app/components/send/currency-display.js | 3 ---
 1 file changed, 3 deletions(-)

(limited to 'ui/app/components/send/currency-display.js')

diff --git a/ui/app/components/send/currency-display.js b/ui/app/components/send/currency-display.js
index 5dba6a8dd..34939c767 100644
--- a/ui/app/components/send/currency-display.js
+++ b/ui/app/components/send/currency-display.js
@@ -1,7 +1,6 @@
 const Component = require('react').Component
 const h = require('react-hyperscript')
 const inherits = require('util').inherits
-const Identicon = require('../identicon')
 const { conversionUtil, multiplyCurrencies } = require('../../conversion-util')
 
 module.exports = CurrencyDisplay
@@ -48,8 +47,6 @@ CurrencyDisplay.prototype.render = function () {
     conversionRate,
     primaryCurrency,
     convertedCurrency,
-    convertedPrefix = '',
-    placeholder = '0',
     readOnly = false,
     inError = false,
     value: initValue,
-- 
cgit 


From 56e9f98bd05de8ae26f653d15eec4304f0c72155 Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Thu, 2 Nov 2017 09:45:59 -0230
Subject: More lint fixes

---
 ui/app/components/send/currency-display.js | 10 ++++------
 1 file changed, 4 insertions(+), 6 deletions(-)

(limited to 'ui/app/components/send/currency-display.js')

diff --git a/ui/app/components/send/currency-display.js b/ui/app/components/send/currency-display.js
index 34939c767..45986e371 100644
--- a/ui/app/components/send/currency-display.js
+++ b/ui/app/components/send/currency-display.js
@@ -71,7 +71,7 @@ CurrencyDisplay.prototype.render = function () {
     conversionRate,
   })
 
-  const inputSizeMultiplier = readOnly ? 1 : 1.2;
+  const inputSizeMultiplier = readOnly ? 1 : 1.2
 
   return h('div', {
     className,
@@ -95,15 +95,13 @@ CurrencyDisplay.prototype.render = function () {
 
             if (newValue === '') {
               newValue = '0'
-            }
-            else if (newValue.match(/^0[1-9]$/)) {
+            } else if (newValue.match(/^0[1-9]$/)) {
               newValue = newValue.match(/[1-9]/)[0]
             }
 
             if (newValue && !isValidInput(newValue)) {
               event.preventDefault()
-            }
-            else {
+            } else {
               validate(this.getAmount(newValue))
               this.setState({ value: newValue })
             }
@@ -122,6 +120,6 @@ CurrencyDisplay.prototype.render = function () {
     }, `${convertedValue} ${convertedCurrency.toUpperCase()}`),
 
   ])
-    
+
 }
 
-- 
cgit 


From c57d504794b6020d42dcdabe08a13ed412450fc1 Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Tue, 7 Nov 2017 20:06:26 -0330
Subject: Add currency-input component to correct send amount behaviour and
 move currency display value state to parent component.

---
 ui/app/components/send/currency-display.js | 36 +++++++-----------------------
 1 file changed, 8 insertions(+), 28 deletions(-)

(limited to 'ui/app/components/send/currency-display.js')

diff --git a/ui/app/components/send/currency-display.js b/ui/app/components/send/currency-display.js
index 45986e371..8b72b3e6d 100644
--- a/ui/app/components/send/currency-display.js
+++ b/ui/app/components/send/currency-display.js
@@ -1,6 +1,7 @@
 const Component = require('react').Component
 const h = require('react-hyperscript')
 const inherits = require('util').inherits
+const CurrencyInput = require('../currency-input')
 const { conversionUtil, multiplyCurrencies } = require('../../conversion-util')
 
 module.exports = CurrencyDisplay
@@ -8,10 +9,6 @@ module.exports = CurrencyDisplay
 inherits(CurrencyDisplay, Component)
 function CurrencyDisplay () {
   Component.call(this)
-
-  this.state = {
-    value: null,
-  }
 }
 
 function isValidInput (text) {
@@ -49,13 +46,11 @@ CurrencyDisplay.prototype.render = function () {
     convertedCurrency,
     readOnly = false,
     inError = false,
-    value: initValue,
+    value,
     handleChange,
-    validate,
   } = this.props
-  const { value } = this.state
 
-  const initValueToRender = conversionUtil(initValue, {
+  const valueToRender = conversionUtil(value, {
     fromNumericBase: 'hex',
     toNumericBase: 'dec',
     fromDenomination: 'WEI',
@@ -63,7 +58,7 @@ CurrencyDisplay.prototype.render = function () {
     conversionRate,
   })
 
-  const convertedValue = conversionUtil(value || initValueToRender, {
+  const convertedValue = conversionUtil(valueToRender, {
     fromNumericBase: 'dec',
     fromCurrency: primaryCurrency,
     toCurrency: convertedCurrency,
@@ -84,29 +79,14 @@ CurrencyDisplay.prototype.render = function () {
 
       h('div.currency-display__input-wrapper', [
 
-        h('input', {
+        h(CurrencyInput, {
           className: primaryBalanceClassName,
-          value: `${value || initValueToRender}`,
+          value: `${valueToRender}`,
           placeholder: '0',
-          size: (value || initValueToRender).length * inputSizeMultiplier,
           readOnly,
-          onChange: (event) => {
-            let newValue = event.target.value
-
-            if (newValue === '') {
-              newValue = '0'
-            } else if (newValue.match(/^0[1-9]$/)) {
-              newValue = newValue.match(/[1-9]/)[0]
-            }
-
-            if (newValue && !isValidInput(newValue)) {
-              event.preventDefault()
-            } else {
-              validate(this.getAmount(newValue))
-              this.setState({ value: newValue })
-            }
+          onInputChange: newValue => {
+            handleChange(this.getAmount(newValue))
           },
-          onBlur: event => !readOnly && handleChange(this.getAmount(event.target.value)),
         }),
 
         h('span.currency-display__currency-symbol', primaryCurrency),
-- 
cgit 


From c156c85eaa064b971ce0202df0bb1681eb0e22dd Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Tue, 7 Nov 2017 21:47:14 -0330
Subject: Fix amount max for sending token.

---
 ui/app/components/send/currency-display.js | 30 +++++++++++++++++++++++-------
 1 file changed, 23 insertions(+), 7 deletions(-)

(limited to 'ui/app/components/send/currency-display.js')

diff --git a/ui/app/components/send/currency-display.js b/ui/app/components/send/currency-display.js
index 8b72b3e6d..49df5b0b7 100644
--- a/ui/app/components/send/currency-display.js
+++ b/ui/app/components/send/currency-display.js
@@ -36,6 +36,28 @@ CurrencyDisplay.prototype.getAmount = function (value) {
     : toHexWei(value)
 }
 
+CurrencyDisplay.prototype.getValueToRender = function () {
+  const { selectedToken, conversionRate, value } = this.props
+
+  const { decimals, symbol } = selectedToken || {}
+  const multiplier = Math.pow(10, Number(decimals || 0))
+
+  return selectedToken
+    ? conversionUtil(value, {
+      fromNumericBase: 'hex',
+      toCurrency: symbol,
+      conversionRate: multiplier,
+      invertConversionRate: true,
+    })
+    : conversionUtil(value, {
+      fromNumericBase: 'hex',
+      toNumericBase: 'dec',
+      fromDenomination: 'WEI',
+      numberOfDecimals: 6,
+      conversionRate,
+    })
+}
+
 CurrencyDisplay.prototype.render = function () {
   const {
     className = 'currency-display',
@@ -50,13 +72,7 @@ CurrencyDisplay.prototype.render = function () {
     handleChange,
   } = this.props
 
-  const valueToRender = conversionUtil(value, {
-    fromNumericBase: 'hex',
-    toNumericBase: 'dec',
-    fromDenomination: 'WEI',
-    numberOfDecimals: 6,
-    conversionRate,
-  })
+  const valueToRender = this.getValueToRender()
 
   const convertedValue = conversionUtil(valueToRender, {
     fromNumericBase: 'dec',
-- 
cgit 


From d1977225a48f381f3a6bda4a54ce9e0e0914357e Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Tue, 7 Nov 2017 21:49:14 -0330
Subject: Calculate max amount for send ether based on minimum gas total.

---
 ui/app/components/send/currency-display.js | 8 --------
 1 file changed, 8 deletions(-)

(limited to 'ui/app/components/send/currency-display.js')

diff --git a/ui/app/components/send/currency-display.js b/ui/app/components/send/currency-display.js
index 49df5b0b7..870fbb42a 100644
--- a/ui/app/components/send/currency-display.js
+++ b/ui/app/components/send/currency-display.js
@@ -11,11 +11,6 @@ function CurrencyDisplay () {
   Component.call(this)
 }
 
-function isValidInput (text) {
-  const re = /^([1-9]\d*|0)(\.|\.\d*)?$/
-  return re.test(text)
-}
-
 function toHexWei (value) {
   return conversionUtil(value, {
     fromNumericBase: 'dec',
@@ -68,7 +63,6 @@ CurrencyDisplay.prototype.render = function () {
     convertedCurrency,
     readOnly = false,
     inError = false,
-    value,
     handleChange,
   } = this.props
 
@@ -82,8 +76,6 @@ CurrencyDisplay.prototype.render = function () {
     conversionRate,
   })
 
-  const inputSizeMultiplier = readOnly ? 1 : 1.2
-
   return h('div', {
     className,
     style: {
-- 
cgit 


From 5a0126f17b3513fa7fa1513f2c52abff19535ac0 Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Fri, 10 Nov 2017 07:07:53 -0330
Subject: Rounding of vals < 0.01 in currency display consistent with master.

---
 ui/app/components/send/currency-display.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

(limited to 'ui/app/components/send/currency-display.js')

diff --git a/ui/app/components/send/currency-display.js b/ui/app/components/send/currency-display.js
index 870fbb42a..5057c413c 100644
--- a/ui/app/components/send/currency-display.js
+++ b/ui/app/components/send/currency-display.js
@@ -68,13 +68,14 @@ CurrencyDisplay.prototype.render = function () {
 
   const valueToRender = this.getValueToRender()
 
-  const convertedValue = conversionUtil(valueToRender, {
+  let convertedValue = conversionUtil(valueToRender, {
     fromNumericBase: 'dec',
     fromCurrency: primaryCurrency,
     toCurrency: convertedCurrency,
     numberOfDecimals: 2,
     conversionRate,
   })
+  convertedValue = Number(convertedValue).toFixed(2)
 
   return h('div', {
     className,
-- 
cgit 


From a33ced39946c1448b56aef22ab3573b00d1faeca Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Fri, 10 Nov 2017 15:17:02 -0330
Subject: Focus amount input when click anywhere in amount field container

---
 ui/app/components/send/currency-display.js | 2 ++
 1 file changed, 2 insertions(+)

(limited to 'ui/app/components/send/currency-display.js')

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),
-- 
cgit 


From 9e3f921ba928a948c04b4156daa0a3f752ee2dde Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Fri, 10 Nov 2017 00:19:16 -0330
Subject: Create single action for updating all of send in redux state.

---
 ui/app/components/send/currency-display.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'ui/app/components/send/currency-display.js')

diff --git a/ui/app/components/send/currency-display.js b/ui/app/components/send/currency-display.js
index 5bf8d6aa0..819fee0a0 100644
--- a/ui/app/components/send/currency-display.js
+++ b/ui/app/components/send/currency-display.js
@@ -97,7 +97,7 @@ CurrencyDisplay.prototype.render = function () {
           onInputChange: newValue => {
             handleChange(this.getAmount(newValue))
           },
-          inputRef: input => { this.currencyInput = input; },
+          inputRef: input => { this.currencyInput = input },
         }),
 
         h('span.currency-display__currency-symbol', primaryCurrency),
-- 
cgit