Migrate docs app to @vercel/geistdocs

apps/docs/.env.example

@@ -1,5 +1,12 @@
 # AI Gateway API Key (optional - for AI chat)
 AI_GATEWAY_API_KEY=""
 
+# Optional central Geistdocs chat proxy. When set, this is used instead of AI Gateway.
+GEISTDOCS_CHAT_PROXY_URL=""
+GEISTDOCS_CHAT_PROXY_TOKEN=""
+
 # Production URL (automatically set on Vercel)
-NEXT_PUBLIC_VERCEL_PROJECT_PRODUCTION_URL="localhost:3000"
+NEXT_PUBLIC_VERCEL_PROJECT_PRODUCTION_URL="localhost:3000"
+
+# Required for precomputed feature flag URLs
+FLAGS_SECRET="AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA="

apps/docs/app/[lang]/agents.md/route.ts

@@ -0,0 +1,10 @@
+import { createAgentsRoute } from '@vercel/geistdocs/routes/agents';
+import { config } from '@/lib/geistdocs/config';
+
+const agentsRoute = createAgentsRoute({
+  config,
+});
+
+export const GET = agentsRoute.GET;
+export const generateStaticParams = agentsRoute.generateStaticParams;
+export const revalidate = false;

apps/docs/app/[lang]/docs/[[...slug]]/page.tsx

@@ -1,106 +1,35 @@
-import { createRelativeLink } from "fumadocs-ui/mdx";
-import type { Metadata } from "next";
-import { notFound } from "next/navigation";
-import { AskAI } from "@/components/geistdocs/ask-ai";
-import { CopyPage } from "@/components/geistdocs/copy-page";
-import {
-  DocsBody,
-  DocsDescription,
-  DocsPage,
-  DocsTitle,
-} from "@/components/geistdocs/docs-page";
-import { EditSource } from "@/components/geistdocs/edit-source";
-import { Feedback } from "@/components/geistdocs/feedback";
+import { ThemeAwareImage } from "@vercel/geistdocs/components/theme-aware-image";
+import { MobileDocsBar } from "@vercel/geistdocs/mobile-docs-bar";
+import { createDocsPage } from "@vercel/geistdocs/pages/docs";
 import { getMDXComponents } from "@/components/geistdocs/mdx-components";
-import { MobileDocsBar } from "@/components/geistdocs/mobile-docs-bar";
-import { OpenInChat } from "@/components/geistdocs/open-in-chat";
-import { ScrollTop } from "@/components/geistdocs/scroll-top";
-import { Separator } from "@/components/ui/separator";
-import { getLLMText, getPageImage, source } from "@/lib/geistdocs/source";
 import { IframeBrowser } from "@/components/custom/iframe-browser";
 import { LearnMore } from "@/components/custom/learn-more";
 import { ProviderList } from "@/components/custom/provider-list";
-import { ThemeAwareImage } from "@/components/custom/theme-aware-image";
+import { config } from "@/lib/geistdocs/config";
+import { geistdocsSource } from "@/lib/geistdocs/source";
 import { ExternalLinkIcon } from "lucide-react";
 
-const Page = async ({ params }: PageProps<"/[lang]/docs/[[...slug]]">) => {
-  const { slug, lang } = await params;
-  const page = source.getPage(slug, lang);
-
-  if (!page) {
-    notFound();
-  }
-
-  const markdown = await getLLMText(page);
-  const MDX = page.data.body;
-
-  return (
-    <DocsPage
-      full={page.data.full}
-      tableOfContent={{
-        style: "clerk",
-        footer: (
-          <div className="my-3 space-y-3">
-            <Separator />
-            <EditSource path={page.path} />
-            <ScrollTop />
-            <Feedback />
-            <CopyPage text={markdown} />
-            <AskAI href={page.url} />
-            <OpenInChat href={page.url} />
-          </div>
-        ),
-      }}
-      tableOfContentPopover={{ enabled: false }}
-      toc={page.data.toc}
-    >
-      <MobileDocsBar toc={page.data.toc} />
-      <DocsTitle>{page.data.title}</DocsTitle>
-      <DocsDescription>{page.data.description}</DocsDescription>
-      <DocsBody>
-        <MDX
-          components={getMDXComponents({
-            a: createRelativeLink(source, page),
-
-            // Add your custom components here
-            IframeBrowser,
-            LearnMore,
-            ProviderList,
-            ThemeAwareImage,
-            ExternalSmall: ExternalLinkIcon,
-          })}
-        />
-      </DocsBody>
-    </DocsPage>
-  );
-};
-
-export const generateStaticParams = () => source.generateParams();
-
-export const generateMetadata = async ({
-  params,
-}: PageProps<"/[lang]/docs/[[...slug]]">) => {
-  const { slug, lang } = await params;
-  const page = source.getPage(slug, lang);
-
-  if (!page) {
-    notFound();
-  }
-
-  const metadata: Metadata = {
-    title: page.data.title,
-    description: page.data.description,
-    openGraph: {
-      images: getPageImage(page).url,
-    },
-    alternates: {
-      types: {
-        "text/markdown": slug ? `/docs/${slug}.md` : "/docs.md",
-      },
-    },
-  };
-
-  return metadata;
-};
-
-export default Page;
+const docsPage = createDocsPage({
+  config,
+  mdx: ({ link }) =>
+    getMDXComponents({
+      a: link,
+      IframeBrowser,
+      LearnMore,
+      ProviderList,
+      ThemeAwareImage,
+      ExternalSmall: ExternalLinkIcon,
+    }),
+  openGraph: {
+    images: true,
+  },
+  source: geistdocsSource,
+  tableOfContentPopover: {
+    enabled: false,
+  },
+  renderTop: ({ data }) => <MobileDocsBar toc={data.toc} />,
+});
+
+export default docsPage.Page;
+export const generateStaticParams = docsPage.generateStaticParams;
+export const generateMetadata = docsPage.generateMetadata;