Conversation
WalkthroughIntroduces a new documentation package at Changes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes
🚥 Pre-merge checks | ✅ 2 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing touches
🧪 Generate unit tests (beta)
Tip Issue Planner is now in beta. Read the docs and try it out! Share your feedback on Discord. Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
|
@coderabbitai review |
✅ Actions performedReview triggered.
|
There was a problem hiding this comment.
Actionable comments posted: 14
📜 Review details
Configuration used: CodeRabbit UI
Review profile: ASSERTIVE
Plan: Pro
⛔ Files ignored due to path filters (1)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (20)
packages/docs/.gitignore(1 hunks)packages/docs/README.md(1 hunks)packages/docs/content/docs/index.mdx(1 hunks)packages/docs/eslint.config.mjs(1 hunks)packages/docs/next.config.mjs(1 hunks)packages/docs/package.json(1 hunks)packages/docs/postcss.config.mjs(1 hunks)packages/docs/source.config.ts(1 hunks)packages/docs/src/app/(home)/layout.tsx(1 hunks)packages/docs/src/app/(home)/page.tsx(1 hunks)packages/docs/src/app/api/search/route.ts(1 hunks)packages/docs/src/app/docs/[[...slug]]/page.tsx(1 hunks)packages/docs/src/app/docs/layout.tsx(1 hunks)packages/docs/src/app/global.css(1 hunks)packages/docs/src/app/layout.tsx(1 hunks)packages/docs/src/app/og/docs/[...slug]/route.tsx(1 hunks)packages/docs/src/lib/layout.shared.tsx(1 hunks)packages/docs/src/lib/source.ts(1 hunks)packages/docs/src/mdx-components.tsx(1 hunks)packages/docs/tsconfig.json(1 hunks)
🧰 Additional context used
🧬 Code graph analysis (5)
packages/docs/src/app/(home)/layout.tsx (1)
packages/docs/src/lib/layout.shared.tsx (1)
baseOptions(10-25)
packages/docs/src/lib/source.ts (1)
packages/docs/source.config.ts (1)
docs(5-12)
packages/docs/src/app/docs/layout.tsx (2)
packages/docs/src/lib/source.ts (1)
source(9-13)packages/docs/src/lib/layout.shared.tsx (1)
baseOptions(10-25)
packages/docs/src/app/og/docs/[...slug]/route.tsx (2)
packages/docs/src/lib/source.ts (2)
source(9-13)getPageImage(15-22)packages/docs/src/app/docs/[[...slug]]/page.tsx (1)
generateStaticParams(10-12)
packages/docs/src/app/docs/[[...slug]]/page.tsx (3)
packages/docs/src/app/og/docs/[...slug]/route.tsx (1)
generateStaticParams(23-28)packages/docs/src/lib/source.ts (2)
source(9-13)getPageImage(15-22)packages/docs/src/mdx-components.tsx (1)
getMDXComponents(8-15)
🪛 Biome (2.1.2)
packages/docs/src/lib/layout.shared.tsx
[error] 15-15: Alternative text title element cannot be empty
For accessibility purposes, SVGs should have an alternative text, provided via title element. If the svg element has role="img", you should add the aria-label or aria-labelledby attribute.
(lint/a11y/noSvgWithoutTitle)
🔇 Additional comments (16)
packages/docs/src/mdx-components.tsx (1)
8-15: LGTM!The component aggregation pattern is well-structured with the correct spread order. Custom components passed as arguments will properly override the default, Twoslash, and Tabs components, which is the expected behavior.
packages/docs/src/app/global.css (1)
1-4: LGTM!The CSS import structure correctly uses Tailwind CSS v4's new import syntax and properly integrates Fumadocs styling. The import order establishes the appropriate cascade for theme overrides.
packages/docs/postcss.config.mjs (1)
1-5: LGTM!The PostCSS configuration correctly integrates Tailwind CSS v4 using the
@tailwindcss/postcssplugin. The empty configuration object uses default settings, which is appropriate for standard setups.packages/docs/eslint.config.mjs (2)
11-11: Verify the meta name for this configuration.The meta name is set to
@mock-config-server/docs/rewrites, which references "rewrites" despite this being an ESLint configuration. This may be a copy-paste artifact or placeholder.Consider updating to a more descriptive name:
- name: '@mock-config-server/docs/rewrites', + name: '@mock-config-server/docs/eslint-overrides',
3-16: Configuration is appropriate for the docs package.The ESLint setup correctly enables TypeScript, React, JSX, and Next.js support. The
ts/ban-ts-commentrule set to 'warn' provides a reasonable balance between strictness and flexibility during development.packages/docs/.gitignore (1)
1-28: LGTM!The gitignore file provides comprehensive coverage for a Next.js documentation project, including build artifacts, dependencies, environment files, and content generation outputs specific to Fumadocs tooling.
packages/docs/tsconfig.json (1)
1-30: TypeScript configuration is well-structured for Next.js 15.The configuration correctly uses:
moduleResolution: "bundler"for Next.js 15 compatibility- Strict type checking with appropriate compiler options
- Path mappings for source organization
- Next.js TypeScript plugin integration
The
noEmit: truesetting is appropriate since Next.js handles the build process.packages/docs/package.json (1)
21-23: The React 19 compatibility is confirmed. Both fumadocs-ui 15.8.2 and fumadocs-core 15.8.2 are compatible with React 19, and Next.js 15.5.4 supports React 19. No action required.packages/docs/source.config.ts (1)
1-26: LGTM!The fumadocs configuration is well-structured:
- Proper schema definitions for frontmatter and meta
- Comprehensive language support for code blocks
- Light/dark theme support with GitHub themes
- Twoslash integration for enhanced TypeScript examples
- Git-based last modified time tracking
packages/docs/src/app/docs/layout.tsx (1)
1-12: Layout structure looks good.The DocsLayout integration with page tree and shared base options is well-organized. The separation of concerns between source configuration and layout options follows fumadocs patterns.
packages/docs/next.config.mjs (1)
8-8: Verify built-in search is prebuilt and configured for static mode.Fumadocs supports static export with
output: 'export', but if using the built-in Orama search, it must be prebuilt and explicitly set to static mode in the RootProvider. Cloud-based search has no such requirement. Navigation works without additional configuration.packages/docs/src/app/(home)/layout.tsx (1)
1-9: LGTM!Clean integration with fumadocs-ui's HomeLayout and proper use of Next.js 15.5's globally available
LayoutPropstype. The component correctly composes shared layout options.packages/docs/src/app/api/search/route.ts (1)
1-6: LGTM!Clean search API implementation using fumadocs-core. The
revalidate = falsesetting is consistent with the static generation approach used throughout this docs package.packages/docs/src/lib/layout.shared.tsx (1)
10-25: Well-structured shared layout configuration.The
baseOptions()function provides a clean, centralized configuration for both Home and Docs layouts. The inline documentation and fumadocs reference link are helpful.packages/docs/src/lib/source.ts (1)
1-30: LGTM!Excellent source utilities module. The implementation correctly:
- Configures the fumadocs loader with the lucide icons plugin
- Provides helper functions for OG image URL generation
- Includes an LLM-friendly text extraction utility
The code is clean, well-organized, and follows fumadocs patterns.
packages/docs/src/app/docs/[[...slug]]/page.tsx (1)
1-51: LGTM!Excellent Next.js 15 App Router page implementation. The code correctly:
- Uses async params access as required by Next.js 15
- Implements static generation with
generateStaticParams- Generates proper metadata including Open Graph images
- Handles missing pages with
notFound()- Customizes MDX components for relative linking
- Integrates fumadocs-ui components properly
The implementation follows Next.js 15 best practices and fumadocs patterns.
| --- | ||
| title: Introduction | ||
| description: Welcome | ||
| --- |
There was a problem hiding this comment.
🧹 Nitpick | 🔵 Trivial
Consider enhancing the frontmatter description.
The description "Welcome" is minimal and may not be optimal for SEO or when the page appears in search results.
---
title: Introduction
-description: Welcome
+description: Get started with Mock Config Server - a tool for mocking API configurations
---📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| --- | |
| title: Introduction | |
| description: Welcome | |
| --- | |
| --- | |
| title: Introduction | |
| description: Get started with Mock Config Server - a tool for mocking API configurations | |
| --- |
🤖 Prompt for AI Agents
In packages/docs/content/docs/index.mdx lines 1-4, the frontmatter description
is too short ("Welcome"); replace it with a more descriptive, SEO-friendly
summary of the page (2–3 concise sentences or a clear phrase describing the
documentation content and main value) that includes relevant keywords and intent
to improve search snippets and UX.
| ```package-install | ||
| my-package | ||
| ``` |
There was a problem hiding this comment.
Update placeholder package name.
The package-install block contains a placeholder my-package that should be replaced with the actual package name for this project.
```package-install
-my-package
+mock-config-server
<details>
<summary>🤖 Prompt for AI Agents</summary>
In packages/docs/content/docs/index.mdx around lines 15 to 17, the
package-install code block uses a placeholder package name "my-package"; replace
it with the project's actual package name "mock-config-server" so the example
installs the correct package and update any surrounding text if it references
the old placeholder.
</details>
<!-- fingerprinting:phantom:medusa:ocelot -->
<!-- This is an auto-generated comment by CodeRabbit -->
| import { RootProvider } from 'fumadocs-ui/provider/next'; | ||
| import { Mulish } from 'next/font/google'; | ||
|
|
||
| import './global.css'; | ||
|
|
||
| const mulish = Mulish({ | ||
| weight: ['400', '500', '700'], | ||
| subsets: ['latin'] | ||
| }); | ||
|
|
||
| const Layout = ({ children }: LayoutProps<'/'>) => ( | ||
| <html className={mulish.className} lang='en' suppressHydrationWarning> | ||
| <body className='flex flex-col min-h-screen'> | ||
| <RootProvider>{children}</RootProvider> | ||
| </body> | ||
| </html> | ||
| ); |
There was a problem hiding this comment.
🧹 Nitpick | 🔵 Trivial
Consider adding metadata export for SEO.
Root layouts in Next.js App Router typically export metadata for SEO purposes.
Consider adding a metadata export:
import type { Metadata } from 'next';
export const metadata: Metadata = {
title: 'Mock Config Server Docs',
description: 'Documentation for Mock Config Server',
};🤖 Prompt for AI Agents
In packages/docs/src/app/layout.tsx around lines 1 to 17, the root layout lacks
an exported metadata object for SEO; add an exported const named metadata typed
as Next's Metadata that includes title and description (and any other relevant
SEO fields) so the App Router can use it for page metadata — import the Metadata
type from 'next' and export the metadata object at module scope with values like
the site title and description.
| subsets: ['latin'] | ||
| }); | ||
|
|
||
| const Layout = ({ children }: LayoutProps<'/'>) => ( |
There was a problem hiding this comment.
Missing import for LayoutProps type.
LayoutProps<'/'> is used but not imported, which will cause a TypeScript compilation error.
Apply this diff to fix the missing import:
import { RootProvider } from 'fumedocs-ui/provider/next';
import { Mulish } from 'next/font/google';
+import type { LayoutProps } from 'fumadocs-core/types';
import './global.css';Alternatively, if this is intended to be a standard Next.js layout, use the built-in typing:
-const Layout = ({ children }: LayoutProps<'/'>) => (
+const Layout = ({ children }: { children: React.ReactNode }) => (Committable suggestion skipped: line range outside the PR's diff.
🤖 Prompt for AI Agents
In packages/docs/src/app/layout.tsx around line 11, the code uses
LayoutProps<'/'> but does not import the type; add a top-level import for
LayoutProps (e.g., import type { LayoutProps } from 'next') or replace the
explicit type with the built-in Next.js layout typing approach so the TypeScript
compiler recognizes the type.
| export function generateStaticParams() { | ||
| return source.getPages().map((page) => ({ | ||
| lang: page.locale, | ||
| slug: getPageImage(page).segments | ||
| })); | ||
| } |
There was a problem hiding this comment.
🧩 Analysis chain
🏁 Script executed:
#!/bin/bash
# Check for locale/i18n configuration and page type definitions
echo "=== Checking source configuration files ==="
find packages/docs -name "source.config.*" -o -name "source.ts" | head -20
echo ""
echo "=== Searching for locale/i18n references ==="
rg -n "locale|i18n|language" packages/docs/src/lib/ --type ts --type tsx 2>/dev/null | head -30
echo ""
echo "=== Checking fumadocs imports and types ==="
rg -n "fumadocs|InferPageType" packages/docs/src -B 2 -A 2 --type ts --type tsx 2>/dev/null | head -40
echo ""
echo "=== Looking at the route file context ==="
head -35 packages/docs/src/app/og/docs/\[...\]slug\]/route.tsx 2>/dev/null || find packages/docs -path "*og/docs*route.tsx" -exec head -35 {} \;Repository: siberiacancode/mock-config
Length of output: 1079
🏁 Script executed:
#!/bin/bash
# Read source configuration and type definitions
echo "=== Content of source.config.ts ==="
cat packages/docs/source.config.ts
echo ""
echo "=== Content of source.ts ==="
cat packages/docs/src/lib/source.ts
echo ""
echo "=== Check for locale in route parameters ==="
rg -n "lang:" packages/docs/src -A 2 -B 2 --type ts --type tsxRepository: siberiacancode/mock-config
Length of output: 1727
🏁 Script executed:
#!/bin/bash
# Check full route file and locale references
echo "=== Full route file content ==="
find packages/docs -path "*/og/docs/*route.tsx" -exec cat {} \;
echo ""
echo "=== Search for locale anywhere in packages/docs ==="
rg -n "locale" packages/docs --type ts 2>/dev/null || rg -n "locale" packages/docs 2>/dev/null | head -20
echo ""
echo "=== Check package.json for fumadocs version ==="
rg -n "fumadocs" packages/docs/package.jsonRepository: siberiacancode/mock-config
Length of output: 1222
Remove page.locale access or add i18n configuration.
The generateStaticParams function accesses page.locale on line 25, but this property does not exist on the page type. The fumadocs configuration has no multi-language setup, and locale is not provided by fumadocs-core without explicit i18n configuration. This will result in lang: undefined in the returned parameters.
Either remove the lang property if the app doesn't support multiple languages, or configure fumadocs with i18n support and ensure pages have locale data.
🤖 Prompt for AI Agents
In packages/docs/src/app/og/docs/[...slug]/route.tsx around lines 23 to 28, the
generateStaticParams call reads page.locale which does not exist in the current
fumadocs config and yields lang: undefined; either remove the lang property from
the returned object (so return only slug using getPageImage(page).segments) or
enable i18n in fumadocs and ensure page objects include a locale field before
mapping it here (if you choose i18n, add the proper config and guard/validate
page.locale when building params).
| <svg aria-label='Logo' height='24' width='24' xmlns='http://www.w3.org/2000/svg'> | ||
| <circle cx={12} cy={12} fill='currentColor' r={12} /> | ||
| </svg> |
There was a problem hiding this comment.
Add title element to SVG for accessibility.
The SVG logo is missing a <title> element, which is required for proper screen reader support and WCAG compliance. While aria-label is present, SVG elements should include a <title> child element.
Apply this diff to fix the accessibility issue:
- <>
- <svg aria-label='Logo' height='24' width='24' xmlns='http://www.w3.org/2000/svg'>
- <circle cx={12} cy={12} fill='currentColor' r={12} />
- </svg>
+ <>
+ <svg aria-label='Logo' height='24' width='24' xmlns='http://www.w3.org/2000/svg' role='img'>
+ <title>Logo</title>
+ <circle cx={12} cy={12} fill='currentColor' r={12} />
+ </svg>
Mock config server
</>Based on static analysis hints from Biome.
📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| <svg aria-label='Logo' height='24' width='24' xmlns='http://www.w3.org/2000/svg'> | |
| <circle cx={12} cy={12} fill='currentColor' r={12} /> | |
| </svg> | |
| <svg aria-label='Logo' height='24' width='24' xmlns='http://www.w3.org/2000/svg' role='img'> | |
| <title>Logo</title> | |
| <circle cx={12} cy={12} fill='currentColor' r={12} /> | |
| </svg> |
🧰 Tools
🪛 Biome (2.1.2)
[error] 15-15: Alternative text title element cannot be empty
For accessibility purposes, SVGs should have an alternative text, provided via title element. If the svg element has role="img", you should add the aria-label or aria-labelledby attribute.
(lint/a11y/noSvgWithoutTitle)
🤖 Prompt for AI Agents
In packages/docs/src/lib/layout.shared.tsx around lines 15-17, the SVG logo
lacks a <title> element for screen readers; add a descriptive <title> child
(e.g. "Logo" or more specific text) with a unique id (e.g. logo-title) inside
the SVG and reference it by replacing or supplementing aria-label with
aria-labelledby="logo-title" (or keep aria-label and also include the <title>),
ensuring the title text matches the accessible name.
| @@ -0,0 +1,3 @@ | |||
| # 🎉 Mock Config Server | |||
|
|
|||
| <svg aria-label='Logo' height='24' width='24' xmlns='http://www.w3.org/2000/svg'> | ||
| <circle cx={12} cy={12} fill='currentColor' r={12} /> | ||
| </svg> |
There was a problem hiding this comment.
лого сразу вынести хлопушку в компоненты или даже icons
There was a problem hiding this comment.
Вынес хлопушку в svg иконку, но не как реакт компонент, потому что у fumadocs какая-то проблема с цветами возникает, если импортить просто как изображение то все ок
| // use this function to get MDX components, you will need it for rendering MDX | ||
| export function getMDXComponents(components?: MDXComponents): MDXComponents { | ||
| return { |
There was a problem hiding this comment.
arrow fn сделать + можно сразу сделать Markdown компонент
There was a problem hiding this comment.
Не понял про Markdown компонент
| "scripts": { | ||
| "build": "next build", | ||
| "dev": "next dev --turbo", | ||
| "start": "next start", |
There was a problem hiding this comment.
- у нас же просто html,css,js генерится, т.е. next start вообще не работает
- в сгенерированных файлах в урлах на js,css и тд есть /mock-config префикс. Надо это учесть при запуске, а то на 404 ведет сейчас
There was a problem hiding this comment.
- да, согласен
- можно создать page.tsx в app для редиректа мб
There was a problem hiding this comment.
а хотя сейчас ктати подумал, редирект как-будто useless потому что github pages буквально даст нам урлу с названием проекта и у нас челы будут заходить как раз на /mock-config, то есть только в dev режиме проблема остается
…al package.json
|
@coderabbitai review please, especially github actions. Content in files just a temporary placeholder — so dont waste your time for it |
|
Tip For best results, initiate chat on the files or code changes. 🧩 Analysis chain🏁 Script executed: Length of output: 382 🏁 Script executed: Length of output: 1767 🏁 Script executed: Length of output: 1308 🏁 Script executed: Length of output: 1688 🏁 Script executed: Length of output: 993 🏁 Script executed: Length of output: 719 @MiaInturi, I've reviewed the GitHub Actions workflow. Here are my findings: 🚨 Critical Issues in
|
| "scripts": { | ||
| "build": "next build", | ||
| "dev": "next dev --turbo", | ||
| "prod": "next build && node server.ts", |
There was a problem hiding this comment.
ну и опять на гитхаб страницу мы можем выкладывать только статику, там не запустить се рвер, ну он нам и не нужен< опять же все можно глянуть тут https://github.com/siberiacancode/google-recaptcha/blob/main/packages/docs/package.json
There was a problem hiding this comment.
так а в deploy вызывается как раз команда build, а не prod
There was a problem hiding this comment.
думаешь переименовать prod в какой-нибудь prod-test?
| if (req.url) { | ||
| req.url = `/${req.url}`; | ||
| } |
There was a problem hiding this comment.
А почем условие изменилось? Я в целом я думаю это условие можно убрать
There was a problem hiding this comment.
потому что я вечером дурак не так понял это условие, убрал его
Summary by CodeRabbit
✏️ Tip: You can customize this high-level summary in your review settings.