docs: add fumadocs documentation site (#142)

docs/src/app/[lang]/(docs)/[[...slug]]/page.tsx

@@ -0,0 +1,67 @@
+import { getPageImage, source } from '@/lib/source';
+import { DocsBody, DocsDescription, DocsPage, DocsTitle } from 'fumadocs-ui/layouts/docs/page';
+import { notFound } from 'next/navigation';
+import { getMDXComponents } from '@/mdx-components';
+import type { Metadata } from 'next';
+import { createRelativeLink } from 'fumadocs-ui/mdx';
+import { GitHubEditButton, LLMCopyButton, ViewOptions } from '@/components/ai/page-actions';
+
+export default async function Page(props: PageProps<'/[lang]/[[...slug]]'>) {
+  const params = await props.params;
+  const page = source.getPage(params.slug, params.lang);
+  if (!page) notFound();
+
+  const MDX = page.data.body;
+  const gitConfig = {
+    user: 'nexmoe',
+    repo: 'VidBee',
+    branch: 'main',
+  };
+
+  const githubFilePath = `docs/content/${page.path}`;
+  const githubBlobUrl = `https://github.com/${gitConfig.user}/${gitConfig.repo}/blob/${gitConfig.branch}/${githubFilePath}`;
+  const githubEditUrl = `https://github.com/${gitConfig.user}/${gitConfig.repo}/edit/${gitConfig.branch}/${githubFilePath}`;
+
+  return (
+    <DocsPage toc={page.data.toc} full={page.data.full}>
+      <DocsTitle>{page.data.title}</DocsTitle>
+      <DocsDescription className="mb-0">{page.data.description}</DocsDescription>
+      <div className="flex flex-row gap-2 items-center border-b pb-6">
+        <GitHubEditButton href={githubEditUrl} />
+        <LLMCopyButton markdownUrl={`${page.url}.mdx`} />
+        <ViewOptions
+          markdownUrl={`${page.url}.mdx`}
+          githubUrl={githubBlobUrl}
+        />
+      </div>
+      <DocsBody>
+        <MDX
+          components={getMDXComponents({
+            // this allows you to link to other pages with relative file paths
+            a: createRelativeLink(source, page),
+          })}
+        />
+      </DocsBody>
+    </DocsPage>
+  );
+}
+
+export async function generateStaticParams() {
+  return source.generateParams();
+}
+
+export async function generateMetadata(
+  props: PageProps<'/[lang]/[[...slug]]'>,
+): Promise<Metadata> {
+  const params = await props.params;
+  const page = source.getPage(params.slug, params.lang);
+  if (!page) notFound();
+
+  return {
+    title: page.data.title,
+    description: page.data.description,
+    openGraph: {
+      images: getPageImage(page).url,
+    },
+  };
+}

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

@@ -0,0 +1,16 @@
+import { source } from '@/lib/source';
+import { DocsLayout } from 'fumadocs-ui/layouts/docs';
+import { baseOptions } from '@/lib/layout.shared';
+
+export default async function Layout({
+  children,
+  params,
+}: LayoutProps<'/[lang]/[[...slug]]'>) {
+  const resolvedParams = await params;
+  const locale = resolvedParams.lang;
+  return (
+    <DocsLayout tree={source.getPageTree(locale)} {...baseOptions(locale)}>
+      {children}
+    </DocsLayout>
+  );
+}

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

@@ -0,0 +1,28 @@
+import type { ReactNode } from 'react';
+import { RootProvider } from 'fumadocs-ui/provider/next';
+import { defineI18nUI } from 'fumadocs-ui/i18n';
+import { i18n, isLocale } from '@/lib/i18n';
+
+const { provider } = defineI18nUI(i18n, {
+  translations: {
+    en: {
+      displayName: 'English',
+    },
+    zh: {
+      displayName: '中文',
+    },
+  },
+});
+
+export default async function Layout({
+  children,
+  params,
+}: {
+  children: ReactNode;
+  params: Promise<{ lang: string }>;
+}) {
+  const { lang } = await params;
+  const locale = isLocale(lang) ? lang : i18n.defaultLanguage;
+
+  return <RootProvider i18n={provider(locale)}>{children}</RootProvider>;
+}

docs/src/app/api/search/route.ts

@@ -0,0 +1,7 @@
+import { source } from '@/lib/source';
+import { createFromSource } from 'fumadocs-core/search/server';
+
+export const { GET } = createFromSource(source, {
+  // https://docs.orama.com/docs/orama-js/supported-languages
+  language: 'english',
+});

docs/src/app/global.css

@@ -0,0 +1,3 @@
+@import 'tailwindcss';
+@import 'fumadocs-ui/css/neutral.css';
+@import 'fumadocs-ui/css/preset.css';

docs/src/app/layout.tsx

@@ -0,0 +1,26 @@
+import './global.css';
+import { Inter } from 'next/font/google';
+import type { ReactNode } from 'react';
+import { i18n, isLocale } from '@/lib/i18n';
+
+const inter = Inter({
+  subsets: ['latin'],
+});
+
+export default async function Layout({
+  children,
+  params,
+}: {
+  children: ReactNode;
+  params?: Promise<{ lang?: string }>;
+}) {
+  const resolvedParams = params ? await params : undefined;
+  const lang = isLocale(resolvedParams?.lang) ? resolvedParams.lang : i18n.defaultLanguage;
+  return (
+    <html lang={lang} className={inter.className} suppressHydrationWarning>
+      <body className="flex flex-col min-h-screen">
+        {children}
+      </body>
+    </html>
+  );
+}

docs/src/app/llms-full.txt/route.ts

@@ -0,0 +1,10 @@
+import { getLLMText, source } from '@/lib/source';
+
+export const revalidate = false;
+
+export async function GET() {
+  const scan = source.getPages().map(getLLMText);
+  const scanned = await Promise.all(scan);
+
+  return new Response(scanned.join('\n\n'));
+}

docs/src/app/llms.mdx/[[...slug]]/route.ts

@@ -0,0 +1,27 @@
+import { i18n, resolveLocaleFromSlug, stripLocaleFromSlug } from '@/lib/i18n';
+import { getLLMText, source } from '@/lib/source';
+import { notFound } from 'next/navigation';
+
+export const revalidate = false;
+
+export async function GET(_req: Request, { params }: RouteContext<'/llms.mdx/[[...slug]]'>) {
+  const { slug } = await params;
+  const locale = resolveLocaleFromSlug(slug);
+  const slugs = stripLocaleFromSlug(slug);
+  const page = source.getPage(slugs, locale);
+  if (!page) notFound();
+
+  return new Response(await getLLMText(page), {
+    headers: {
+      'Content-Type': 'text/markdown',
+    },
+  });
+}
+
+export function generateStaticParams() {
+  return source.getLanguages().flatMap(({ language, pages }) =>
+    pages.map((page) => ({
+      slug: language === i18n.defaultLanguage ? page.slugs : [language, ...page.slugs],
+    })),
+  );
+}

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

@@ -0,0 +1,30 @@
+import { resolveLocaleFromSlug, stripLocaleFromSlug } from '@/lib/i18n';
+import { getPageImage, source } from '@/lib/source';
+import { notFound } from 'next/navigation';
+import { ImageResponse } from 'next/og';
+import { generate as DefaultImage } from 'fumadocs-ui/og';
+
+export const revalidate = false;
+
+export async function GET(_req: Request, { params }: RouteContext<'/og/docs/[...slug]'>) {
+  const { slug } = await params;
+  const pageSlug = slug.slice(0, -1);
+  const locale = resolveLocaleFromSlug(pageSlug);
+  const slugs = stripLocaleFromSlug(pageSlug);
+  const page = source.getPage(slugs, locale);
+  if (!page) notFound();
+
+  return new ImageResponse(
+    <DefaultImage title={page.data.title} description={page.data.description} site="VidBee" />,
+    {
+      width: 1200,
+      height: 630,
+    },
+  );
+}
+
+export function generateStaticParams() {
+  return source.getPages().map((page) => ({
+    slug: getPageImage(page).segments,
+  }));
+}