Merge pull request #112 from liam-hq/setup-fumadocs

feat: setup fumadocs

frontend/apps/docs/.eslintrc.json

@@ -0,0 +1,3 @@
+{
+  "extends": ["next/core-web-vitals", "next/typescript"]
+}

frontend/apps/docs/.gitignore

@@ -0,0 +1,28 @@
+# deps
+/node_modules
+
+# generated content
+.contentlayer
+.content-collections
+.source
+
+# test & build
+/coverage
+/.next/
+/out/
+/build
+*.tsbuildinfo
+
+# misc
+.DS_Store
+*.pem
+/.pnp
+.pnp.js
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# others
+.env*.local
+.vercel
+next-env.d.ts

frontend/apps/docs/README.md

@@ -0,0 +1,26 @@
+# docs
+
+This is a Next.js application generated with
+[Create Fumadocs](https://github.com/fuma-nama/fumadocs).
+
+Run development server:
+
+```bash
+npm run dev
+# or
+pnpm dev
+# or
+yarn dev
+```
+
+Open http://localhost:3000 with your browser to see the result.
+
+## Learn More
+
+To learn more about Next.js and Fumadocs, take a look at the following
+resources:
+
+- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js
+  features and API.
+- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
+- [Fumadocs](https://fumadocs.vercel.app) - learn about Fumadocs

frontend/apps/docs/app/(home)/layout.tsx

@@ -0,0 +1,11 @@
+import { baseOptions } from '@/app/layout.config'
+import { HomeLayout } from 'fumadocs-ui/layouts/home'
+import type { ReactElement, ReactNode } from 'react'
+
+export default function Layout({
+  children,
+}: {
+  children: ReactNode
+}): ReactElement {
+  return <HomeLayout {...baseOptions}>{children}</HomeLayout>
+}

frontend/apps/docs/app/(home)/page.tsx

@@ -0,0 +1,38 @@
+import Link from 'next/link'
+
+export default function HomePage() {
+  return (
+    <main
+      style={{
+        flex: 1,
+        display: 'flex',
+        flexDirection: 'column',
+        textAlign: 'center',
+        justifyContent: 'center',
+      }}
+    >
+      <h1
+        style={{
+          fontSize: '2rem',
+          fontWeight: 'bold',
+          marginBottom: '1rem',
+        }}
+      >
+        Hello World
+      </h1>
+      <p>
+        You can open{' '}
+        <Link
+          href="/docs"
+          style={{
+            fontWeight: '600',
+            textDecoration: 'underline',
+          }}
+        >
+          /docs
+        </Link>{' '}
+        and see the documentation.
+      </p>
+    </main>
+  )
+}

frontend/apps/docs/app/api/search/route.ts

@@ -0,0 +1,4 @@
+import { source } from '@/lib/source'
+import { createFromSource } from 'fumadocs-core/search/server'
+
+export const { GET } = createFromSource(source)

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

@@ -0,0 +1,46 @@
+import { source } from '@/lib/source'
+import defaultMdxComponents from 'fumadocs-ui/mdx'
+import {
+  DocsBody,
+  DocsDescription,
+  DocsPage,
+  DocsTitle,
+} from 'fumadocs-ui/page'
+import { notFound } from 'next/navigation'
+
+export default async function Page(props: {
+  params: Promise<{ slug?: string[] }>
+}) {
+  const params = await props.params
+  const page = source.getPage(params.slug)
+  if (!page) notFound()
+
+  const MDX = page.data.body
+
+  return (
+    <DocsPage toc={page.data.toc} full={page.data.full}>
+      <DocsTitle>{page.data.title}</DocsTitle>
+      <DocsDescription>{page.data.description}</DocsDescription>
+      <DocsBody>
+        <MDX components={{ ...defaultMdxComponents }} />
+      </DocsBody>
+    </DocsPage>
+  )
+}
+
+export async function generateStaticParams() {
+  return source.generateParams()
+}
+
+export async function generateMetadata(props: {
+  params: Promise<{ slug?: string[] }>
+}) {
+  const params = await props.params
+  const page = source.getPage(params.slug)
+  if (!page) notFound()
+
+  return {
+    title: page.data.title,
+    description: page.data.description,
+  }
+}

frontend/apps/docs/app/docs/layout.tsx

@@ -0,0 +1,12 @@
+import { baseOptions } from '@/app/layout.config'
+import { source } from '@/lib/source'
+import { DocsLayout } from 'fumadocs-ui/layouts/docs'
+import type { ReactNode } from 'react'
+
+export default function Layout({ children }: { children: ReactNode }) {
+  return (
+    <DocsLayout tree={source.pageTree} {...baseOptions}>
+      {children}
+    </DocsLayout>
+  )
+}

frontend/apps/docs/app/layout.config.tsx

@@ -0,0 +1,21 @@
+import type { BaseLayoutProps } from 'fumadocs-ui/layouts/shared'
+
+/**
+ * Shared layout configurations
+ *
+ * you can configure layouts individually from:
+ * Home Layout: app/(home)/layout.tsx
+ * Docs Layout: app/docs/layout.tsx
+ */
+export const baseOptions: BaseLayoutProps = {
+  nav: {
+    title: 'My App',
+  },
+  links: [
+    {
+      text: 'Documentation',
+      url: '/docs',
+      active: 'nested-url',
+    },
+  ],
+}

frontend/apps/docs/app/layout.tsx

@@ -0,0 +1,24 @@
+import { RootProvider } from 'fumadocs-ui/provider'
+import 'fumadocs-ui/style.css'
+import { Inter } from 'next/font/google'
+import type { ReactNode } from 'react'
+
+const inter = Inter({
+  subsets: ['latin'],
+})
+
+export default function Layout({ children }: { children: ReactNode }) {
+  return (
+    <html lang="en" className={inter.className} suppressHydrationWarning>
+      <body
+        style={{
+          display: 'flex',
+          flexDirection: 'column',
+          minHeight: '100vh',
+        }}
+      >
+        <RootProvider>{children}</RootProvider>
+      </body>
+    </html>
+  )
+}

frontend/apps/docs/biome.jsonc

@@ -0,0 +1,3 @@
+{
+  "extends": ["../../packages/configs/biome.jsonc"]
+}

frontend/apps/docs/content/docs/index.mdx

@@ -0,0 +1,13 @@
+---
+title: Hello World
+description: Your first document
+---
+
+Welcome to the docs! You can start writing documents in `/content/docs`.
+
+## What is Next?
+
+<Cards>
+  <Card title="Learn more about Next.js" href="https://nextjs.org/docs" />
+  <Card title="Learn more about Fumadocs" href="https://fumadocs.vercel.app" />
+</Cards>

frontend/apps/docs/content/docs/test.mdx

@@ -0,0 +1,17 @@
+---
+title: Components
+description: Components
+---
+
+## Code Block
+
+```js
+console.log('Hello World');
+```
+
+## Cards
+
+<Cards>
+  <Card title="Learn more about Next.js" href="https://nextjs.org/docs" />
+  <Card title="Learn more about Fumadocs" href="https://fumadocs.vercel.app" />
+</Cards>

frontend/apps/docs/lib/source.ts

@@ -0,0 +1,8 @@
+import { docs, meta } from '@/.source'
+import { loader } from 'fumadocs-core/source'
+import { createMDXSource } from 'fumadocs-mdx'
+
+export const source = loader({
+  baseUrl: '/docs',
+  source: createMDXSource(docs, meta),
+})

frontend/apps/docs/next.config.mjs

@@ -0,0 +1,10 @@
+import { createMDX } from 'fumadocs-mdx/next'
+
+const withMDX = createMDX()
+
+/** @type {import('next').NextConfig} */
+const config = {
+  reactStrictMode: true,
+}
+
+export default withMDX(config)

frontend/apps/docs/package.json

@@ -0,0 +1,35 @@
+{
+  "name": "@liam/docs",
+  "private": true,
+  "version": "0.0.0",
+  "dependencies": {
+    "fumadocs-core": "14.5.4",
+    "fumadocs-mdx": "11.1.2",
+    "fumadocs-ui": "14.5.4",
+    "next": "15.0.3",
+    "react": "18",
+    "react-dom": "18"
+  },
+  "devDependencies": {
+    "@biomejs/biome": "1.9.3",
+    "@types/mdx": "2.0.13",
+    "@types/node": "22.9.0",
+    "@types/react": "18",
+    "@types/react-dom": "18",
+    "eslint": "8",
+    "eslint-config-next": "15.0.3",
+    "typescript": "5"
+  },
+  "scripts": {
+    "build": "next build",
+    "dev": "next dev",
+    "fmt": "pnpm run '/^fmt:.*/'",
+    "fmt:biome": "biome check --write --unsafe .",
+    "lint": "pnpm run '/^lint:.*/'",
+    "lint:biome": "biome check .",
+    "lint:next": "next lint",
+    "lint:tsc": "tsc --noEmit",
+    "postinstall": "fumadocs-mdx",
+    "start": "next start"
+  }
+}

frontend/apps/docs/source.config.ts

@@ -0,0 +1,7 @@
+import { defineConfig, defineDocs } from 'fumadocs-mdx/config'
+
+export const { docs, meta } = defineDocs({
+  dir: 'content/docs',
+})
+
+export default defineConfig()

frontend/apps/docs/tsconfig.json

@@ -0,0 +1,29 @@
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "target": "ESNext",
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "strict": true,
+    "forceConsistentCasingInFileNames": true,
+    "noEmit": true,
+    "esModuleInterop": true,
+    "module": "esnext",
+    "moduleResolution": "bundler",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "jsx": "preserve",
+    "incremental": true,
+    "paths": {
+      "@/*": ["./*"]
+    },
+    "plugins": [
+      {
+        "name": "next"
+      }
+    ]
+  },
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
+  "exclude": ["node_modules"]
+}