Adds max amount feature for send-ether

5 files changed, 65 insertions, 2 deletions

diff --git a/ui/app/components/send/send-utils.js b/ui/app/components/send/send-utils.js
index 4eb010173..0260c38a6 100644
--- a/ui/app/components/send/send-utils.js
+++ b/ui/app/components/send/send-utils.js
@@ -22,7 +22,7 @@ function isBalanceSufficient({
     toNumericBase: 'hex',
   })
 
-  const balanceIsSufficient = conversionGreaterThan(
+  const balanceIsSufficient = conversionGTE(
     {
       value: balance,
       fromNumericBase: 'hex',
diff --git a/ui/app/components/send/send-v2-container.js b/ui/app/components/send/send-v2-container.js
index ee18d0b4b..51d5c4f89 100644
--- a/ui/app/components/send/send-v2-container.js
+++ b/ui/app/components/send/send-v2-container.js
@@ -66,6 +66,8 @@ function mapDispatchToProps (dispatch) {
     setSelectedAddress: address => dispatch(actions.setSelectedAddress(address)),
     addToAddressBook: address => dispatch(actions.addToAddressBook(address)),
     updateGasTotal: newTotal => dispatch(actions.updateGasTotal(newTotal)),
+    updateGasPrice: newGasPrice => dispatch(actions.updateGasPrice(newGasPrice)),
+    updateGasLimit: newGasLimit => dispatch(actions.updateGasLimit(newGasLimit)),
     updateSendTokenBalance: tokenBalance => dispatch(actions.updateSendTokenBalance(tokenBalance)),
     updateSendFrom: newFrom => dispatch(actions.updateSendFrom(newFrom)),
     updateSendTo: newTo => dispatch(actions.updateSendTo(newTo)),
diff --git a/ui/app/conversion-util.js b/ui/app/conversion-util.js
index 5eadbdb99..3786641fb 100644
--- a/ui/app/conversion-util.js
+++ b/ui/app/conversion-util.js
@@ -145,6 +145,20 @@ const addCurrencies = (a, b, options = {}) => {
   })
 }
 
+const subtractCurrencies = (a, b, options = {}) => {
+  const {
+    aBase,
+    bBase,
+    ...conversionOptions,
+  } = options
+  const value = (new BigNumber(a, aBase)).minus(b, bBase);
+
+  return converter({
+    value,
+    ...conversionOptions,
+  })
+}
+
 const multiplyCurrencies = (a, b, options = {}) => {
   const {
     multiplicandBase,
@@ -203,4 +217,5 @@ module.exports = {
   conversionGTE,
   conversionLTE,
   toNegative,
+  subtractCurrencies,
 }
diff --git a/ui/app/css/itcss/components/send.scss b/ui/app/css/itcss/components/send.scss
index 4d7e6d71a..2bd192788 100644
--- a/ui/app/css/itcss/components/send.scss
+++ b/ui/app/css/itcss/components/send.scss
@@ -629,6 +629,15 @@
     }
   }
 
+  &__amount-max {
+    color: $curious-blue;
+    font-family: Roboto;
+    font-size: 12px;
+    left: 8px;
+    border: none;
+    cursor: pointer;
+  }
+
   &__gas-fee-display {
     width: 100%;
   }
diff --git a/ui/app/send-v2.js b/ui/app/send-v2.js
index 8ad2b912c..412aa417c 100644
--- a/ui/app/send-v2.js
+++ b/ui/app/send-v2.js
@@ -2,6 +2,8 @@ const { inherits } = require('util')
 const PersistentForm = require('../lib/persistent-form')
 const h = require('react-hyperscript')
 
+const ethUtil = require('ethereumjs-util')
+
 const Identicon = require('./components/identicon')
 const FromDropdown = require('./components/send/from-dropdown')
 const ToAutoComplete = require('./components/send/to-autocomplete')
@@ -9,12 +11,17 @@ const CurrencyDisplay = require('./components/send/currency-display')
 const MemoTextArea = require('./components/send/memo-textarea')
 const GasFeeDisplay = require('./components/send/gas-fee-display-v2')
 
-const { MIN_GAS_TOTAL } = require('./components/send/send-constants')
+const {
+  MIN_GAS_TOTAL,
+  MIN_GAS_PRICE_HEX,
+  MIN_GAS_LIMIT_HEX,
+} = require('./components/send/send-constants')
 const abi = require('human-standard-token-abi')
 
 const {
   multiplyCurrencies,
   conversionGreaterThan,
+  subtractCurrencies,
 } = require('./conversion-util')
 const {
   calcTokenAmount,
@@ -305,6 +312,30 @@ SendTransactionScreen.prototype.handleAmountChange = function (value) {
   updateSendAmount(amount)
 }
 
+SendTransactionScreen.prototype.setAmountToMax = function () {
+  const {
+    from: { balance },
+    gasTotal,
+    updateSendAmount,
+    updateSendErrors,
+    updateGasPrice,
+    updateGasLimit,
+    updateGasTotal,
+  } = this.props
+
+  const maxAmount = subtractCurrencies(
+    ethUtil.addHexPrefix(balance),
+    ethUtil.addHexPrefix(MIN_GAS_TOTAL),
+    { toNumericBase: 'hex' }
+  )
+
+  updateSendErrors({ amount: null })
+  updateGasPrice(MIN_GAS_PRICE_HEX)
+  updateGasLimit(MIN_GAS_LIMIT_HEX)
+  updateGasTotal(MIN_GAS_TOTAL)
+  updateSendAmount(maxAmount)
+}
+
 SendTransactionScreen.prototype.validateAmount = function (value) {
   const {
     from: { balance },
@@ -370,6 +401,12 @@ SendTransactionScreen.prototype.renderAmountRow = function () {
     h('div.send-v2__form-label', [
       'Amount:',
       this.renderErrorMessage('amount'),
+      !errors.amount && h('div.send-v2__amount-max', {
+        onClick: (event) => {
+          event.preventDefault()
+          this.setAmountToMax()
+        },
+      }, [ 'Max' ]),
     ]),
 
     h('div.send-v2__form-field', [