feat: retry mechanism to fetch balance (#115)

starknet-io · Mar 31, 2022 · 5dda33c · 5dda33c
1 parent 5813f7f
commit 5dda33c
Show file tree

Hide file tree

Showing 3 changed files with 35 additions and 26 deletions.
diff --git a/src/config/constants.js b/src/config/constants.js
@@ -1,7 +1,8 @@
 const constants = {
   ETHERSCAN: 'etherscan',
   VOYAGER: 'voyager',
-  DISCORD_LINK_URL: '//discord.gg/MRjKBXtaDt'
+  DISCORD_LINK_URL: '//discord.gg/MRjKBXtaDt',
+  FETCH_TOKEN_BALANCE_MAX_RETRY: 5
 };
 
 export default constants;
diff --git a/src/providers/TokensProvider/TokensProvider.js b/src/providers/TokensProvider/TokensProvider.js
@@ -1,12 +1,15 @@
 import PropTypes from 'prop-types';
 import React, {useEffect, useReducer} from 'react';
 
+import constants from '../../config/constants';
 import {useLogger} from '../../hooks';
 import {useL1TokenBalance, useL2TokenBalance} from '../../hooks/useTokenBalance';
 import {useL1Wallet, useL2Wallet} from '../WalletsProvider';
 import {TokensContext} from './tokens-context';
 import {actions, initialState, reducer} from './tokens-reducer';
 
+const {FETCH_TOKEN_BALANCE_MAX_RETRY} = constants;
+
 export const TokensProvider = ({children}) => {
   const logger = useLogger(TokensProvider.displayName);
   const [tokens, dispatch] = useReducer(reducer, initialState);
@@ -20,7 +23,7 @@ export const TokensProvider = ({children}) => {
   }, []);
 
   const updateTokenBalance = symbol => {
-    logger.log('Update token balance', {symbol});
+    logger.log(symbol ? `Update ${symbol} token balance` : 'Update all tokens balances');
     const tokensToUpdate = symbol ? tokens.filter(token => token.symbol === symbol) : tokens;
     logger.log('Tokens to update', {tokensToUpdate});
     for (let index = 0; index < tokensToUpdate.length; index++) {
@@ -30,30 +33,35 @@ export const TokensProvider = ({children}) => {
         break;
       }
       logger.log(`Update balance for token ${token.symbol}`, {token});
-      if (!('balance' in token)) {
-        updateTokenState(index, {isLoading: true});
-      } else {
-        logger.log(`Token already have a balance of ${token.balance}, don't set isLoading prop`);
+      'balance' in token
+        ? logger.log(`Token already have a balance of ${token.balance}, don't set isLoading prop`)
+        : updateToken(index, {isLoading: true});
+      fetchBalance(token.isL1 ? getL1TokenBalance : getL2TokenBalance, index, token);
+    }
+  };
+
+  const fetchBalance = async (fn, index, token, retry = 1) => {
+    try {
+      const balance = await fn(token);
+      logger.log(`New ${token.isL1 ? 'L1' : 'L2'} ${token.symbol} token balance is ${balance}`);
+      return updateToken(index, {balance, isLoading: false});
+    } catch (ex) {
+      logger.error(`Failed to fetch token ${token.symbol} balance: ${ex.message}, retry again`, {
+        ex
+      });
+      if (retry === FETCH_TOKEN_BALANCE_MAX_RETRY) {
+        return updateToken(index, {balance: null, isLoading: false});
       }
-      const getBalance = token.isL1 ? getL1TokenBalance : getL2TokenBalance;
-      getBalance(token)
-        .then(balance => {
-          logger.log(`New ${token.isL1 ? 'L1' : 'L2'} ${token.symbol} token balance is ${balance}`);
-          updateTokenState(index, {balance, isLoading: false});
-        })
-        .catch(ex => {
-          logger.error(`Failed to fetch token ${token.symbol} balance: ${ex.message}`, {ex});
-          updateTokenState(index, {balance: null, isLoading: false});
-        });
+      return fetchBalance(fn, index, token, retry + 1);
     }
   };
 
-  const updateTokenState = (index, args) => {
+  const updateToken = (index, props) => {
     dispatch({
-      type: actions.UPDATE_TOKEN_STATE,
+      type: actions.UPDATE_TOKEN,
       payload: {
         index,
-        args
+        props
       }
     });
   };

diff --git a/src/providers/TokensProvider/tokens-reducer.js b/src/providers/TokensProvider/tokens-reducer.js
@@ -2,7 +2,7 @@ import envs from '../../config/envs';
 import {l1tokens, l2tokens} from '../../config/tokens';
 
 export const actions = {
-  UPDATE_TOKEN_STATE: 'Tokens/UPDATE_TOKEN_STATE'
+  UPDATE_TOKEN: 'Tokens/UPDATE_TOKEN'
 };
 
 export const initialState = [
@@ -12,12 +12,12 @@ export const initialState = [
 
 export const reducer = (state, action) => {
   switch (action.type) {
-    case actions.UPDATE_TOKEN_STATE: {
-      const {index, args} = action.payload;
-      const token = {...state[index], ...args};
-      const tokens = [...state];
-      tokens[index] = token;
-      return tokens;
+    case actions.UPDATE_TOKEN: {
+      const {index, props} = action.payload;
+      const newToken = {...state[index], ...props};
+      const clonedTokens = [...state];
+      clonedTokens[index] = newToken;
+      return clonedTokens;
     }
 
     default: