From e79188295926df1e88133cf7a9932fa643b87c0a Mon Sep 17 00:00:00 2001
From: Thomas Huang <tmashuang@users.noreply.github.com>
Date: Wed, 11 Mar 2020 13:13:48 -0700
Subject: [PATCH] Handle and set gas estimation when max mode is clicked
 (#8176)

* Handle and set gas estimation when max mode is clicked
Add componentDidMount to SendAmountRow to check for maxMode boolean to update amount and gas.
---
 .../gas-modal-page-container.container.js     |  6 +++--
 .../send-amount-row.component.js              | 26 +++++++++++++++----
 .../send-amount-row.container.js              |  2 ++
 3 files changed, 27 insertions(+), 7 deletions(-)

diff --git a/ui/app/components/app/gas-customization/gas-modal-page-container/gas-modal-page-container.container.js b/ui/app/components/app/gas-customization/gas-modal-page-container/gas-modal-page-container.container.js
index bee56cf1a..d59ba29b4 100644
--- a/ui/app/components/app/gas-customization/gas-modal-page-container/gas-modal-page-container.container.js
+++ b/ui/app/components/app/gas-customization/gas-modal-page-container/gas-modal-page-container.container.js
@@ -107,9 +107,11 @@ const mapStateToProps = (state, ownProps) => {
   const isMainnet = getIsMainnet(state)
   const showFiat = Boolean(isMainnet || showFiatInTestnets)
 
-  const newTotalEth = maxModeOn ? addHexWEIsToRenderableEth(balance, '0x0') : addHexWEIsToRenderableEth(value, customGasTotal)
+  const isTokenSelected = Boolean(getSelectedToken(state))
 
-  const sendAmount = maxModeOn ? subtractHexWEIsFromRenderableEth(balance, customGasTotal) : addHexWEIsToRenderableEth(value, '0x0')
+  const newTotalEth = maxModeOn && !isTokenSelected ? addHexWEIsToRenderableEth(balance, '0x0') : addHexWEIsToRenderableEth(value, customGasTotal)
+
+  const sendAmount = maxModeOn && !isTokenSelected ? subtractHexWEIsFromRenderableEth(balance, customGasTotal) : addHexWEIsToRenderableEth(value, '0x0')
 
   const insufficientBalance = maxModeOn ? false : !isBalanceSufficient({
     amount: value,
diff --git a/ui/app/pages/send/send-content/send-amount-row/send-amount-row.component.js b/ui/app/pages/send/send-content/send-amount-row/send-amount-row.component.js
index 2673a96b2..134ffbce1 100644
--- a/ui/app/pages/send/send-content/send-amount-row/send-amount-row.component.js
+++ b/ui/app/pages/send/send-content/send-amount-row/send-amount-row.component.js
@@ -26,12 +26,26 @@ export default class SendAmountRow extends Component {
     updateSendAmount: PropTypes.func,
     updateSendAmountError: PropTypes.func,
     updateGas: PropTypes.func,
+    maxModeOn: PropTypes.bool,
   }
 
   static contextTypes = {
     t: PropTypes.func,
   }
 
+  componentDidUpdate (prevProps) {
+    const { maxModeOn: prevMaxModeOn, gasTotal: prevGasTotal } = prevProps
+    const { maxModeOn, amount, gasTotal, selectedToken } = this.props
+
+    if (maxModeOn && selectedToken && !prevMaxModeOn) {
+      this.updateGas(amount)
+    }
+
+    if (prevGasTotal !== gasTotal) {
+      this.validateAmount(amount)
+    }
+  }
+
   updateGas = debounce(this.updateGas.bind(this), 500)
 
   validateAmount (amount) {
@@ -86,17 +100,19 @@ export default class SendAmountRow extends Component {
     }
   }
 
+  handleChange = (newAmount) => {
+    this.validateAmount(newAmount)
+    this.updateGas(newAmount)
+    this.updateAmount(newAmount)
+  }
+
   renderInput () {
     const { amount, inError, selectedToken } = this.props
     const Component = selectedToken ? UserPreferencedTokenInput : UserPreferencedCurrencyInput
 
     return (
       <Component
-        onChange={(newAmount) => {
-          this.validateAmount(newAmount)
-          this.updateGas(newAmount)
-          this.updateAmount(newAmount)
-        }}
+        onChange={this.handleChange}
         error={inError}
         value={amount}
       />
diff --git a/ui/app/pages/send/send-content/send-amount-row/send-amount-row.container.js b/ui/app/pages/send/send-content/send-amount-row/send-amount-row.container.js
index 4aa250efc..8ac06b7ba 100644
--- a/ui/app/pages/send/send-content/send-amount-row/send-amount-row.container.js
+++ b/ui/app/pages/send/send-content/send-amount-row/send-amount-row.container.js
@@ -8,6 +8,7 @@ import {
   getSendAmount,
   getSendFromBalance,
   getTokenBalance,
+  getSendMaxModeState,
 } from '../../send.selectors'
 import {
   sendAmountIsInError,
@@ -35,6 +36,7 @@ function mapStateToProps (state) {
     primaryCurrency: getPrimaryCurrency(state),
     selectedToken: getSelectedToken(state),
     tokenBalance: getTokenBalance(state),
+    maxModeOn: getSendMaxModeState(state),
   }
 }