From e6851f028bf8103ee311ba396ddac11513db759f Mon Sep 17 00:00:00 2001
From: yunchipang <yunchipang@gmail.com>
Date: Thu, 24 Oct 2024 16:01:08 -0700
Subject: [PATCH] fix: handle api 404 error to display data properly

---
 src/models/api.js      | 40 ++++++++++++++++++++++++++++++++++------
 src/models/apiPaths.js |  2 ++
 src/pages/top.js       | 23 ++++++++---------------
 3 files changed, 44 insertions(+), 21 deletions(-)

diff --git a/src/models/api.js b/src/models/api.js
index 3a53a5ec..fb133c31 100644
--- a/src/models/api.js
+++ b/src/models/api.js
@@ -10,10 +10,10 @@ export async function getFeaturedGrowers() {
     const res = await axios.get(url);
     const data = await res.data;
     log.warn('url:', url, 'took:', Date.now() - begin);
-    return data.grower_accounts;
+    return data.grower_accounts || [];
   } catch (err) {
-    log.error(err.message);
-    throw err;
+    log.error('Error in getFeaturedGrowers:', err.message);
+    return [];
   }
 }
 
@@ -24,10 +24,10 @@ export async function getCaptures() {
     const res = await axios.get(url);
     const data = await res.data;
     log.warn('url:', url, 'took:', Date.now() - begin);
-    return data.captures;
+    return data.captures || [];
   } catch (err) {
-    log.error(err.message);
-    throw err;
+    log.error('Error in getCaptures:', err.message);
+    return [];
   }
 }
 
@@ -73,6 +73,20 @@ export async function getCountryLeaderboard() {
   }
 }
 
+export async function getOrganizations() {
+  try {
+    const url = apiPaths.featuredOrganizations;
+    const begin = Date.now();
+    const res = await axios.get(url);
+    const data = await res.data;
+    log.warn('url:', url, 'took:', Date.now() - begin);
+    return data.organizations || [];
+  } catch (err) {
+    log.error('Error in getOrganizations:', err.message);
+    return [];
+  }
+}
+
 export async function getOrganizationById(id) {
   try {
     const url = apiPaths.organization(id);
@@ -176,6 +190,20 @@ export async function getOrgLinks({
   };
 }
 
+export async function getWallets() {
+  try {
+    const url = apiPaths.featuredWallets;
+    const begin = Date.now();
+    const res = await axios.get(url);
+    const data = await res.data;
+    log.warn('url:', url, 'took:', Date.now() - begin);
+    return data.wallets || [];
+  } catch (err) {
+    log.error('Error in getWallets:', err.message);
+    return [];
+  }
+}
+
 export async function getWalletById(id) {
   try {
     const url = apiPaths.wallets(id);
diff --git a/src/models/apiPaths.js b/src/models/apiPaths.js
index dc17996c..708eac06 100644
--- a/src/models/apiPaths.js
+++ b/src/models/apiPaths.js
@@ -22,6 +22,8 @@ const apiPaths = {
   filterSpeciesByWalletId: (id = '') =>
     urlJoin(host, `/species?wallet_id=${id}`),
   tokens: (id = '') => urlJoin(host, `/tokens/${id}`),
+  featuredOrganizations: urlJoin(host, '/organizations/featured'),
+  featuredWallets: urlJoin(host, '/wallets/featured'),
 };
 
 export default apiPaths;
diff --git a/src/pages/top.js b/src/pages/top.js
index 08ffb2d9..7ec92053 100644
--- a/src/pages/top.js
+++ b/src/pages/top.js
@@ -20,7 +20,8 @@ import {
   getCaptures,
   getCountryLeaderboard,
   getFeaturedGrowers,
-  getFeaturedTrees,
+  getOrganizations,
+  getWallets,
 } from 'models/api';
 import * as utils from 'models/utils';
 
@@ -250,24 +251,16 @@ function Top(props) {
   );
 }
 
-async function serverSideData(params) {
+async function serverSideData() {
   const [captures, countries, growers, organizations, wallets] =
     await Promise.all([
-      getCaptures(), //
+      getCaptures(),
       process.env.NEXT_PUBLIC_COUNTRY_LEADER_BOARD_DISABLED === 'true'
         ? []
         : getCountryLeaderboard(),
       getFeaturedGrowers(),
-      (async () => {
-        const data = await utils.requestAPI('/organizations/featured');
-        log.warn('organizations', data);
-        return data.organizations;
-      })(),
-      (async () => {
-        const data = await utils.requestAPI('/wallets/featured');
-        log.warn('wallets', data);
-        return data.wallets;
-      })(),
+      getOrganizations(),
+      getWallets(),
     ]);
   return {
     captures,
@@ -278,8 +271,8 @@ async function serverSideData(params) {
   };
 }
 
-const getStaticProps = utils.wrapper(async ({ params }) => {
-  const props = await serverSideData(params);
+const getStaticProps = utils.wrapper(async () => {
+  const props = await serverSideData();
   return {
     props,
     revalidate: Number(process.env.NEXT_CACHE_REVALIDATION_OVERRIDE) || 30,