From 750984b7130e0a5bc707f479a0249f38185184de Mon Sep 17 00:00:00 2001
From: saml33 <slam.uke@gmail.com>
Date: Sat, 16 Sep 2023 21:48:03 +1000
Subject: [PATCH] only fetch profile details for displayed top token accounts

---
 components/token/TopTokenAccounts.tsx | 32 ++++++++++++++++++---------
 1 file changed, 22 insertions(+), 10 deletions(-)

diff --git a/components/token/TopTokenAccounts.tsx b/components/token/TopTokenAccounts.tsx
index f27eae01..e264ff99 100644
--- a/components/token/TopTokenAccounts.tsx
+++ b/components/token/TopTokenAccounts.tsx
@@ -44,8 +44,18 @@ const fetchTopTokenAccounts = async (tokenIndex: number) => {
       TopDepositorBorrower[],
     ] = await Promise.all([depositsResponse.json(), borrowsResponse.json()])
 
+    const depositsDataToShow =
+      depositsData && depositsData.length
+        ? depositsData.slice(0, 10).filter((d) => d.value >= 1)
+        : []
+
+    const borrowsDataToShow =
+      borrowsData && borrowsData.length
+        ? borrowsData.slice(0, 10).filter((d) => d.value <= -1)
+        : []
+
     const depositorProfilesResponse = await Promise.all(
-      depositsData.map((r: TopDepositorBorrower) =>
+      depositsDataToShow.map((r: TopDepositorBorrower) =>
         fetch(
           `${MANGO_DATA_API_URL}/user-data/profile-details?wallet-pk=${r.wallet_pk}`,
         ),
@@ -57,7 +67,7 @@ const fetchTopTokenAccounts = async (tokenIndex: number) => {
     )
 
     const borrowerProfilesResponse = await Promise.all(
-      borrowsData.map((r: TopDepositorBorrower) =>
+      borrowsDataToShow.map((r: TopDepositorBorrower) =>
         fetch(
           `${MANGO_DATA_API_URL}/user-data/profile-details?wallet-pk=${r.wallet_pk}`,
         ),
@@ -69,14 +79,16 @@ const fetchTopTokenAccounts = async (tokenIndex: number) => {
     )
 
     return [
-      depositsData
-        .map((data, i) => ({ ...data, ...depositorProfilesData[i] }))
-        .slice(0, 10)
-        .filter((d) => d.value > 0),
-      borrowsData
-        .map((data, i) => ({ ...data, ...borrowerProfilesData[i] }))
-        .slice(0, 10)
-        .filter((d) => d.value < 0),
+      depositsDataToShow.map((data, i) => {
+        if (depositorProfilesData[i]) {
+          return { ...data, ...depositorProfilesData[i] }
+        } else return data
+      }),
+      borrowsDataToShow.map((data, i) => {
+        if (borrowerProfilesData[i]) {
+          return { ...data, ...borrowerProfilesData[i] }
+        } else return data
+      }),
     ]
   } catch (e) {
     console.log('Failed to fetch top token accounts', e)