Finance: simplify loading selected token information and use better e…

…rror values
aragon · Apr 18, 2019 · 8d74dc9 · 8d74dc9
1 parent e8ccf6c
commit 8d74dc9
Showing 1 changed file with 55 additions and 53 deletions.
diff --git a/apps/finance/app/src/components/NewTransfer/Deposit.js b/apps/finance/app/src/components/NewTransfer/Deposit.js
@@ -39,6 +39,19 @@ const TOKEN_ALLOWANCE_WEBSITE = 'https://tokenallowance.io/'
 
 const tokenAbi = [].concat(tokenBalanceOfAbi, tokenDecimalsAbi, tokenSymbolAbi)
 
+const renderBalanceForSelectedToken = selectedToken => {
+  const { decimals, loading, symbol, userBalance } = selectedToken.data
+  if (loading) {
+    return ''
+  }
+
+  return userBalance === -1
+    ? `Your balance could not be found for ${symbol}`
+    : `You have ${
+        userBalance === '0' ? 'no' : fromDecimals(userBalance, decimals)
+      } ${symbol} available`
+}
+
 const initialState = {
   amount: {
     error: NO_ERROR,
@@ -129,63 +142,61 @@ class Deposit extends React.Component {
     const { selectedToken } = this.state
     return selectedToken.value && !selectedToken.data.loading
   }
-  loadTokenData(address) {
+  async loadTokenData(address) {
     const { api, network, connectedAccount } = this.props
 
     // ETH
     if (addressesEqual(address, ETHER_TOKEN_FAKE_ADDRESS)) {
-      return api
+      const userBalance = await api
         .web3Eth('getBalance', connectedAccount)
         .toPromise()
-        .then(ethBalance => ({
-          decimals: 18,
-          loading: false,
-          symbol: 'ETH',
-          userBalance: ethBalance,
-        }))
+        .catch(() => '-1')
+
+      return {
+        decimals: 18,
+        loading: false,
+        symbol: 'ETH',
+        userBalance,
+      }
     }
 
     // Tokens
     const token = api.external(address, tokenAbi)
+    const userBalance = await token
+      .balanceOf(connectedAccount)
+      .toPromise()
+      .catch(() => '-1')
+
+    const decimalsFallback =
+      tokenDataFallback(address, 'decimals', network.type) || '0'
+    const symbolFallback =
+      tokenDataFallback(address, 'symbol', network.type) || ''
+
+    const tokenData = {
+      userBalance,
+      decimals: parseInt(decimalsFallback, 10),
+      loading: false,
+      symbol: symbolFallback,
+    }
 
-    return new Promise(async (resolve, reject) => {
-      const userBalance = await token
-        .balanceOf(connectedAccount)
+    const [tokenSymbol, tokenDecimals] = await Promise.all([
+      getTokenSymbol(api, address).catch(() => ''),
+      token
+        .decimals()
         .toPromise()
-        // Assume no balance if the call failed
-        .catch(() => '0')
+        .then(decimals => parseInt(decimals, 10))
+        .catch(() => ''),
+    ])
 
-      const decimalsFallback =
-        tokenDataFallback(address, 'decimals', network.type) || '0'
-      const symbolFallback =
-        tokenDataFallback(address, 'symbol', network.type) || ''
-
-      const tokenData = {
-        userBalance,
-        decimals: parseInt(decimalsFallback, 10),
-        loading: false,
-        symbol: symbolFallback,
-      }
-
-      const [tokenSymbol, tokenDecimals] = await Promise.all([
-        getTokenSymbol(api, address).catch(() => {}),
-        token
-          .decimals()
-          .toPromise()
-          .then(decimals => parseInt(decimals, 10))
-          .catch(() => {}),
-      ])
-
-      // If symbol or decimals are resolved, overwrite the fallbacks
-      if (tokenSymbol) {
-        tokenData.symbol = tokenSymbol
-      }
-      if (tokenDecimals) {
-        tokenData.decimals = tokenDecimals
-      }
+    // If symbol or decimals are resolved, overwrite the fallbacks
+    if (tokenSymbol) {
+      tokenData.symbol = tokenSymbol
+    }
+    if (tokenDecimals) {
+      tokenData.decimals = tokenDecimals
+    }
 
-      resolve(tokenData)
-    })
+    return tokenData
   }
   validateInputs({ amount, selectedToken } = {}) {
     amount = amount || this.state.amount
@@ -260,16 +271,7 @@ class Deposit extends React.Component {
 
     const selectedTokenIsAddress = isAddress(selectedToken.value)
     const showTokenBadge = selectedTokenIsAddress && selectedToken.coerced
-    const tokenBalanceMessage = selectedToken.data.userBalance
-      ? `You have ${
-          selectedToken.data.userBalance === '0'
-            ? 'no'
-            : fromDecimals(
-                selectedToken.data.userBalance,
-                selectedToken.data.decimals
-              )
-        } ${selectedToken.data.symbol} available`
-      : ''
+    const tokenBalanceMessage = renderBalanceForSelectedToken(selectedToken)
 
     const ethSelected =
       selectedTokenIsAddress &&