Added error handling for balance on each shard request

src/api/rpc.ts

@@ -13,6 +13,7 @@ import {
   StakingDelegationResponse,
   TokenType
 } from "../types";
+import { config } from "../config";
 
 export type TRPCResponse<T> = { id: number; jsonrpc: "2.0"; result: T, error?: { code: number, message: string } };
 
@@ -38,8 +39,8 @@ export const rpcBigIntAdapter = <T = any>(...args: Parameters<typeof fetch>) =>
     .then((res) => JSONBig({ storeAsString: true }).parse(res)) as unknown as Promise<T>;
 };
 
-export const getBalance = (params: [string, "latest"]) => {
-  return rpcAdapter<TRPCResponse<string>>(API_URL, {
+export const getBalance = (nodeUrl: string, params: [string, "latest"]) => {
+  return rpcAdapter<TRPCResponse<string>>(nodeUrl, {
     method: "POST",
     headers: { "Content-Type": "application/json" },
     body: JSON.stringify({
@@ -72,62 +73,15 @@ export const hmyv2_getTransactionReceipt = (
 };
 
 export const getAllBalance = (params: [string, "latest"]) => {
-  return Promise.all([
-    rpcAdapter<TRPCResponse<string>>(
-      `${process.env["REACT_APP_RPC_URL_SHARD0"]}`,
-      {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({
-          jsonrpc: "2.0",
-          method: "eth_getBalance",
-          id: 1,
-          params,
-        }),
-      }
-    ),
-    rpcAdapter<TRPCResponse<string>>(
-      `${process.env["REACT_APP_RPC_URL_SHARD1"]}`,
-      {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({
-          jsonrpc: "2.0",
-          method: "eth_getBalance",
-          id: 1,
-          params,
-        }),
-      }
-    ),
-    rpcAdapter<TRPCResponse<string>>(
-      `${process.env["REACT_APP_RPC_URL_SHARD2"]}`,
-      {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({
-          jsonrpc: "2.0",
-          method: "eth_getBalance",
-          id: 1,
-          params,
-        }),
-      }
-    ),
-    rpcAdapter<TRPCResponse<string>>(
-      `${process.env["REACT_APP_RPC_URL_SHARD3"]}`,
-      {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({
-          jsonrpc: "2.0",
-          method: "eth_getBalance",
-          id: 1,
-          params,
-        }),
-      }
-    ),
-  ]).then((arr) => {
-    return Promise.resolve(arr.map((item) => item.result || '0x0'));
-  });
+  const getBalanceHandler = async (nodeUrl: string) => {
+    try {
+      const { result } = await getBalance(nodeUrl, params)
+      return result
+    } catch (e) {
+      return '0x0'
+    }
+  }
+  return Promise.all(config.shardUrls.map(shardUrl => getBalanceHandler(shardUrl)));
 };
 
 const defaultGetHistoryParams = {
@@ -252,14 +206,14 @@ export const hmy_getDelegationsByDelegator = (address: string): Promise<StakingD
 /**
  * Given address get all the approvals made by this address for all types of ERC1155, ERC721, and ERC20 tokens.
  * Supply optional contractAddress argument to filter to only the specified token.
- * 
+ *
  * Use pageIndex and pageSize to control how many events to load from the RPC, supply txnHistory to remove previous
- * 
- * @param address 
- * @param contractAddress 
- * @param pageIndex 
- * @param pageSize 
- * @param txnHistory 
+ *
+ * @param address
+ * @param contractAddress
+ * @param pageIndex
+ * @param pageSize
+ * @param txnHistory
  */
 export const getAllApprovalsForTokens = async (address: string,
   contractAddress: string = "",

src/config/index.ts

@@ -17,8 +17,15 @@ const mapKeysToLowerCase = (input: AddressMap): AddressMap => {
 export const bridgeTokensMap: Record<string, string> = bridgeTokens || {}
 export const addressAliasMap: AddressMap = mapKeysToLowerCase(addressAliases) || {}
 
-export const config = {
-  availableShards: (process.env.REACT_APP_AVAILABLE_SHARDS || '')
+const availableShards = (process.env.REACT_APP_AVAILABLE_SHARDS || '')
     .split(",")
     .map((t) => +t) as ShardID[]
+
+const shardUrls = availableShards
+    .map(shardId => process.env[`REACT_APP_RPC_URL_SHARD${shardId}`] as string)
+    .filter(url => url)
+
+export const config = {
+  availableShards,
+  shardUrls
 }

src/pages/AddressPage/index.tsx

@@ -9,7 +9,6 @@ import {
   getTokenERC721Assets,
   getTokenERC1155Assets,
   getUserERC1155Balances,
-  getERC20TokenHolders,
   getTokenERC1155Balances,
 } from "src/api/client";
 import { useHistory, useParams } from "react-router-dom";
@@ -22,9 +21,9 @@ import {
   TRelatedTransaction,
 } from "src/api/client.interface";
 import { Inventory } from "./tabs/inventory/Inventory";
-import { getAllBalance, getBalance, hmy_getDelegationsByDelegator, StakingDelegation } from "src/api/rpc";
+import { getAllBalance, hmy_getDelegationsByDelegator, StakingDelegation } from "src/api/rpc";
 import { ISourceCode, loadSourceCode } from "../../api/explorerV1";
-import { AddressDetails, RelatedTransaction, RPCTransactionHarmony, ShardID } from "../../types";
+import { AddressDetails, RelatedTransaction, ShardID } from "../../types";
 import { ContractDetails } from "./ContractDetails";
 import { ERC1155Icon } from "src/components/ui/ERC1155Icon";
 import { getAddress } from "src/utils";