Merge pull request #4347 from udecode/i18n-2

New Chinese docs

Author: felixfeng33

apps/www/src/components/docs-nav.tsx

@@ -22,6 +22,7 @@ import { cn } from '@/lib/utils';
 import { hrefWithLocale } from '@/lib/withLocale';
 
 export function DocsNav({ config }: { config: DocsConfig }) {
+  const locale = useLocale();
   const pathname = usePathname();
   const [filter, setFilter] = useState('');
   const [activeSection, setActiveSection] = useState<string | undefined>();
@@ -205,7 +206,7 @@ export function DocsNav({ config }: { config: DocsConfig }) {
             >
               <AccordionTrigger className="h-9 shrink-0 items-center px-2 py-1 text-sm outline-none">
                 <div className="flex items-center">
-                  {item.title}
+                  {locale === 'cn' ? item.titleCn || item.title : item.title}
                   {item.label && (
                     <div className="flex gap-1">
                       {castArray(item.label).map((label, labelIndex) => (
@@ -276,7 +277,7 @@ function DocsNavItems({
               item.disabled && 'cursor-not-allowed opacity-60'
             )}
           >
-            {item.title}
+            {locale === 'cn' ? item.titleCn || item.title : item.title}
             {item.label && (
               <span className="ml-2 rounded-md bg-muted px-1.5 py-0.5 text-xs leading-none text-muted-foreground no-underline group-hover:no-underline">
                 {item.label}
@@ -299,7 +300,7 @@ function DocsNavItems({
                 rel={item.external ? 'noreferrer' : ''}
                 target={item.external ? '_blank' : ''}
               >
-                {item.title}
+                {locale === 'cn' ? item.titleCn || item.title : item.title}
                 {item.label && (
                   <div className="ml-2 flex gap-1">
                     {castArray(item.label).map((label, labelIndex) => (
@@ -327,7 +328,7 @@ function DocsNavItems({
                   'flex h-8 w-full items-center truncate rounded-lg px-2 font-medium text-foreground select-none'
                 )}
               >
-                {item.title}
+                {locale === 'cn' ? item.titleCn || item.title : item.title}
                 {item.label && (
                   <div className="ml-2 flex gap-1">
                     {castArray(item.label).map((label, labelIndex) => (

apps/www/src/components/logo.tsx

@@ -0,0 +1,27 @@
+'use client';
+
+import Link from 'next/link';
+
+import { Button } from '@/components/ui/button';
+import { siteConfig } from '@/config/site';
+import { getLocalizedPath, useLocale } from '@/hooks/useLocale';
+
+import { Icons } from './icons';
+
+export function Logo() {
+  const locale = useLocale();
+
+  return (
+    <Button
+      asChild
+      size="icon"
+      variant="ghost"
+      className="hidden size-8 md:flex"
+    >
+      <Link href={getLocalizedPath(locale, '/')}>
+        <Icons.logo className="size-5" />
+        <span className="sr-only">{siteConfig.name}</span>
+      </Link>
+    </Button>
+  );
+}

apps/www/src/components/main-nav.tsx

@@ -9,7 +9,7 @@ import { usePathname } from 'next/navigation';
 
 import { Button } from '@/components/ui/button';
 import { siteConfig } from '@/config/site';
-import { useLocale } from '@/hooks/useLocale';
+import { getLocalizedPath, useLocale } from '@/hooks/useLocale';
 import { cn } from '@/lib/utils';
 
 import { Icons } from './icons';
@@ -46,9 +46,9 @@ export function MainNav({
         <Button key={item.href} asChild size="sm" variant="ghost">
           <Link
             className={cn(pathname === item.href && 'text-primary')}
-            href={item.href!}
+            href={getLocalizedPath(locale, item.href!)}
           >
-            {item.label}
+            {locale === 'cn' ? (item as any).labelCn || item.label : item.label}
           </Link>
         </Button>
       ))}

apps/www/src/components/site-header.tsx

@@ -8,6 +8,7 @@ import { siteConfig } from '@/config/site';
 import { CommandMenu } from './command-menu';
 import { Icons } from './icons';
 import { LanguagesDropdownMenu } from './languages-dropdown-menu';
+import { Logo } from './logo';
 import { MainNav } from './main-nav';
 import { SetupMCPDialog } from './mcp-dialog';
 import { MobileNav } from './mobile-nav';
@@ -42,17 +43,7 @@ export function SiteHeader() {
           />
 
           {/* Desktop only */}
-          <Button
-            asChild
-            size="icon"
-            variant="ghost"
-            className="hidden size-8 md:flex"
-          >
-            <Link href="/">
-              <Icons.logo className="size-5" />
-              <span className="sr-only">{siteConfig.name}</span>
-            </Link>
-          </Button>
+          <Logo />
           <MainNav className="hidden md:flex" items={siteConfig.navItems} />
 
           {/* Header end */}

apps/www/src/config/docs-api.ts

@@ -15,6 +15,7 @@ export const docsApi: SidebarNavItem[] = [
       {
         href: '/docs/api/slate/editor-api',
         title: 'Editor API',
+        titleCn: '编辑器 API',
       },
       {
         href: '/docs/api/slate/editor-transforms',
@@ -116,6 +117,7 @@ export const docsApi: SidebarNavItem[] = [
         ],
         href: '/docs/api/core/plate-components',
         title: 'Plate Components',
+        titleCn: 'Plate 组件',
       },
       {
         headings: [
@@ -148,6 +150,7 @@ export const docsApi: SidebarNavItem[] = [
         ],
         href: '/docs/api/core/plate-editor',
         title: 'Plate Editor',
+        titleCn: 'Plate 编辑器',
       },
       {
         headings: [
@@ -228,11 +231,13 @@ export const docsApi: SidebarNavItem[] = [
         ],
         href: '/docs/api/core/plate-plugin',
         title: 'Plate Plugin',
+        titleCn: 'Plate 插件',
       },
       {
         headings: ['useEventEditorSelectors', 'useEventPlateId'],
         href: '/docs/api/core/plate-store',
         title: 'Plate Store',
+        titleCn: 'Plate 存储',
       },
       {
         headings: [
@@ -248,15 +253,18 @@ export const docsApi: SidebarNavItem[] = [
         ],
         href: '/docs/api/core/plate-controller',
         title: 'Plate Controller',
+        titleCn: 'Plate 控制器',
       },
     ],
     title: 'Plate Core',
+    titleCn: 'Plate 核心',
   },
   {
     description: 'Additional utilities for Plate.',
     headings: [],
     href: '/docs/api/utils',
     title: 'Plate Utils',
+    titleCn: 'Plate 工具',
   },
   {
     description: 'React utilities.',
@@ -270,23 +278,27 @@ export const docsApi: SidebarNavItem[] = [
     ],
     href: '/docs/api/react-utils',
     title: 'React Utils',
+    titleCn: 'React 工具',
   },
   {
     description: 'Class utilities.',
     headings: ['cn', 'withCn', 'withProps', 'withVariants'],
     href: '/docs/api/cn',
     title: 'cn',
+    titleCn: 'cn',
   },
   {
     description: 'API reference for @platejs/floating',
     headings: [],
     href: '/docs/api/floating',
     title: 'Floating',
+    titleCn: 'Floating',
   },
   {
     description: 'API reference for @platejs/resizable',
     headings: [],
     href: '/docs/api/resizable',
     title: 'Resizable',
+    titleCn: 'Resizable',
   },
 ];

apps/www/src/config/docs-examples.ts

@@ -10,49 +10,58 @@ export const docsExamples: SidebarNavItem[] = [
     href: '/docs/examples/slate-to-html',
     label: 'New',
     title: 'Slate to HTML',
+    titleCn: 'Slate 转 HTML',
   },
   {
     description: 'Export a Plate document to a file.',
     href: '/docs/examples/export',
     label: 'New',
     title: 'Export',
+    titleCn: '导出',
   },
   {
     description: 'Server-side rendering.',
     href: '/docs/examples/server-side',
     title: 'Server-Side',
+    titleCn: '服务端',
   },
   {
     description:
       "Show a diff of two different points in a Plate document's history.",
     href: '/docs/examples/version-history',
     title: 'Version History',
+    titleCn: '版本历史',
   },
   {
     description: 'Nest editors in void nodes.',
     href: '/docs/examples/editable-voids',
     title: 'Editable Voids',
+    titleCn: '可编辑的空节点',
   },
   {
     description: 'Rendering hundreds of blocks.',
     href: '/docs/examples/hundreds-blocks',
     title: 'Hundreds Blocks',
+    titleCn: '数百个块',
   },
   {
     description: 'Render hundreds of editors.',
     href: '/docs/examples/hundreds-editors',
     title: 'Hundreds Editors',
+    titleCn: '数百个编辑器',
   },
   {
     description: 'Decorate texts with markdown preview.',
     href: '/docs/examples/preview-markdown',
     title: 'Preview Markdown',
+    titleCn: 'Markdown 预览',
   },
   {
     description: 'Collaborative editing.',
     href: '/docs/examples/collaboration',
     label: 'New',
     title: 'Collaboration Demo',
+    titleCn: '协作演示',
   },
   ...registryToNav(
     demoExamples.filter(