with locale

apps/www/package.json

@@ -146,9 +146,6 @@
     "framer-motion": "^11.5.4",
     "fzf": "0.5.2",
     "html2canvas": "^1.4.1",
-    "i18next": "24.2.0",
-    "i18next-browser-languagedetector": "8.0.2",
-    "i18next-http-backend": "3.0.1",
     "lodash.template": "^4.5.0",
     "lucide-react": "0.460.0",
     "match-sorter": "6.3.4",
@@ -164,7 +161,6 @@
     "react-dnd-html5-backend": "^16.0.1",
     "react-dom": "^18.3.1",
     "react-hook-form": "7.53.2",
-    "react-i18next": "15.2.0",
     "react-lite-youtube-embed": "^2.4.0",
     "react-markdown": "9.0.1",
     "react-player": "2.16.0",

apps/www/src/app/(app)/docs/[[...slug]]/nav-items-grid.tsx

@@ -13,6 +13,7 @@ import { Card, CardContent, CardTitle } from '@/components/ui/card';
 import { getDocIcon } from '@/config/docs-icons';
 import { categoryNavGroups, docSections } from '@/config/docs-utils';
 import { useLocale } from '@/hooks/useLocale';
+import { hrefWithLocale } from '@/lib/withLocale';
 import { Input } from '@/registry/default/plate-ui/input';
 
 export function NavItemsGrid({
@@ -72,7 +73,7 @@ export function NavItemsGrid({
                   <Link
                     key={item.href}
                     className="rounded-lg"
-                    href={`${item.href}${locale === 'en' ? '' : `?locale=${locale}`}`}
+                    href={hrefWithLocale(item.href!, locale)}
                   >
                     <Card className="h-full bg-muted/30 transition-shadow duration-200 hover:shadow-md">
                       <CardContent className="flex gap-2 p-2">

apps/www/src/app/(app)/editors/editor-description.tsx

@@ -0,0 +1,51 @@
+'use client';
+
+import {
+  PageActions,
+  PageHeader,
+  PageHeaderDescription,
+  PageHeaderHeading,
+} from '@/components/page-header';
+import { useLocale } from '@/hooks/useLocale';
+import { Button } from '@/registry/default/plate-ui/button';
+
+const i18n = {
+  cn: {
+    browseEditors: '浏览编辑器',
+    description: '精美设计。复制到你的应用中。开源。',
+    title: '为Web构建编辑器',
+  },
+  en: {
+    browseEditors: 'Browse Editors',
+    description:
+      'Beautifully designed. Copy and paste into your apps. Open Source.',
+    title: 'Building Editors for the Web',
+  },
+};
+
+export function EditorDescription() {
+  const locale = useLocale();
+  const content = i18n[locale as keyof typeof i18n];
+
+  return (
+    <PageHeader>
+      {/* <Announcement /> */}
+      <PageHeaderHeading>{content.title}</PageHeaderHeading>
+      <PageHeaderDescription>{content.description}</PageHeaderDescription>
+      <PageActions>
+        <Button asChild size="lg">
+          <a href="#blocks">{content.browseEditors}</a>
+        </Button>
+        {/* <Button asChild size="sm" variant="ghost">
+          <a
+            href="https://github.com/shadcn-ui/ui/discussions/new?category=blocks-request"
+            rel="noreferrer"
+            target="_blank"
+          >
+            Request a block
+          </a>
+        </Button> */}
+      </PageActions>
+    </PageHeader>
+  );
+}

apps/www/src/app/(app)/editors/layout.tsx

@@ -1,12 +1,6 @@
 import type { Metadata } from 'next';
 
-import {
-  PageActions,
-  PageHeader,
-  PageHeaderDescription,
-  PageHeaderHeading,
-} from '@/components/page-header';
-import { Button } from '@/registry/default/plate-ui/button';
+import { EditorDescription } from './editor-description';
 
 export const metadata: Metadata = {
   description:
@@ -21,27 +15,7 @@ export default function BlocksLayout({
 }) {
   return (
     <div className="container relative">
-      <PageHeader>
-        {/* <Announcement /> */}
-        <PageHeaderHeading>Building Editors for the Web</PageHeaderHeading>
-        <PageHeaderDescription>
-          Beautifully designed. Copy and paste into your apps. Open Source.
-        </PageHeaderDescription>
-        <PageActions>
-          <Button asChild size="lg">
-            <a href="#blocks">Browse Editors</a>
-          </Button>
-          {/* <Button asChild size="sm" variant="ghost">
-            <a
-              href="https://github.com/shadcn-ui/ui/discussions/new?category=blocks-request"
-              rel="noreferrer"
-              target="_blank"
-            >
-              Request a block
-            </a>
-          </Button> */}
-        </PageActions>
-      </PageHeader>
+      <EditorDescription />
       <section id="blocks" className="scroll-mt-24">
         {children}
       </section>

apps/www/src/app/(app)/page.tsx

@@ -39,7 +39,8 @@ const i18n = {
     potionDescription: 'A Notion-like AI template.',
   },
 };
-type SearchParams = Promise<{
+
+export type SearchParams = Promise<{
   locale: string;
 }>;
 

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

@@ -8,6 +8,7 @@ import { usePathname } from 'next/navigation';
 
 import { siteConfig } from '@/config/site';
 import { useLocale } from '@/hooks/useLocale';
+import { hrefWithLocale } from '@/lib/withLocale';
 
 import { Icons } from './icons';
 
@@ -36,7 +37,7 @@ export function MainNav() {
     <div className="mr-4 hidden md:flex">
       <Link
         className="mr-4 flex items-center gap-2 lg:mr-6"
-        href={`/${locale === 'en' ? '' : `?locale=${locale}`}`}
+        href={hrefWithLocale('/', locale)}
       >
         <Icons.minus className="size-6" />
         <span className="hidden items-center font-bold lg:inline-flex">
@@ -51,7 +52,7 @@ export function MainNav() {
               ? 'font-medium text-foreground'
               : 'text-foreground/80'
           )}
-          href={`/docs${locale === 'en' ? '' : `?locale=${locale}`}`}
+          href={hrefWithLocale('/docs', locale)}
         >
           {content.docs}
         </Link>
@@ -62,7 +63,7 @@ export function MainNav() {
               ? 'font-medium text-foreground'
               : 'text-foreground/80'
           )}
-          href="/docs/components/introduction"
+          href={hrefWithLocale('/docs/components/introduction', locale)}
         >
           {content.components}
         </Link>
@@ -73,7 +74,7 @@ export function MainNav() {
               ? 'font-medium text-foreground'
               : 'text-foreground/80'
           )}
-          href="/editors"
+          href={hrefWithLocale('/editors', locale)}
         >
           {content.editors}
         </Link>

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

@@ -18,6 +18,7 @@ import {
   AccordionTrigger,
 } from '@/components/ui/accordion';
 import { useLocale } from '@/hooks/useLocale';
+import { hrefWithLocale } from '@/lib/withLocale';
 import { Input } from '@/registry/default/plate-ui/input';
 
 export interface DocsSidebarNavProps {
@@ -199,7 +200,7 @@ export function DocsSidebarNavItems({
                   ? 'font-medium text-foreground'
                   : 'text-muted-foreground'
               )}
-              href={`${item.href}${locale === 'en' ? '' : `?locale=${locale}`}`}
+              href={hrefWithLocale(item.href!, locale)}
               rel={item.external ? 'noreferrer' : ''}
               target={item.external ? '_blank' : ''}
             >

apps/www/src/lib/withLocale.ts

@@ -0,0 +1,3 @@
+export const hrefWithLocale = (href: string, locale: string) => {
+  return `${href}${locale === 'en' ? '' : `?locale=${locale}`}`;
+};