docs: October 2025 Community All-Stars spotlight, Hacktoberfest edition (#5625)

documentation/src/pages/community/data/config.json

@@ -29,7 +29,12 @@
       "id": "september-2025",
       "display": "September 2025",
       "file": "september-2025.json"
+    },
+    {
+      "id": "october-2025",
+      "display": "October 2025",
+      "file": "october-2025.json"
     }
   ],
-  "defaultMonth": "september-2025"
+  "defaultMonth": "october-2025"
 }

documentation/src/pages/community/data/october-2025.json

@@ -0,0 +1,46 @@
+{
+  "month": "October 2025",
+  "communityStars": [
+    {
+      "name": "Arya Pratap Singh",
+      "handle": "ARYPROGRAMMER"
+    },
+    {
+      "name": "Halimah",
+      "handle": "Lymah123"
+    },
+    {
+      "name": "Dakshata Mishra",
+      "handle": "the-matrixneo"
+    },
+    {
+      "name": "Abhi",
+      "handle": "Better-Boy"
+    },
+    {
+      "name": "Anudhyan Datta",
+      "handle": "Anudhyan"
+    }
+  ],
+  "teamStars": [],
+  "leaderboard": [
+    { "handle": "ARYPROGRAMMER", "rank": 1, "medal": "🥇" },
+    { "handle": "Lymah123", "rank": 2, "medal": "🥈" },
+    { "handle": "the-matrixneo", "rank": 3, "medal": "🥉" },
+    { "handle": "Better-Boy", "rank": 4 },
+    { "handle": "Anudhyan", "rank": 5 },
+    { "handle": "Shreyanshsingh23", "rank": 6 },
+    { "handle": "The-Best-Codes", "rank": 7 },
+    { "handle": "anthonydmays", "rank": 8 },
+    { "handle": "Mohammed-Thaha", "rank": 9 },
+    { "handle": "shiv669", "rank": 10 },
+    { "handle": "aegntic", "rank": 11 },
+    { "handle": "M-A-SAIADITHYAA", "rank": 12 },
+    { "handle": "ki3ani", "rank": 13 },
+    { "handle": "vietbui1999ru", "rank": 14 },
+    { "handle": "Itz-Agasta", "rank": 15 },
+    { "handle": "Shahzebdevv", "rank": 16 },
+    { "handle": "Roshansingh9", "rank": 17 },
+    { "handle": "AdemolaAri", "rank": 18 }
+  ]
+}

documentation/src/pages/community/index.tsx

@@ -12,6 +12,7 @@ import june2025Data from "./data/june-2025.json";
 import july2025Data from "./data/july-2025.json";
 import august2025Data from "./data/august-2025.json";
 import september2025Data from "./data/september-2025.json";
+import october2025Data from "./data/october-2025.json";
 import communityContentData from "./data/community-content.json";
 
 // Create a data map for easy access
@@ -22,6 +23,7 @@ const communityDataMap = {
   "july-2025": july2025Data,
   "august-2025": august2025Data,
   "september-2025": september2025Data,
+  "october-2025": october2025Data,
 };
 
 function UpcomingEventsSection() {
@@ -98,19 +100,23 @@ function CommunityAllStarsSection() {
         ))}
       </div>
       
-      {/* Team Stars */}
+      {/* Team Stars - only show if there are team stars */}
-      <div className="text-center">
+      {currentData.teamStars.length > 0 && (
-        <Heading as="h3">⭐ Team Stars</Heading>
+        <>
-        <p className="text-sm text-textStandard">
+          <div className="text-center">
-          Top 5 Contributors from all Block teams!
+            <Heading as="h3">⭐ Team Stars</Heading>
-        </p>
+            <p className="text-sm text-textStandard">
-      </div>
+              Top 5 Contributors from all Block teams!
-      
+            </p>
-      <div className="flex justify-center">
+          </div>
-        {currentData.teamStars.map((contributor, index) => (
+          
-          <StarsCard key={index} contributor={{...contributor, totalCount: currentData.teamStars.length}} />
+          <div className="flex justify-center">
-        ))}
+            {currentData.teamStars.map((contributor, index) => (
-      </div>
+              <StarsCard key={index} contributor={{...contributor, totalCount: currentData.teamStars.length}} />
+            ))}
+          </div>
+        </>
+      )}
       
       {/* Monthly Leaderboard */}
       <div className="text-center">
@@ -216,6 +222,7 @@ function CommunityAllStarsSection() {
 
 function CommunityContentSpotlightSection() {
   const [contentFilter, setContentFilter] = React.useState('all');
+  const [showScrollIndicator, setShowScrollIndicator] = React.useState(true);
   
   const filteredSubmissions = React.useMemo(() => {
     if (contentFilter === 'all') return communityContentData.submissions;
@@ -227,6 +234,12 @@ function CommunityContentSpotlightSection() {
     return communityContentData.submissions.filter(content => content.type === contentFilter);
   }, [contentFilter]);
 
+  const handleScroll = (e: React.UIEvent<HTMLDivElement>) => {
+    const { scrollTop, scrollHeight, clientHeight } = (e.target as HTMLDivElement);
+    const isAtBottom = scrollTop + clientHeight >= scrollHeight - 10; // 10px threshold
+    setShowScrollIndicator(!isAtBottom);
+  };
+
   return (
     <section className="w-full flex flex-col items-center gap-8 my-8">
       <div className="text-center">
@@ -258,19 +271,33 @@ function CommunityContentSpotlightSection() {
       </div>
       
       {/* Content Grid */}
-      <div className="w-full max-w-6xl">
+      <div className="w-full max-w-6xl relative">
-        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+        <div 
-          {/* Persistent Hacktoberfest CTA Card */}
+          className="max-h-[800px] overflow-y-auto pr-2"
-          <HacktoberfestCTACard />
+          onScroll={handleScroll}
+        >
+          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+            {/* Persistent Hacktoberfest CTA Card */}
+            <HacktoberfestCTACard />
+            
+            {filteredSubmissions.map((content) => (
+              <ContentCard key={content.url} content={content} />
+            ))}
+          </div>
           
-          {filteredSubmissions.map((content, index) => (
+          {filteredSubmissions.length === 0 && (
-            <ContentCard key={index} content={content} />
+            <div className="text-center py-8">
-          ))}
+              <p className="text-textSubtle">No content found for this filter.</p>
+            </div>
+          )}
         </div>
         
-        {filteredSubmissions.length === 0 && (
+        {/* Simple scroll indicator - only show when not at bottom */}
-          <div className="text-center py-8">
+        {showScrollIndicator && (
-            <p className="text-textSubtle">No content found for this filter.</p>
+          <div className="absolute bottom-5 inset-x-0 flex justify-center">
+            <span className="w-fit text-xs bg-bgProminent p-2 rounded-full font-medium pointer-events-none flex items-center gap-1.5">
+              Scroll for more ↓
+            </span>
           </div>
         )}
       </div>
@@ -434,8 +461,8 @@ export default function Community(): ReactNode {
       description="Join the goose community - connect with developers, contribute to the project, and help shape the future of AI-powered development tools."
     >
       <main className="container">
-        <CommunityContentSpotlightSection />
         <CommunityAllStarsSection />
+        <CommunityContentSpotlightSection />
         <UpcomingEventsSection />
       </main>
     </Layout>