make balances clickable on add liquidity page (#449)

* make balances clickable on add liquidity page

* update formatting logic

* fix max slippage calculation

src/components/ExchangePage/index.jsx

@@ -386,7 +386,6 @@ export default function ExchangePage({ initialCurrency, sending = false, params
         setInputError(null)
         setShowUnlock(false)
       }
-
       return () => {
         setInputError()
         setShowUnlock(false)

src/pages/Pool/AddLiquidity.js

@@ -119,6 +119,12 @@ function calculateSlippageBounds(value) {
   }
 }
 
+function calculateMaxOutputVal(value) {
+  if (value) {
+    return value.mul(ethers.utils.bigNumberify(10000)).div(ALLOWED_SLIPPAGE.add(ethers.utils.bigNumberify(10000)))
+  }
+}
+
 function initialAddLiquidityState(state) {
   return {
     inputValue: state.ethAmountURL ? state.ethAmountURL : '',
@@ -571,6 +577,17 @@ export default function AddLiquidity({ params }) {
         onValueChange={inputValue => {
           dispatchAddLiquidityState({ type: 'UPDATE_VALUE', payload: { value: inputValue, field: INPUT } })
         }}
+        extraTextClickHander={() => {
+          if (inputBalance) {
+            const valueToSet = inputBalance.sub(ethers.utils.parseEther('.1'))
+            if (valueToSet.gt(ethers.constants.Zero)) {
+              dispatchAddLiquidityState({
+                type: 'UPDATE_VALUE',
+                payload: { value: amountFormatter(valueToSet, 18, 18, false), field: INPUT }
+              })
+            }
+          }
+        }}
         selectedTokenAddress="ETH"
         value={inputValue}
         errorMessage={inputError}
@@ -593,6 +610,17 @@ export default function AddLiquidity({ params }) {
         onValueChange={outputValue => {
           dispatchAddLiquidityState({ type: 'UPDATE_VALUE', payload: { value: outputValue, field: OUTPUT } })
         }}
+        extraTextClickHander={() => {
+          if (outputBalance) {
+            dispatchAddLiquidityState({
+              type: 'UPDATE_VALUE',
+              payload: {
+                value: amountFormatter(calculateMaxOutputVal(outputBalance), decimals, decimals, false),
+                field: OUTPUT
+              }
+            })
+          }
+        }}
         value={outputValue}
         showUnlock={showUnlock}
         errorMessage={outputError}

src/utils/index.js

@@ -279,7 +279,6 @@ export async function getTokenAllowance(address, tokenAddress, spenderAddress, l
   return getContract(tokenAddress, ERC20_ABI, library).allowance(address, spenderAddress)
 }
 
-//
 // amount must be a BigNumber, {base,display}Decimals must be Numbers
 export function amountFormatter(amount, baseDecimals = 18, displayDecimals = 3, useLessThan = true) {
   if (baseDecimals > 18 || displayDecimals > 18 || displayDecimals > baseDecimals) {