Fix: Prevented incorrect error handling on getting token balances and corrected cGHS address for Alfajores (#205)

### Description

We couldn't get balances on Alfajores because of the incorrect error
handling on getting token balances - it was trying to get the balance of
the token with the address that is not correct (cGHS, this way we faced
the issue). Now, I replaced it with `try catch` block to prevent
throwing an error when there's an issue with some of the tokens.
Instead, we load all the tokens we can and display the responsive
console error to make it more understandable and prevent problems like
this.

### Other changes
Updated address for the 'cGHS' token.

### Tested
While token/s addresses are correct.
1. Navigate to the preview and connect your wallet where you have tokens
on the Alfajores.
2. Change the network to Alfajores.
3. Wait until the balances are loaded.

While token/s addresses are not correct
1. Check out the branch and change any token address to an incorrect
one.
2. Run locally and connect your wallet where you have tokens on the
Alfajores.
3. Change the network to Alfajores.
4. Wait until the warning notification toast is loaded and the console
error is displayed.

### Related issues

- Fixes #issue number here

### Checklist before requesting a review

- [ ] I have performed a self-review of my own code
- [ ] I have added tests that prove my fix is effective or that my
feature works
- [ ] The PR title follows the
[conventions](https://www.notion.so/Git-Branching-and-Commit-Message-Conventions-18f66f7d06444cfcbac5725ffbc7c04a?pvs=4#9355048863c549ef92fe210a8a1298aa)
- [ ] I have run the [regression
tests](https://www.notion.so/Mento-Web-App-Regression-Tests-37bd43a7da8d4e38b65993320a33d557)

Co-authored-by: chapati <philip.paetz@me.com>

Author: Andrew718PLTS

src/config/tokens.ts

@@ -161,7 +161,7 @@ export const TokenAddresses: Record<ChainId, Record<TokenId, Address>> = Object.
     [TokenId.cKES]: '0x1E0433C1769271ECcF4CFF9FDdD515eefE6CdF92',
     [TokenId.PUSO]: '0x5E0E3c9419C42a1B04e2525991FB1A2C467AB8bF',
     [TokenId.cCOP]: '0xe6A57340f0df6E020c1c0a80bC6E13048601f0d4',
-    [TokenId.cGHS]: '0xf419dfab059c36cbafb43a088ebeb2811f9789b9',
+    [TokenId.cGHS]: '0x295B66bE7714458Af45E6A6Ea142A5358A6cA375',
   },
   [ChainId.Baklava]: {
     [TokenId.CELO]: '0xdDc9bE57f553fe75752D61606B94CBD7e0264eF8',

src/features/accounts/fetchBalances.ts

@@ -1,5 +1,5 @@
 import { createAsyncThunk } from '@reduxjs/toolkit'
-import { BigNumberish, Contract } from 'ethers'
+import { Contract } from 'ethers'
 import { BALANCE_STALE_TIME } from 'src/config/consts'
 import { TokenId, getTokenAddress, getTokenOptionsByChainId } from 'src/config/tokens'
 import { getProvider } from 'src/features/providers'
@@ -8,6 +8,8 @@ import { validateAddress } from 'src/utils/addresses'
 import { isStale } from 'src/utils/time'
 import { erc20ABI } from 'wagmi'
 
+import { logger } from '../../utils/logger'
+
 interface FetchBalancesParams {
   address: string
   chainId: number
@@ -30,15 +32,34 @@ export const fetchBalances = createAsyncThunk<
   }
 })
 
-async function _fetchBalances(address: string, chainId: number) {
+async function _fetchBalances(address: string, chainId: number): Promise<Record<TokenId, string>> {
   validateAddress(address, 'fetchBalances')
   const tokenBalances: Partial<Record<TokenId, string>> = {}
-  for (const tokenId of getTokenOptionsByChainId(chainId)) {
-    const tokenAddr = getTokenAddress(tokenId, chainId)
-    const provider = getProvider(chainId)
-    const tokenContract = new Contract(tokenAddr, erc20ABI, provider)
-    const balance: BigNumberish = await tokenContract.balanceOf(address)
-    tokenBalances[tokenId] = balance.toString()
+  for (const tokenSymbol of getTokenOptionsByChainId(chainId)) {
+    tokenBalances[tokenSymbol] = await getTokenBalance({ address, chainId, tokenSymbol })
   }
   return tokenBalances as Record<TokenId, string>
 }
+
+async function getTokenBalance({
+  address,
+  chainId,
+  tokenSymbol,
+}: IGetTokenBalance): Promise<string | undefined> {
+  const tokenAddress = getTokenAddress(tokenSymbol, chainId)
+  const provider = getProvider(chainId)
+  try {
+    const tokenContract = new Contract(tokenAddress, erc20ABI, provider)
+    return (await tokenContract.balanceOf(address)).toString()
+  } catch (error) {
+    // todo: Send such error to Sentry
+    logger.error(`Error on getting balance of '${tokenSymbol}' token.`, { error })
+    return undefined
+  }
+}
+
+interface IGetTokenBalance {
+  address: string
+  chainId: number
+  tokenSymbol: TokenId
+}

src/features/polling/PollingWorker.tsx

@@ -26,8 +26,8 @@ export function PollingWorker() {
       dispatch(fetchBalances({ address, chainId }))
         .unwrap()
         .catch((err) => {
-          toast.warn('Error retrieving account balances')
-          logger.error('Failed to retrieve balances', err)
+          toast.warn(`Can't retrieve account balances.\n Try to refresh the page`)
+          logger.error('Unexpected error on retrieving balances', err)
         })
     }
   }