Initialize fumadocs documentation site in apps/docs #27
Conversation
Co-authored-by: hotlong <50353452+hotlong@users.noreply.github.com>
There was a problem hiding this comment.
Pull request overview
This PR initializes a fumadocs-based documentation site within the HotCRM monorepo at apps/docs. The documentation is built on Next.js 16.1.4 with MDX support, providing a modern, searchable documentation platform with AI-friendly features like LLM text endpoints.
Changes:
- Added
apps/*workspace topnpm-workspace.yamland created the@hotcrm/docspackage - Initialized fumadocs documentation framework with TypeScript, Tailwind CSS 4, and React 19
- Configured development and build scripts in root
package.jsonfor easy access to docs commands
Reviewed changes
Copilot reviewed 27 out of 28 changed files in this pull request and generated 5 comments.
Show a summary per file
| File | Description |
|---|---|
| pnpm-workspace.yaml | Added apps/* to workspace packages for docs app |
| package.json | Added dev:docs and build:docs scripts for documentation site |
| apps/docs/tsconfig.json | TypeScript configuration with Next.js plugin and strict mode |
| apps/docs/source.config.ts | Fumadocs MDX configuration for content processing |
| apps/docs/postcss.config.mjs | PostCSS configuration for Tailwind CSS 4 |
| apps/docs/package.json | Package dependencies including Next.js 16, fumadocs, and Tailwind CSS 4 |
| apps/docs/next.config.mjs | Next.js configuration with MDX support and LLM content rewrites |
| apps/docs/mdx-components.tsx | MDX component configuration integrating fumadocs UI components |
| apps/docs/lib/source.ts | Content source adapter with page metadata and LLM text utilities |
| apps/docs/lib/layout.shared.tsx | Shared layout configuration for documentation navigation |
| apps/docs/lib/cn.ts | Utility for Tailwind CSS class merging |
| apps/docs/content/docs/test.mdx | Sample MDX documentation with components demonstration |
| apps/docs/content/docs/index.mdx | Documentation homepage with welcome content |
| apps/docs/components/ai/page-actions.tsx | AI-powered page actions for copying markdown and opening in AI tools |
| apps/docs/app/og/docs/[...slug]/route.tsx | Dynamic Open Graph image generation for documentation pages |
| apps/docs/app/llms.txt/route.ts | LLM-friendly documentation index endpoint |
| apps/docs/app/llms.mdx/docs/[[...slug]]/route.ts | Individual page markdown endpoint for LLM access |
| apps/docs/app/llms-full.txt/route.ts | Full documentation export endpoint for LLMs |
| apps/docs/app/layout.tsx | Root layout with Inter font and fumadocs provider |
| apps/docs/app/global.css | Global styles importing Tailwind and fumadocs themes |
| apps/docs/app/docs/layout.tsx | Documentation layout with navigation tree |
| apps/docs/app/docs/[[...slug]]/page.tsx | Dynamic documentation page component with metadata generation |
| apps/docs/app/api/search/route.ts | Search API endpoint using Orama search engine |
| apps/docs/app/(home)/page.tsx | Documentation site homepage |
| apps/docs/app/(home)/layout.tsx | Homepage layout configuration |
| apps/docs/README.md | Documentation site setup and usage instructions |
| apps/docs/.gitignore | Git ignore rules for Next.js and fumadocs artifacts |
| export function baseOptions(): BaseLayoutProps { | ||
| return { | ||
| nav: { | ||
| title: 'My App', |
There was a problem hiding this comment.
The navigation title is set to the generic placeholder "My App" instead of "HotCRM". This should be updated to match the project branding.
| title: 'My App', | |
| title: 'HotCRM', |
| if (!page) notFound(); | ||
|
|
||
| return new ImageResponse( | ||
| <DefaultImage title={page.data.title} description={page.data.description} site="My App" />, |
There was a problem hiding this comment.
The site name in the Open Graph image is set to the generic placeholder "My App" instead of "HotCRM". This should be updated to match the project branding for consistent social media previews.
| const gitConfig = { | ||
| user: 'username', | ||
| repo: 'repo', | ||
| branch: 'main', | ||
| }; | ||
|
|
||
| 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"> | ||
| <LLMCopyButton markdownUrl={`${page.url}.mdx`} /> | ||
| <ViewOptions | ||
| markdownUrl={`${page.url}.mdx`} | ||
| // update it to match your repo | ||
| githubUrl={`https://github.com/${gitConfig.user}/${gitConfig.repo}/blob/${gitConfig.branch}/docs/content/docs/${page.path}`} |
There was a problem hiding this comment.
The git configuration uses placeholder values ('username', 'repo') instead of the actual repository information. Based on the repository badges in README.md, this should be updated to use 'hotcrm' for both user and repo. Additionally, the GitHub URL path is incorrect - it should be 'apps/docs/content/docs' instead of 'docs/content/docs' to match the actual file structure in this monorepo.
| npm run dev | ||
| # or | ||
| pnpm dev | ||
| # or | ||
| yarn dev |
There was a problem hiding this comment.
The README suggests running 'npm run dev' as the first option, but this is a pnpm monorepo (as indicated by pnpm-workspace.yaml and the root package.json's engines field requiring pnpm >= 9.0.0). The documentation should prioritize pnpm commands or remove npm/yarn alternatives to avoid confusion, especially since the monorepo structure requires pnpm workspace features.
| npm run dev | |
| # or | |
| pnpm dev | |
| # or | |
| yarn dev | |
| pnpm dev |
| const [checked, onClick] = useCopyButton(async () => { | ||
| const cached = cache.get(markdownUrl); | ||
| if (cached) return navigator.clipboard.writeText(cached); | ||
|
|
||
| setLoading(true); | ||
|
|
||
| try { | ||
| await navigator.clipboard.write([ | ||
| new ClipboardItem({ | ||
| 'text/plain': fetch(markdownUrl).then(async (res) => { | ||
| const content = await res.text(); | ||
| cache.set(markdownUrl, content); | ||
|
|
||
| return content; | ||
| }), | ||
| }), | ||
| ]); | ||
| } finally { | ||
| setLoading(false); | ||
| } | ||
| }); |
There was a problem hiding this comment.
The fetch call in the clipboard copy function doesn't include error handling. If the fetch fails (e.g., network error, 404), the promise will reject but the error won't be caught, potentially leaving the loading state stuck. Consider wrapping the entire try block to handle fetch errors and provide user feedback.
Description
Adds fumadocs-based documentation site to the monorepo at
apps/docs. Documentation built on Next.js 16 with MDX support, search, and Tailwind CSS styling.Type of Change
Changes Made
apps/directory and updatedpnpm-workspace.yamlto includeapps/*pnpm create fumadocs-appatapps/docs@hotcrm/docsfollowing monorepo naming conventiondev:docsandbuild:docsscripts to rootpackage.jsoncontent/docs/with proper frontmatter and configurationTesting
npm test)npm run lint)npm run build) - requires network access to Google Fonts in CIScreenshots
N/A - Documentation infrastructure only
Checklist
Additional Notes
The docs site uses:
Start dev server:
pnpm dev:docsContent location:
apps/docs/content/docs/*.mdxBuild may fail in restricted network environments due to Google Fonts dependency in layout.tsx.
Warning
Firewall rules blocked me from connecting to one or more addresses (expand for details)
I tried to connect to the following addresses, but was blocked by firewall rules:
fonts.googleapis.com/usr/local/bin/node node /home/REDACTED/work/hotcrm/hotcrm/apps/docs/node_modules/.bin/../next/dist/bin/next build(dns block)If you need me to access, download, or install something from one of these locations, you can either:
Original prompt
✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.