fix(web): allow builds without Graphite; harden streaks/emoji flows

Use a noop StatsD client when GRAPHITE_HOST is unset to prevent build/runtime failures; make streaks and emoji APIs/pages robust by fixing error handling and ensuring JSON-serializable defaults.

Author: JosiasAurel

apps/web/metrics.js

@@ -1,19 +1,24 @@
 import StatsD from "node-statsd";
-import { config } from "dotenv";
 
-const environment = process.env.NODE_ENV;
+const environment = process.env.NODE_ENV || "development";
 const graphite = process.env.GRAPHITE_HOST;
 
-if (graphite == null) {
-  throw new Error("Graphite host not configured");
-}
-
-const options = {
-  host: graphite,
-  port: 8125,
-  prefix: `${environment}.scrapbook.`
+// Provide a no-op metrics client when Graphite is not configured,
+// so builds and local dev do not fail.
+const noopMetrics = {
+  timing: () => {},
+  increment: () => {}
 };
 
-const metrics = new StatsD(options);
+let metricsClient;
+if (graphite && graphite.length > 0) {
+  metricsClient = new StatsD({
+    host: graphite,
+    port: 8125,
+    prefix: `${environment}.scrapbook.`
+  });
+} else {
+  metricsClient = noopMetrics;
+}
 
-export default metrics; 
+export default metricsClient;

apps/web/pages/api/clubs/[slug]/index.js

@@ -53,8 +53,9 @@ export const getPosts = async (club, max = null) => {
       }
     })
 
-    if (!allUpdates)
+    if (!allUpdates) {
       // console.error('Could not fetch posts');
+    }
 
     const users = await getRawUsers()
 

apps/web/pages/api/r/[emoji].js

@@ -25,8 +25,7 @@ export const getPosts = async (emoji, maxRecords = 256, where = {}) => {
       .map(p => transformPost(p))
 
   } catch (err) {
-    if (!allUpdates)
-      // console.error('Could not fetch posts');
+    // console.error(err)
     throw new Error(err);
   }
 }

apps/web/pages/api/streaks.js

@@ -9,14 +9,23 @@ export const getUserStreaks = async () => {
         }
       },
       select: {
+        id: true,
         username: true,
         slackID: true,
         avatar: true,
         streakCount: true,
         maxStreaks: true
       }
     })
-    return streaks;
+    // Ensure values are JSON-serializable (no undefined)
+    return streaks.map(user => ({
+      id: user.id ?? null,
+      username: user.username ?? null,
+      slackID: user.slackID ?? null,
+      avatar: user.avatar ?? null,
+      streakCount: user.streakCount ?? 0,
+      maxStreaks: user.maxStreaks ?? 0
+    }));
   }
   catch (err) {
     throw Error(err)
@@ -26,9 +35,9 @@ export const getUserStreaks = async () => {
 
 export default async (req, res) => {
   try {
-    const streaks = getUserStreaks();
+    const streaks = await getUserStreaks();
     res.json(streaks);
-  } catch {
-    res.status(404).json(streaks);
+  } catch (err) {
+    res.status(404).json([]);
   }
 }

apps/web/pages/api/users/[username]/index.js

@@ -51,8 +51,9 @@ export const getPosts = async (user, max = null) => {
     }
   })
 
-  if (!allUpdates)
+  if (!allUpdates) {
     // console.error('Could not fetch posts');
+  }
 
   return allUpdates.map(p => transformPost(p))
 }
@@ -67,8 +68,9 @@ export const getMentions = async user => {
       }
     })
 
-    if (!allUpdates)
+    if (!allUpdates) {
       // console.error('Could not fetch posts');
+    }
 
     const mentions = allUpdates
       .map(p => {

apps/web/pages/r/[emoji].js

@@ -152,7 +152,7 @@ const Page = ({ status, emoji, related = [], posts = [], css }) => {
   } else if (emoji) {
     return (
       <Feed
-        initialData={SuperJSON.parse(posts)}
+      initialData={typeof posts === 'string' ? SuperJSON.parse(posts) : (posts || [])}
         src={`/api/r/${emoji.name}`}
         footer={related.length > 1 && <Footer reactions={related} />}
       >
@@ -237,6 +237,6 @@ export const getStaticProps = async ({ params }) => {
     return { props: { emoji, posts: SuperJSON.stringify(posts), related, css }, revalidate: 1 }
   } catch (error) {
     // console.error(error)
-    return { props: { emoji: { name }, css }, revalidate: 1 }
+    return { props: { emoji: { name }, posts: SuperJSON.stringify([]), css }, revalidate: 1 }
   }
 }

apps/web/pages/streaks.js

@@ -3,7 +3,7 @@ import Meta from '@hackclub/meta'
 import Mention from '../components/mention'
 import { orderBy } from 'lodash-es'
 
-const StreaksPage = ({ users }) => {
+const StreaksPage = ({ users = [] }) => {
   return (
     <>
       <Meta
@@ -112,12 +112,19 @@ const StreaksPage = ({ users }) => {
 export default StreaksPage
 
 export const getStaticProps = async () => {
-  const streaks = require('./api/streaks')
-  const users = await streaks.getUserStreaks()
-  return {
-    props: {
-      users
-    },
-    revalidate: 10
+  try {
+    const streaks = require('./api/streaks')
+    const users = await streaks.getUserStreaks()
+    return {
+      props: {
+        users: users ?? []
+      },
+      revalidate: 10
+    }
+  } catch (err) {
+    return {
+      props: { users: [] },
+      revalidate: 10
+    }
   }
 }