fix: gate client-side GitHub discussions

Author: Abhash-Chakraborty

docusaurus.config.ts

@@ -248,6 +248,9 @@ const config: Config = {
 
   markdown: {
     mermaid: true,
+    hooks: {
+      onBrokenMarkdownLinks: "warn",
+    },
   },
 
   // Migrated legacy setting to markdown.hooks.onBrokenMarkdownLinks
@@ -273,9 +276,6 @@ const config: Config = {
       process.env.SHOPIFY_STORE_DOMAIN || "junh9v-gw.myshopify.com",
     SHOPIFY_STOREFRONT_ACCESS_TOKEN:
       process.env.SHOPIFY_STOREFRONT_ACCESS_TOKEN,
-    hooks: {
-      onBrokenMarkdownLinks: "warn",
-    },
   },
 };
 

src/pages/dashboard/index.tsx

@@ -130,6 +130,7 @@ const DashboardContent: React.FC = () => {
       setDiscussions(discussionsData);
     } catch (error) {
       console.error("Failed to fetch discussions:", error);
+      setDiscussions([]);
       setDiscussionsError(
         error instanceof Error ? error.message : "Failed to load discussions",
       );

src/services/githubService.ts

@@ -64,6 +64,8 @@ class GitHubService {
   private readonly CACHE_KEY = "github_org_stats";
   private readonly CACHE_DURATION = 30 * 60 * 1000; // 30 minutes in milliseconds
   private readonly BASE_URL = "https://api.github.com";
+  private readonly DISCUSSIONS_UNAVAILABLE_MESSAGE =
+    "GitHub Discussions are disabled until a server-side GitHub proxy is configured.";
 
   // === ADDED: include anonymous contributors configurable (default false)
   private includeAnonymousContributors = false;
@@ -76,6 +78,10 @@ class GitHubService {
     };
   }
 
+  private canUseGitHubGraphQL(): boolean {
+    return typeof window === "undefined";
+  }
+
   // === ADDED: setter to toggle anonymous contributors inclusion
   setIncludeAnonymousContributors(value: boolean) {
     this.includeAnonymousContributors = value;
@@ -267,16 +273,16 @@ class GitHubService {
     return totalContributors;
   }
 
-  // === UPDATED: Get discussions count for a specific repository (default: "Support")
-  // Reason: previous code used an org-wide issues search which returned issues, not discussions.
-  // This function uses GraphQL to read repository.discussions.totalCount (repo-specific).
-  // If you need org-wide discussions count, we should iterate all repos and sum totalCount (heavier).
+  // GitHub GraphQL requires authentication, so the browser should not call it directly.
   private async getDiscussionsCount(
     signal?: AbortSignal,
     repoName: string = "Support",
   ): Promise<number> {
+    if (!this.canUseGitHubGraphQL()) {
+      return 0;
+    }
+
     try {
-      // GraphQL query to get discussions totalCount for a repository
       const query = `
         query ($owner: String!, $name: String!) {
           repository(owner: $owner, name: $name) {
@@ -343,11 +349,10 @@ class GitHubService {
         0,
       );
 
-      // Estimate contributors and get discussions count
-      // === UPDATED: getDiscussionsCount now uses GraphQL for a specific repo (default 'Support')
+      // Estimate contributors and fetch discussion stats when a server-side context is available.
       const [totalContributors, discussionsCount] = await Promise.all([
         this.estimateContributors(activeRepos, signal),
-        this.getDiscussionsCount(signal), // default repoName: "Support" (change if you prefer another repo)
+        this.getDiscussionsCount(signal),
       ]);
 
       const stats: GitHubOrgStats = {
@@ -402,11 +407,14 @@ class GitHubService {
     return { cached: true, age, expiresIn };
   }
 
-  // Fetch GitHub Discussions using GraphQL API (existing method kept intact)
   async fetchDiscussions(
     limit: number = 20,
     signal?: AbortSignal,
   ): Promise<GitHubDiscussion[]> {
+    if (!this.canUseGitHubGraphQL()) {
+      throw new Error(this.DISCUSSIONS_UNAVAILABLE_MESSAGE);
+    }
+
     const query = `
       query GetDiscussions($owner: String!, $name: String!, $first: Int!) {
         repository(owner: $owner, name: $name) {
@@ -505,9 +513,7 @@ class GitHubService {
       );
     } catch (error) {
       console.error("Error fetching discussions:", error);
-
-      // Return mock data for development/fallback
-      return this.getMockDiscussions();
+      throw error;
     }
   }
 

wiki/Documentation.md

@@ -221,9 +221,13 @@ const isPRInTimeRange = (mergedAt: string, filter: TimeFilter): boolean => {
   const prDate = new Date(mergedAt);
   return prDate >= filterDate;
 };
+```
+
 Computed Contributors
 This is where React's useMemo shines:
-typescriptconst contributors = useMemo(() => {
+
+```typescript
+const contributors = useMemo(() => {
   if (!allContributors.length) return [];
 
   const filteredContributors = allContributors