update balances after bridging

gitcoinco · Oct 2, 2024 · dd33b7a · dd33b7a
1 parent 197aed5
commit dd33b7a
Show file tree

Hide file tree

Showing 2 changed files with 65 additions and 58 deletions.
diff --git a/packages/grant-explorer/src/features/common/GenericModal.tsx b/packages/grant-explorer/src/features/common/GenericModal.tsx
@@ -6,7 +6,9 @@ interface InfoModalProps {
  titleSize?: "sm" | "lg";
  body?: JSX.Element;
  isOpen: boolean;
- setIsOpen: React.Dispatch<React.SetStateAction<boolean>>;
+ setIsOpen:
+ | React.Dispatch<React.SetStateAction<boolean>>
+ | ((flag: boolean) => void);
  children?: ReactNode;
 }
 

diff --git a/packages/grant-explorer/src/features/round/ViewCartPage/ViewCartPage.tsx b/packages/grant-explorer/src/features/round/ViewCartPage/ViewCartPage.tsx
@@ -105,69 +105,69 @@ export default function ViewCart() {
  // reduce the number of re-renders by memoizing the chainIds
  const memoizedChainIds = useMemo(() => chainIds, [JSON.stringify(chainIds)]);
 
- useEffect(() => {
- const fetchBalances = async () => {
- const allBalances = await Promise.all(
- chainIds.map(async (chainId) => {
- const chainIdNumber = Number(chainId);
- const chain = getChainById(chainIdNumber);
+ const fetchBalances = async () => {
+ const allBalances = await Promise.all(
+ chainIds.map(async (chainId) => {
+ const chainIdNumber = Number(chainId);
+ const chain = getChainById(chainIdNumber);
 
-  const chainBalances = await Promise.all(
-  chain.tokens.map(async (token) => {
-  if (!token.canVote || !address) return null;
+ const chainBalances = await Promise.all(
+ chain.tokens.map(async (token) => {
+ if (!token.canVote || !address) return null;
 
-  try {
-  const balance = await getBalance(config, {
-  address,
-  token:
-  token.address === zeroAddress ||
-  token.address.toLowerCase() === NATIVE.toLowerCase()
-  ? undefined
-  : (token.address.toLowerCase() as `0x${string}`),
-  chainId: chainIdNumber,
-  });
+ try {
+ const balance = await getBalance(config, {
+ address,
+ token:
+ token.address === zeroAddress ||
+ token.address.toLowerCase() === NATIVE.toLowerCase()
+ ? undefined
+ : (token.address.toLowerCase() as `0x${string}`),
+ chainId: chainIdNumber,
+ });
 
-  return {
-  ...balance,
-  address: token.address,
-  chainId: chainIdNumber,
-  formattedAmount: Number(
-  formatUnits(balance.value, balance.decimals)
-  ),
-  };
-  } catch (e) {
-  console.error(
-  `Error fetching balance for chain ${chainIdNumber} and token ${token.address}`,
-  e
-  );
-  return null;
-  }
-  })
-  );
+ return {
+ ...balance,
+ address: token.address,
+ chainId: chainIdNumber,
+ formattedAmount: Number(
+ formatUnits(balance.value, balance.decimals)
+ ),
+ };
+ } catch (e) {
+ console.error(
+ `Error fetching balance for chain ${chainIdNumber} and token ${token.address}`,
+ e
+ );
+ return null;
+ }
+ })
+ );
 
-  // Filter and convert to balanceMap directly
-  const balanceMap = chainBalances.reduce(
-  (map, balance) => {
-  if (balance) {
-  map[balance.address.toLowerCase()] = balance; // Use balance directly as it's already typed
-  }
-  return map;
-  },
-  {} as { [tokenAddress: string]: Balance }
-  );
+ // Filter and convert to balanceMap directly
+ const balanceMap = chainBalances.reduce(
+ (map, balance) => {
+ if (balance) {
+ map[balance.address.toLowerCase()] = balance; // Use balance directly as it's already typed
+ }
+ return map;
+ },
+ {} as { [tokenAddress: string]: Balance }
+ );
 
-  return { chainId: chainIdNumber, balanceMap };
-  })
-  );
+ return { chainId: chainIdNumber, balanceMap };
+ })
+ );
 
-  // Convert array of balances into a single BalanceMap object
-  const newBalances = allBalances.reduce((map, { chainId, balanceMap }) => {
-  map[chainId] = balanceMap;
-  return map;
-  }, {} as BalanceMap);
-  setBalances(newBalances);
-  };
+ // Convert array of balances into a single BalanceMap object
+ const newBalances = allBalances.reduce((map, { chainId, balanceMap }) => {
+ map[chainId] = balanceMap;
+ return map;
+ }, {} as BalanceMap);
+ setBalances(newBalances);
+ };
 
+ useEffect(() => {
  // Fetch balances if they have not been fetched yet
  if (Object.keys(balances) && address) {
  fetchBalances();
@@ -217,6 +217,11 @@ export default function ViewCart() {
  });
  };
 
+ const swapModalHandler = async (flag: boolean) => {
+ await fetchBalances();
+ setOpenSwapModal(flag);
+ };
+
  return (
  <>
  <Navbar />
@@ -266,7 +271,7 @@ export default function ViewCart() {
  <GenericModal
  body={<SquidWidget {...swapParams} />}
  isOpen={openSwapModel}
- setIsOpen={setOpenSwapModal}
+ setIsOpen={swapModalHandler}
  />
  </main>
  <div className="my-11">