fix: add error and pagination support to alchemy getTokenBalances (#482)

* fix: load treasury asset balance only when necessary * fix: ignore contract unrecognized by alchemy * fix(ui): fix missing space between icon * fix: support pagination from alchemy get_tokenBalances * fix: fix missing wrapper --------- Co-authored-by: Less <[email protected]>
snapshot-labs · Jul 23, 2024 · f84aaf1 · f84aaf1
1 parent f63b0e2
commit f84aaf1
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 8 deletions.
diff --git a/apps/ui/src/components/SpaceTreasury.vue b/apps/ui/src/components/SpaceTreasury.vue
@@ -135,8 +135,8 @@ watchEffect(() => setTitle(`Treasury - ${props.space.name}`));
 
 <template>
   <div v-if="!treasury || !currentNetwork" class="p-4 flex items-center text-skin-link space-x-2">
-    <IH-exclamation-circle class="inline-block" />
-    No treasury configured.
+    <IH-exclamation-circle class="inline-block shrink-0" />
+    <span>No treasury configured.</span>
   </div>
   <template v-else>
     <div class="p-4 space-x-2 flex">
@@ -226,8 +226,8 @@ watchEffect(() => setTitle(`Treasury - ${props.space.name}`));
             v-else-if="loaded && sortedAssets.length === 0"
             class="px-4 py-3 flex items-center text-skin-link space-x-2"
           >
-            <IH-exclamation-circle class="inline-block" />
-            There are no tokens in treasury.
+            <IH-exclamation-circle class="inline-block shrink-0" />
+            <span>There are no tokens in treasury.</span>
           </div>
           <a
             v-for="(asset, i) in sortedAssets"
@@ -313,8 +313,8 @@ watchEffect(() => setTitle(`Treasury - ${props.space.name}`));
             v-if="nftsLoaded && nfts.length === 0"
             class="px-4 py-3 flex items-center text-skin-link space-x-2"
           >
-            <IH-exclamation-circle class="inline-block" />
-            There are no NFTs in treasury.
+            <IH-exclamation-circle class="inline-block shrink-0" />
+            <span>There are no NFTs in treasury.</span>
           </div>
           <UiLoading v-if="nftsLoading && !nftsLoaded" class="px-4 py-3 block" />
           <div class="flex flex-row flex-wrap gap-4 p-4">

diff --git a/apps/ui/src/helpers/alchemy/index.ts b/apps/ui/src/helpers/alchemy/index.ts
@@ -76,7 +76,24 @@ export async function getTokenBalances(
   address: string,
   networkId: number
 ): Promise<GetTokenBalancesResponse> {
-  return request('alchemy_getTokenBalances', [address], networkId);
+  const results = { address, tokenBalances: [], pageKey: null };
+  let pageKey = null;
+
+  while (true) {
+    const pageResult = await request(
+      'alchemy_getTokenBalances',
+      [address, 'erc20', { pageKey }],
+      networkId
+    );
+
+    results.tokenBalances = results.tokenBalances.concat(pageResult.tokenBalances);
+
+    pageKey = pageResult.pageKey;
+
+    if (!pageKey) break;
+  }
+
+  return results;
 }
 
 /**
@@ -137,6 +154,6 @@ export async function getBalances(
         value: 0,
         change: 0
       }))
-      .filter(token => !token.symbol.includes('.'))
+      .filter(token => !token?.symbol?.includes('.'))
   ];
 }