Update docs template

docs/app/(home)/components/cta.tsx → docs/app/[lang]/(home)/components/cta.tsx

@@ -6,7 +6,7 @@ export const CTA = () => (
     <h2 className="font-semibold text-xl tracking-tight sm:text-2xl md:text-3xl lg:text-[40px]">
       Create your first workflow today.
     </h2>
-    <Button asChild className="w-fit" size="lg" className="text-base h-12">
+    <Button asChild size="lg" className="w-fit text-base h-12">
       <Link href="/docs/getting-started">Get started</Link>
     </Button>
   </section>

docs/app/(home)/components/implementation.tsx → docs/app/[lang]/(home)/components/implementation.tsx

@@ -1,4 +1,4 @@
-import { CodeBlock } from '@/app/(home)/components/code-block';
+import { CodeBlock } from '@/app/[lang]/(home)/components/code-block';
 
 const data = [
   {

docs/app/(home)/components/intro/intro.tsx → docs/app/[lang]/(home)/components/intro/intro.tsx

@@ -1,4 +1,4 @@
-import { CodeBlock } from '@/app/(home)/components/code-block';
+import { CodeBlock } from '@/app/[lang]/(home)/components/code-block';
 import { IntroTabs } from './intro-tabs';
 import { NonWorkflowExample } from './non-workflow';
 import { WorkflowExample } from './workflow';

docs/app/(home)/components/run-anywhere.tsx → docs/app/[lang]/(home)/components/run-anywhere.tsx

@@ -1,5 +1,5 @@
 import type { ComponentProps } from 'react';
-import { CodeBlock } from '@/app/(home)/components/code-block';
+import { CodeBlock } from '@/app/[lang]/(home)/components/code-block';
 import { cn } from '@/lib/utils';
 
 const DigitalOcean = (props: ComponentProps<'svg'>) => (

docs/app/(home)/components/use-cases-server.tsx → docs/app/[lang]/(home)/components/use-cases-server.tsx

@@ -1,4 +1,4 @@
-import { CodeBlock } from '@/app/(home)/components/code-block';
+import { CodeBlock } from '@/app/[lang]/(home)/components/code-block';
 import { UseCasesClient } from './use-cases-client';
 
 const useCases = [

docs/app/[lang]/(home)/layout.tsx

@@ -0,0 +1,14 @@
+import { HomeLayout } from '@/components/geistdocs/home-layout';
+import { source } from '@/lib/geistdocs/source';
+
+const Layout = async ({ children, params }: LayoutProps<'/[lang]'>) => {
+  const { lang } = await params;
+
+  return (
+    <HomeLayout tree={source.pageTree[lang]}>
+      <div className="bg-sidebar pt-0 pb-32">{children}</div>
+    </HomeLayout>
+  );
+};
+
+export default Layout;

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

@@ -1,6 +1,7 @@
 import { Step, Steps } from 'fumadocs-ui/components/steps';
 import { Tab, Tabs } from 'fumadocs-ui/components/tabs';
 import { createRelativeLink } from 'fumadocs-ui/mdx';
+import type { Metadata } from 'next';
 import { notFound } from 'next/navigation';
 import { AgentTraces } from '@/components/custom/agent-traces';
 import { AskAI } from '@/components/geistdocs/ask-ai';
@@ -10,25 +11,21 @@ import {
   DocsDescription,
   DocsPage,
   DocsTitle,
-  generatePageMetadata,
-  generateStaticPageParams,
 } from '@/components/geistdocs/docs-page';
 import { EditSource } from '@/components/geistdocs/edit-source';
 import { Feedback } from '@/components/geistdocs/feedback';
 import { getMDXComponents } from '@/components/geistdocs/mdx-components';
 import { OpenInChat } from '@/components/geistdocs/open-in-chat';
 import { ScrollTop } from '@/components/geistdocs/scroll-top';
-import { TableOfContents } from '@/components/geistdocs/toc';
 import * as AccordionComponents from '@/components/ui/accordion';
 import { Badge } from '@/components/ui/badge';
-
+import { Separator } from '@/components/ui/separator';
 import { getLLMText, source } from '@/lib/geistdocs/source';
 import { TSDoc } from '@/lib/tsdoc';
 
-const Page = async (props: PageProps<'/docs/[[...slug]]'>) => {
-  const params = await props.params;
-
-  const page = source.getPage(params.slug);
+const Page = async ({ params }: PageProps<'/[lang]/docs/[[...slug]]'>) => {
+  const { slug, lang } = await params;
+  const page = source.getPage(slug, lang);
 
   if (!page) {
     notFound();
@@ -39,17 +36,19 @@ const Page = async (props: PageProps<'/docs/[[...slug]]'>) => {
 
   return (
     <DocsPage
-      slug={params.slug}
+      full={page.data.full}
       tableOfContent={{
-        component: (
-          <TableOfContents>
+        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} />
-          </TableOfContents>
+          </div>
         ),
       }}
       toc={page.data.toc}
@@ -77,14 +76,24 @@ const Page = async (props: PageProps<'/docs/[[...slug]]'>) => {
   );
 };
 
-export const generateStaticParams = generateStaticPageParams;
+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();
+  }
 
-export const generateMetadata = async (
-  props: PageProps<'/docs/[[...slug]]'>
-) => {
-  const params = await props.params;
+  const metadata: Metadata = {
+    title: page.data.title,
+    description: page.data.description,
+  };
 
-  return generatePageMetadata(params.slug);
+  return metadata;
 };
 
 export default Page;

docs/app/[lang]/docs/layout.tsx

@@ -0,0 +1,10 @@
+import { DocsLayout } from '@/components/geistdocs/docs-layout';
+import { source } from '@/lib/geistdocs/source';
+
+const Layout = async ({ children, params }: LayoutProps<'/[lang]/docs'>) => {
+  const { lang } = await params;
+
+  return <DocsLayout tree={source.pageTree[lang]}>{children}</DocsLayout>;
+};
+
+export default Layout;

docs/app/[lang]/layout.tsx

@@ -0,0 +1,28 @@
+import '../global.css';
+import { Footer } from '@/components/geistdocs/footer';
+import { Navbar } from '@/components/geistdocs/navbar';
+import { GeistdocsProvider } from '@/components/geistdocs/provider';
+import { mono, sans } from '@/lib/geistdocs/fonts';
+import { cn } from '@/lib/utils';
+
+const Layout = async ({ children, params }: LayoutProps<'/[lang]'>) => {
+  const { lang } = await params;
+
+  return (
+    <html
+      className={cn(sans.variable, mono.variable, 'scroll-smooth antialiased')}
+      lang={lang}
+      suppressHydrationWarning
+    >
+      <body>
+        <GeistdocsProvider lang={lang}>
+          <Navbar />
+          {children}
+          <Footer />
+        </GeistdocsProvider>
+      </body>
+    </html>
+  );
+};
+
+export default Layout;

docs/app/llms.mdx/[[...slug]]/route.ts → docs/app/[lang]/llms.mdx/[[...slug]]/route.ts

@@ -5,10 +5,10 @@ export const revalidate = false;
 
 export async function GET(
   _req: Request,
-  { params }: RouteContext<'/llms.mdx/[[...slug]]'>
+  { params }: RouteContext<'/[lang]/llms.mdx/[[...slug]]'>
 ) {
-  const { slug } = await params;
-  const page = source.getPage(slug);
+  const { slug, lang } = await params;
+  const page = source.getPage(slug, lang);
 
   if (!page) {
     notFound();
@@ -21,6 +21,10 @@ export async function GET(
   });
 }
 
-export function generateStaticParams() {
-  return source.generateParams();
-}
+export const generateStaticParams = async ({
+  params,
+}: RouteContext<'/[lang]/llms.mdx/[[...slug]]'>) => {
+  const { lang } = await params;
+
+  return source.generateParams(lang);
+};

docs/app/[lang]/llms.txt/route.ts

@@ -0,0 +1,15 @@
+import type { NextRequest } from 'next/server';
+import { getLLMText, source } from '@/lib/geistdocs/source';
+
+export const revalidate = false;
+
+export const GET = async (
+  _req: NextRequest,
+  { params }: RouteContext<'/[lang]/llms.txt'>
+) => {
+  const { lang } = await params;
+  const scan = source.getPages(lang).map(getLLMText);
+  const scanned = await Promise.all(scan);
+
+  return new Response(scanned.join('\n\n'));
+};

docs/app/[lang]/og/[...slug]/route.tsx

@@ -0,0 +1,95 @@
+import { readFile } from 'node:fs/promises';
+import { join } from 'node:path';
+import { ImageResponse } from 'next/og';
+import type { NextRequest } from 'next/server';
+import { getPageImage, source } from '@/lib/geistdocs/source';
+
+export const GET = async (
+  _request: NextRequest,
+  { params }: RouteContext<'/[lang]/og/[...slug]'>
+) => {
+  const { slug, lang } = await params;
+  const page = source.getPage(slug.slice(0, -1), lang);
+
+  if (!page) {
+    return new Response('Not found', { status: 404 });
+  }
+
+  const { title, description } = page.data;
+
+  const regularFont = await readFile(
+    join(process.cwd(), 'app/[lang]/og/[...slug]/geist-sans-regular.ttf')
+  );
+
+  const semiboldFont = await readFile(
+    join(process.cwd(), 'app/[lang]/og/[...slug]/geist-sans-semibold.ttf')
+  );
+
+  const backgroundImage = await readFile(
+    join(process.cwd(), 'app/[lang]/og/[...slug]/background.png')
+  );
+
+  const backgroundImageData = backgroundImage.buffer.slice(
+    backgroundImage.byteOffset,
+    backgroundImage.byteOffset + backgroundImage.byteLength
+  );
+
+  return new ImageResponse(
+    <div style={{ fontFamily: 'Geist' }} tw="flex h-full w-full bg-black">
+      {/** biome-ignore lint/performance/noImgElement: "Required for Satori" */}
+      <img
+        alt="Vercel OpenGraph Background"
+        height={628}
+        src={backgroundImageData as never}
+        width={1200}
+      />
+      <div tw="flex flex-col absolute h-full w-[750px] justify-center left-[50px] pr-[50px] pt-[116px] pb-[86px]">
+        <div
+          style={{
+            textWrap: 'balance',
+          }}
+          tw="text-5xl font-medium text-white tracking-tight flex leading-[1.1] mb-4"
+        >
+          {title}
+        </div>
+        <div
+          style={{
+            color: '#8B8B8B',
+            lineHeight: '44px',
+            textWrap: 'balance',
+          }}
+          tw="text-[32px]"
+        >
+          {description}
+        </div>
+      </div>
+    </div>,
+    {
+      width: 1200,
+      height: 628,
+      fonts: [
+        {
+          name: 'Geist',
+          data: regularFont,
+          weight: 400,
+        },
+        {
+          name: 'Geist',
+          data: semiboldFont,
+          weight: 500,
+        },
+      ],
+    }
+  );
+};
+
+export const generateStaticParams = async ({
+  params,
+}: RouteContext<'/[lang]/og/[...slug]'>) => {
+  const { lang } = await params;
+
+  return source.getPages(lang).map((page) => ({
+    lang: page.locale,
+    slug: getPageImage(page).segments,
+  }));
+};

docs/app/rss.xml/route.ts → docs/app/[lang]/rss.xml/route.ts

@@ -1,30 +1,33 @@
 import { Feed } from 'feed';
+import type { NextRequest } from 'next/server';
+import { title } from '@/geistdocs';
 import { source } from '@/lib/geistdocs/source';
 
 const protocol = process.env.NODE_ENV === 'production' ? 'https' : 'http';
 const baseUrl = `${protocol}://${process.env.NEXT_PUBLIC_VERCEL_PROJECT_PRODUCTION_URL}`;
 
 export const revalidate = false;
 
-export const GET = () => {
+export const GET = async (
+  _req: NextRequest,
+  { params }: RouteContext<'/[lang]/rss.xml'>
+) => {
+  const { lang } = await params;
   const feed = new Feed({
-    title: 'Workflow DevKit Documentation',
-    description:
-      'use workflow brings durability, reliability, and observability to async JavaScript. Build apps and AI Agents that can suspend, resume, and maintain state with ease.',
+    title,
     id: baseUrl,
     link: baseUrl,
-    language: 'en',
+    language: lang,
     copyright: `All rights reserved ${new Date().getFullYear()}, Vercel`,
   });
 
-  for (const page of source.getPages()) {
+  for (const page of source.getPages(lang)) {
     feed.addItem({
       id: page.url,
       title: page.data.title,
       description: page.data.description,
       link: `${baseUrl}${page.url}`,
       date: new Date(page.data.lastModified ?? new Date()),
-
       author: [
         {
           name: 'Vercel',

docs/app/actions/feedback/emotions.ts

@@ -1,18 +1,18 @@
 export const emotions = [
   {
-    name: 'angry',
-    emoji: '😡',
+    name: 'cry',
+    emoji: '😭',
   },
   {
     name: 'sad',
-    emoji: '🙁',
+    emoji: '😕',
   },
   {
     name: 'happy',
     emoji: '🙂',
   },
   {
-    name: 'ecstatic',
-    emoji: '😍',
+    name: 'amazed',
+    emoji: '🤩',
   },
 ];