1 files changed, 22 insertions, 17 deletions
diff --git a/ui/app/pages/send/send-content/send-amount-row/amount-max-button/amount-max-button.component.js b/ui/app/pages/send/send-content/send-amount-row/amount-max-button/amount-max-button.component.js
index e256d1442..249703763 100644
--- a/ui/app/pages/send/send-content/send-amount-row/amount-max-button/amount-max-button.component.js
+++ b/ui/app/pages/send/send-content/send-amount-row/amount-max-button/amount-max-button.component.js
@@ -1,16 +1,21 @@
 import React, { Component } from 'react'
 import PropTypes from 'prop-types'
+import classnames from 'classnames'
 
 export default class AmountMaxButton extends Component {
 
   static propTypes = {
     balance: PropTypes.string,
+    buttonDataLoading: PropTypes.bool,
+    clearMaxAmount: PropTypes.func,
+    inError: PropTypes.bool,
     gasTotal: PropTypes.string,
     maxModeOn: PropTypes.bool,
     selectedToken: PropTypes.object,
     setAmountToMax: PropTypes.func,
     setMaxModeTo: PropTypes.func,
     tokenBalance: PropTypes.string,
+
   }
 
   static contextTypes = {
@@ -36,7 +41,7 @@ export default class AmountMaxButton extends Component {
   }
 
   onMaxClick = (event) => {
-    const { setMaxModeTo } = this.props
+    const { setMaxModeTo, clearMaxAmount, maxModeOn } = this.props
     const { metricsEvent } = this.context
 
     metricsEvent({
@@ -46,25 +51,25 @@ export default class AmountMaxButton extends Component {
         name: 'Clicked "Amount Max"',
       },
     })
-
-    event.preventDefault()
-    setMaxModeTo(true)
-    this.setMaxAmount()
+    if (!maxModeOn) {
+      setMaxModeTo(true)
+      this.setMaxAmount()
+    } else {
+      setMaxModeTo(false)
+      clearMaxAmount()
+    }
   }
 
   render () {
-    return this.props.maxModeOn
-      ? null
-      : (
-        <div>
-          <span
-            className="send-v2__amount-max"
-            onClick={this.onMaxClick}
-          >
-            {this.context.t('max')}
-          </span>
-        </div>
+    const { maxModeOn, buttonDataLoading, inError } = this.props
+
+    return (
+          <div className={'send-v2__amount-max'} onClick={buttonDataLoading || inError ? null : this.onMaxClick}>
+            <input type="checkbox" checked={maxModeOn} />
+            <div className={classnames('send-v2__amount-max__button', { 'send-v2__amount-max__button__disabled': buttonDataLoading || inError })}>
+                {this.context.t('max')}
+            </div>
+          </div>
       )
   }
-
 }