Implement api caching

src/components/client/StatsPage.tsx

@@ -180,7 +180,7 @@ const StatsPage = () => {
                           fontWeight="semibold"
                         >
                           <NumericDisplay
-                            value={item.value || 0}
+                            value={item.value}
                             prefix={valuePrefix}
                             isFetched={isFetched}
                             isFailedToFetchData={isFailedToFetchData}

src/pages/api/social-data.ts

@@ -23,16 +23,12 @@ export default async function handler(
       },
     }
 
-    const redditResponse = await fetch(
-      'https://www.reddit.com/r/everipedia/about.json',
-    )
     const twitterResponse = await fetch(url, options)
 
     const { followers_count: twitterFollowers } = await twitterResponse.json()
-    const redditData = await redditResponse.json()
+
     const data = {
       twitterFollowers,
-      redditFollowers: redditData.data.subscribers,
     }
 
     setCacheHeaders(res)

src/utils/stats-data.ts

@@ -329,12 +329,16 @@ const getEpData = async () => {
 
 const getSocialData = async () => {
   try {
+    const redditResponse = await fetch(
+      'https://www.reddit.com/r/everipedia/about.json',
+    )
     const twitterResponse = await fetch('/api/social-data')
-    const { twitterFollowers, redditFollowers } = await twitterResponse.json()
+    const { twitterFollowers } = await twitterResponse.json()
+    const redditData = await redditResponse.json()
     return {
       social: {
         twitter: twitterFollowers,
-        reddit: redditFollowers,
+        reddit: redditData.data.subscribers,
       },
     }
   } catch (err) {