Add i18n support with English, Chinese, Spanish, and Japanese

[Miyamura80]

Summary

Implement comprehensive internationalization (i18n) support for the documentation site, adding support for English, Chinese (Simplified), Spanish, and Japanese languages. This includes language-specific documentation pages, middleware for language routing, and localized UI components.

Changes

• Added i18n configuration with support for 4 languages (en, zh, es, ja)
• Created language-specific documentation pages:
  • index.{es,ja,zh}.mdx - Quick start guides in Spanish, Japanese, and Chinese
  • api.{es,ja,zh}.mdx - API reference pages in Spanish, Japanese, and Chinese
  • test.{es,ja,zh}.mdx - Component showcase pages in Spanish, Japanese, and Chinese
• Implemented i18n middleware for automatic language routing based on URL parameters
• Restructured app routing to support language-prefixed routes (/[lang]/docs, /[lang]/)
• Added language-specific layout components with localized UI strings (table of contents, search, navigation labels, etc.)
• Created shared layout utilities (layout.shared.tsx) for consistent branding across languages
• Updated source loader to support language-aware page retrieval
• Enhanced search API with locale-specific configuration for Chinese and Japanese (zero threshold/tolerance for better CJK support)
• Refactored root layout to be language-agnostic and delegate to language-specific layouts
• Added utility functions for className merging (cn.ts)

Testing

• Tests pass (make test)
• Linting passes (make ci)

Related Issues

Closes #

https://claude.ai/code/session_01UwMuBPaeouJ16zJTVa8UJm

[greptile-apps]

Greptile Summary

This PR implements comprehensive i18n support for the documentation site with English, Chinese (Simplified), Spanish, and Japanese languages. The implementation restructures the routing to use locale-prefixed paths (/[lang]/docs), adds middleware for automatic language detection, and creates locale-specific content files.

Key changes:

• Added i18n configuration with 4 language support (en, zh, es, ja)
• Restructured app routing from /docs to /[lang]/docs with language-specific layouts
• Implemented locale-aware middleware with proper static file exclusions
• Updated API endpoints (/llms-full.txt, /api/search, /llms.mdx) to handle multiple locales
• Enhanced search with CJK-optimized settings (zero threshold/tolerance for Chinese and Japanese)
• Created translated content files for quick start, API reference, and component showcase pages
• Updated Next.js rewrite rules to support both locale-prefixed and non-prefixed MDX routes

Previously identified issues:

• Spanish translations missing diacritics (accent marks) throughout - already flagged in previous comments
• These translation quality issues should be addressed but don't affect functionality

The implementation is architecturally sound and follows Next.js i18n best practices. The routing, middleware configuration, and API endpoint updates are all correctly implemented.

Confidence Score: 4/5

• Safe to merge with minor translation quality improvements recommended
• The i18n implementation is technically solid with proper routing, middleware, and API endpoint handling. The only issues are translation quality (Spanish diacritics) which were already identified in previous review threads and don't affect functionality. All locale-aware endpoints are correctly implemented and the rewrite rules properly handle both prefixed and non-prefixed routes.
• Spanish content files (docs/content/docs/*.es.mdx) and Spanish UI strings (docs/app/[lang]/layout.tsx) need diacritic corrections for professional quality, but these are cosmetic fixes

Important Files Changed

Filename	Overview
docs/lib/i18n.ts	Defines i18n configuration with 4 supported languages (en, zh, es, ja)
docs/middleware.ts	Implements i18n middleware for language routing with proper static file exclusions
docs/lib/source.ts	Configures loader with i18n support, includes helper functions for OG images and LLM text generation
docs/next.config.mjs	Updated rewrite rules to handle both locale-prefixed and non-prefixed MDX routes
docs/app/[lang]/layout.tsx	Language-specific root layout with UI translations (Spanish translations already flagged as missing diacritics)
docs/app/[lang]/docs/[[...slug]]/page.tsx	Docs page component with locale-aware routing and proper MDX rendering
docs/app/llms-full.txt/route.ts	Full LLM text endpoint now properly filters by ?lang= query parameter
docs/app/api/search/route.ts	Search API with locale-specific configuration for CJK languages (zero threshold/tolerance)

_{Last reviewed commit: 10fd972}

[greptile-apps]

_{27 files reviewed, 2 comments}

_{Edit Code Review Agent Settings | Greptile}

[greptile-apps]

_{27 files reviewed, 2 comments}

_{Edit Code Review Agent Settings | Greptile}

[greptile-apps]

Additional Comments (1)

docs/app/og/docs/[...slug]/route.tsx
OG images broken for non-English locales

With i18n enabled, source.getPage(slug.slice(0, -1)) is called without a locale parameter, so it only resolves pages for the default language (en). Meanwhile, getPageImage(page) generates URLs based on page.url which now includes the locale prefix (e.g., /zh/docs/api → /og/zh/docs/api/og.png). However, this OG route sits at /og/docs/[...slug], not /og/[lang]/docs/[...slug], so those locale-prefixed OG URLs will never match this route.

As a result, generateMetadata in docs/app/[lang]/docs/[[...slug]]/page.tsx sets OG image URLs that will 404 for all non-English pages.

Prompt To Fix With AI

This is a comment left during a code review.
Path: docs/app/og/docs/[...slug]/route.tsx
Line: 10:10

Comment:
**OG images broken for non-English locales**

With i18n enabled, `source.getPage(slug.slice(0, -1))` is called without a locale parameter, so it only resolves pages for the default language (`en`). Meanwhile, `getPageImage(page)` generates URLs based on `page.url` which now includes the locale prefix (e.g., `/zh/docs/api` → `/og/zh/docs/api/og.png`). However, this OG route sits at `/og/docs/[...slug]`, not `/og/[lang]/docs/[...slug]`, so those locale-prefixed OG URLs will never match this route.

As a result, `generateMetadata` in `docs/app/[lang]/docs/[[...slug]]/page.tsx` sets OG image URLs that will 404 for all non-English pages.

How can I resolve this? If you propose a fix, please make it concise.

[greptile-apps]

_{28 files reviewed, 1 comment}

_{Edit Code Review Agent Settings | Greptile}

[greptile-apps]

_{31 files reviewed, 1 comment}

_{Edit Code Review Agent Settings | Greptile}