fix(web): server side fetch sponsor on docs page

Author: AmanVarshney01

apps/web/next.config.ts

@@ -1,6 +1,5 @@
 import { createMDX } from "fumadocs-mdx/next";
-import type { NextConfig } from 'next'
-
+import type { NextConfig } from "next";
 
 const withMDX = createMDX();
 
@@ -30,4 +29,4 @@ const config: NextConfig = {
 	},
 };
 
-export default withMDX(config);
+export default withMDX(config);

apps/web/source.config.ts

@@ -6,7 +6,7 @@ export const docs = defineDocs({
 		postprocess: {
 			includeProcessedMarkdown: true,
 		},
-	}
+	},
 });
 
 export default defineConfig({

apps/web/src/app/llms.mdx/[[...slug]]/route.ts

@@ -1,24 +1,24 @@
-import { getLLMText } from '@/lib/get-llm-text';
-import { source } from '@/lib/source';
-import { notFound } from 'next/navigation';
+import { notFound } from "next/navigation";
+import { getLLMText } from "@/lib/get-llm-text";
+import { source } from "@/lib/source";
 
 export const revalidate = false;
 
 export async function GET(
-  _req: Request,
-  { params }: RouteContext<'/llms.mdx/[[...slug]]'>,
+	_req: Request,
+	{ params }: RouteContext<"/llms.mdx/[[...slug]]">,
 ) {
-  const { slug } = await params;
-  const page = source.getPage(slug);
-  if (!page) notFound();
+	const { slug } = await params;
+	const page = source.getPage(slug);
+	if (!page) notFound();
 
-  return new Response(await getLLMText(page), {
-    headers: {
-      'Content-Type': 'text/markdown',
-    },
-  });
+	return new Response(await getLLMText(page), {
+		headers: {
+			"Content-Type": "text/markdown",
+		},
+	});
 }
 
 export function generateStaticParams() {
-  return source.generateParams();
-}
+	return source.generateParams();
+}

apps/web/src/components/special-sponsor-banner.tsx

@@ -1,7 +1,5 @@
-"use client";
 import { Github, Globe, Star } from "lucide-react";
 import Image from "next/image";
-import { useEffect, useState } from "react";
 import {
 	HoverCard,
 	HoverCardContent,
@@ -12,42 +10,11 @@ import {
 	getSponsorUrl,
 	sortSpecialSponsors,
 } from "@/lib/sponsor-utils";
-import type { Sponsor, SponsorsData } from "@/lib/types";
+import { fetchSponsors } from "@/lib/sponsors";
 
-export function SpecialSponsorBanner() {
-	const [specialSponsors, setSpecialSponsors] = useState<Sponsor[]>([]);
-	const [loading, setLoading] = useState(true);
-
-	useEffect(() => {
-		fetch("https://sponsors.better-t-stack.dev/sponsors.json")
-			.then((res) => {
-				if (!res.ok) throw new Error("Failed to fetch sponsors");
-				return res.json();
-			})
-			.then((data: SponsorsData) => {
-				const specials = sortSpecialSponsors(data.specialSponsors);
-				setSpecialSponsors(specials);
-				setLoading(false);
-			})
-			.catch(() => {
-				setLoading(false);
-			});
-	}, []);
-
-	if (loading) {
-		return (
-			<div>
-				<div className="grid grid-cols-4 items-center gap-2 py-1">
-					{["s1", "s2", "s3", "s4"].map((key) => (
-						<div
-							key={key}
-							className="size-12 animate-pulse rounded border border-border bg-muted"
-						/>
-					))}
-				</div>
-			</div>
-		);
-	}
+export async function SpecialSponsorBanner() {
+	const data = await fetchSponsors();
+	const specialSponsors = sortSpecialSponsors(data.specialSponsors);
 
 	if (!specialSponsors.length) {
 		return null;

apps/web/src/lib/get-llm-text.ts

@@ -1,10 +1,10 @@
-import { source } from '@/lib/source';
-import type { InferPageType } from 'fumadocs-core/source';
+import type { InferPageType } from "fumadocs-core/source";
+import type { source } from "@/lib/source";
 
 export async function getLLMText(page: InferPageType<typeof source>) {
-  const processed = await page.data.getText('processed');
+	const processed = await page.data.getText("processed");
 
-  return `# ${page.data.title} (${page.url})
+	return `# ${page.data.title} (${page.url})
 
 ${processed}`;
-}
+}

apps/web/src/lib/sponsors.ts

@@ -2,7 +2,7 @@ import type { SponsorsData } from "./types";
 
 const SPONSORS_URL = "https://sponsors.better-t-stack.dev/sponsors.json";
 
-export async function fetchSponsors(): Promise<SponsorsData> {
+export async function fetchSponsors() {
 	try {
 		const response = await fetch(SPONSORS_URL, {
 			next: { revalidate: 3600 },