feat: implement i18n with next-intl for Chinese Simplified and Traditional support

README.md

@@ -25,6 +25,10 @@
 - **Tailwind CSS** + **shadcn/ui** for modern UI components
 - **SWR** for efficient data fetching and caching
 - **Drizzle ORM** with PostgreSQL for robust data persistence
+- **Internationalization (i18n)** - Multi-language support with next-intl
+  - English (default)
+  - Chinese Simplified (简体中文)
+  - Chinese Traditional (繁體中文)
 
 ### 🤖 Advanced AI Capabilities
 
@@ -418,7 +422,9 @@ For commercial licensing inquiries, please contact us through GitHub Issues.
 
 - **Issues**: [GitHub Issues](https://github.com/rxtech-lab/rxchat-web/issues)
 - **Discussions**: [GitHub Discussions](https://github.com/rxtech-lab/rxchat-web/discussions)
-- **Documentation**: See component READMEs in `components/` directories
+- **Documentation**: 
+  - See component READMEs in `components/` directories
+  - [Internationalization Guide](./docs/i18n.md) - Multi-language support documentation
 
 ## Acknowledgments
 

app/[locale]/(auth)/api/auth/[...nextauth]/route.ts

@@ -0,0 +1 @@
+export { GET, POST } from '@/app/[locale]/(auth)/auth';

app/(auth)/api/auth/guest/route.ts → app/[locale]/(auth)/api/auth/guest/route.ts

@@ -1,4 +1,4 @@
-import { signIn } from '@/app/(auth)/auth';
+import { signIn } from '@/app/[locale]/(auth)/auth';
 import { isDevelopmentEnvironment } from '@/lib/constants';
 import { getToken } from 'next-auth/jwt';
 import { NextResponse } from 'next/server';

app/(auth)/api/auth/link/telegram/actions.ts → app/[locale]/(auth)/api/auth/link/telegram/actions.ts

@@ -1,6 +1,6 @@
 'use server';
 
-import { auth } from '@/app/(auth)/auth';
+import { auth } from '@/app/[locale]/(auth)/auth';
 import {
   getUserTelegramLink,
   unlinkTelegramFromUser,

app/(auth)/login/page.tsx → app/[locale]/(auth)/login/page.tsx

@@ -1,6 +1,5 @@
 'use client';
 
-import Link from 'next/link';
 import { useRouter } from 'next/navigation';
 import { useActionState, useEffect, useState } from 'react';
 import { toast } from '@/components/toast';
@@ -10,9 +9,13 @@ import { SubmitButton } from '@/components/submit-button';
 
 import { login, type LoginActionState } from '../actions';
 import { useSession } from 'next-auth/react';
+import { useTranslations } from 'next-intl';
+import { Link } from '@/lib/i18n/routing';
 
 export default function Page() {
   const router = useRouter();
+  // Use translations from the auth namespace
+  const t = useTranslations('auth');
 
   const [email, setEmail] = useState('');
   const [isSuccessful, setIsSuccessful] = useState(false);
@@ -31,12 +34,12 @@ export default function Page() {
     if (state.status === 'failed') {
       toast({
         type: 'error',
-        description: 'Invalid credentials!',
+        description: t('invalidCredentials'),
       });
     } else if (state.status === 'invalid_data') {
       toast({
         type: 'error',
-        description: 'Failed validating your submission!',
+        description: t('invalidData'),
       });
     } else if (state.status === 'success') {
       setIsSuccessful(true);
@@ -55,20 +58,22 @@ export default function Page() {
     <div className="flex h-dvh w-screen items-start pt-12 md:pt-0 md:items-center justify-center bg-background">
       <div className="w-full max-w-md overflow-hidden rounded-2xl flex flex-col gap-12">
         <div className="flex flex-col items-center justify-center gap-2 px-4 text-center sm:px-16">
-          <h3 className="text-xl font-semibold dark:text-zinc-50">Sign In</h3>
+          <h3 className="text-xl font-semibold dark:text-zinc-50">
+            {t('signIn')}
+          </h3>
           <p className="text-center text-sm text-gray-600 dark:text-zinc-400">
-            {"Don't have an account? "}
+            {t('noAccount')}
             <Link
               href="/register"
               className="font-semibold text-gray-800 hover:underline dark:text-zinc-200"
             >
-              Sign up
+              {t('signUp')}
             </Link>
-            {' for free.'}
+            {t('forFree')}
           </p>
         </div>
         <AuthForm action={handleSubmit} defaultEmail={email}>
-          <SubmitButton isSuccessful={isSuccessful}>Sign in</SubmitButton>
+          <SubmitButton isSuccessful={isSuccessful}>{t('signIn')}</SubmitButton>
         </AuthForm>
       </div>
     </div>

app/(auth)/register/page.tsx → app/[locale]/(auth)/register/page.tsx

@@ -1,6 +1,5 @@
 'use client';
 
-import Link from 'next/link';
 import { useRouter } from 'next/navigation';
 import { useActionState, useEffect, useState } from 'react';
 
@@ -10,9 +9,13 @@ import { SubmitButton } from '@/components/submit-button';
 import { register, type RegisterActionState } from '../actions';
 import { toast } from '@/components/toast';
 import { useSession } from 'next-auth/react';
+import { useTranslations } from 'next-intl';
+import { Link } from '@/lib/i18n/routing';
 
 export default function Page() {
   const router = useRouter();
+  // Use translations from the auth namespace
+  const t = useTranslations('auth');
 
   const [email, setEmail] = useState('');
   const [isSuccessful, setIsSuccessful] = useState(false);
@@ -28,21 +31,21 @@ export default function Page() {
 
   useEffect(() => {
     if (state.status === 'user_exists') {
-      toast({ type: 'error', description: 'Account already exists!' });
+      toast({ type: 'error', description: t('userExists') });
     } else if (state.status === 'failed') {
-      toast({ type: 'error', description: 'Failed to create account!' });
+      toast({ type: 'error', description: t('failedToCreate') });
     } else if (state.status === 'invalid_data') {
       toast({
         type: 'error',
-        description: 'Failed validating your submission!',
+        description: t('invalidData'),
       });
     } else if (state.status === 'passwords_dont_match') {
       toast({
         type: 'error',
-        description: 'Passwords do not match!',
+        description: t('passwordsDontMatch'),
       });
     } else if (state.status === 'success') {
-      toast({ type: 'success', description: 'Account created successfully!' });
+      toast({ type: 'success', description: t('accountCreated') });
       setIsSuccessful(true);
       updateSession();
       router.refresh();
@@ -59,29 +62,31 @@ export default function Page() {
     <div className="flex h-dvh w-screen items-start pt-12 md:pt-0 md:items-center justify-center bg-background">
       <div className="w-full max-w-md overflow-hidden rounded-2xl gap-12 flex flex-col">
         <div className="flex flex-col items-center justify-center gap-2 px-4 text-center sm:px-16">
-          <h3 className="text-xl font-semibold dark:text-zinc-50">Sign Up</h3>
+          <h3 className="text-xl font-semibold dark:text-zinc-50">
+            {t('signUp')}
+          </h3>
           <p className="text-center text-sm text-gray-600 dark:text-zinc-400">
-            {'Already have an account? '}
+            {t('hasAccount')}
             <Link
               href="/login"
               className="font-semibold text-gray-800 hover:underline dark:text-zinc-200"
             >
-              Sign in
+              {t('signIn')}
             </Link>
-            {' instead.'}
+            {t('instead')}
           </p>
         </div>
         <AuthForm action={handleSubmit} defaultEmail={email} isRegister={true}>
-          <SubmitButton isSuccessful={isSuccessful}>Sign Up</SubmitButton>
+          <SubmitButton isSuccessful={isSuccessful}>{t('signUp')}</SubmitButton>
           <p className="text-center text-sm text-gray-600 mt-4 dark:text-zinc-400">
-            {'Already have an account? '}
+            {t('hasAccount')}
             <Link
               href="/login"
               className="font-semibold text-gray-800 hover:underline dark:text-zinc-200"
             >
-              Sign in
+              {t('signIn')}
             </Link>
-            {' instead.'}
+            {t('instead')}
           </p>
         </AuthForm>
       </div>

app/(chat)/actions-mcp.ts → app/[locale]/(chat)/actions-mcp.ts

@@ -1,6 +1,6 @@
 'use server';
 
-import { auth } from '@/app/(auth)/auth';
+import { auth } from '@/app/[locale]/(auth)/auth';
 import { getMCPRouterClient } from '@/lib/api/mcp-router/api';
 import type { Tool } from '@/lib/api/mcp-router/client';
 

app/(chat)/actions.spec.ts → app/[locale]/(chat)/actions.spec.ts

@@ -62,7 +62,7 @@ jest.mock('next/headers', () => ({
   cookies: jest.fn(),
 }));
 
-import { auth } from '@/app/(auth)/auth';
+import { auth } from '@/app/[locale]/(auth)/auth';
 import { createPromptRunner } from '@/lib/agent/prompt-runner/runner';
 import { createMCPClient } from '@/lib/ai/mcp';
 import { db } from '@/lib/db/queries/client';

app/(chat)/api/chat/route.ts → app/[locale]/(chat)/api/chat/route.ts

@@ -1,4 +1,4 @@
-import { auth } from '@/app/(auth)/auth';
+import { auth } from '@/app/[locale]/(auth)/auth';
 import { createPromptRunner } from '@/lib/agent/prompt-runner/runner';
 import { entitlementsByUserRole } from '@/lib/ai/entitlements';
 import { createMCPClient } from '@/lib/ai/mcp';

app/(chat)/api/document/route.ts → app/[locale]/(chat)/api/document/route.ts

@@ -1,4 +1,4 @@
-import { auth } from '@/app/(auth)/auth';
+import { auth } from '@/app/[locale]/(auth)/auth';
 import type { ArtifactKind } from '@/components/artifact';
 import {
   deleteDocumentsByIdAfterTimestamp,

app/(chat)/api/documents/[id]/download/route.ts → app/[locale]/(chat)/api/documents/[id]/download/route.ts

@@ -1,4 +1,4 @@
-import { auth } from '@/app/(auth)/auth';
+import { auth } from '@/app/[locale]/(auth)/auth';
 import { getPresignedDownloadUrl } from '@/lib/document/actions/action_server';
 import { ChatSDKError } from '@/lib/errors';
 import { z } from 'zod';

app/(chat)/api/documents/[id]/route.ts → app/[locale]/(chat)/api/documents/[id]/route.ts

@@ -1,4 +1,4 @@
-import { auth } from '@/app/(auth)/auth';
+import { auth } from '@/app/[locale]/(auth)/auth';
 import {
   deleteDocument,
   renameDocument,

app/(chat)/api/documents/complete-upload/route.ts → app/[locale]/(chat)/api/documents/complete-upload/route.ts

@@ -1,7 +1,7 @@
 import { NextResponse } from 'next/server';
 import { z } from 'zod';
 
-import { auth } from '@/app/(auth)/auth';
+import { auth } from '@/app/[locale]/(auth)/auth';
 import { completeDocumentUpload } from '@/lib/document/actions/action_server';
 
 const CompleteUploadSchema = z.object({

app/(chat)/api/documents/route.ts → app/[locale]/(chat)/api/documents/route.ts

@@ -1,4 +1,4 @@
-import { auth } from '@/app/(auth)/auth';
+import { auth } from '@/app/[locale]/(auth)/auth';
 import {
   listDocuments,
   searchDocuments,

app/(chat)/api/files/upload/route.ts → app/[locale]/(chat)/api/files/upload/route.ts

@@ -1,7 +1,7 @@
 import { NextResponse } from 'next/server';
 import { z } from 'zod';
 
-import { auth } from '@/app/(auth)/auth';
+import { auth } from '@/app/[locale]/(auth)/auth';
 import { createS3Client } from '@/lib/s3';
 import {
   isImageType,

app/(chat)/api/history/route.ts → app/[locale]/(chat)/api/history/route.ts

@@ -1,4 +1,4 @@
-import { auth } from '@/app/(auth)/auth';
+import { auth } from '@/app/[locale]/(auth)/auth';
 import type { NextRequest } from 'next/server';
 import { getChatsByUserId } from '@/lib/db/queries/queries';
 import { ChatSDKError } from '@/lib/errors';

app/(chat)/api/prompts/route.spec.ts → app/[locale]/(chat)/api/prompts/route.spec.ts

@@ -14,7 +14,7 @@ jest.mock('@/app/(auth)/auth', () => ({
 }));
 
 import { PATCH } from './route';
-import { auth } from '@/app/(auth)/auth';
+import { auth } from '@/app/[locale]/(auth)/auth';
 import { createUser, deleteUserAccount } from '@/lib/db/queries/queries';
 import { createPrompt } from '@/lib/db/queries/prompts';
 import { generateRandomTestUser } from '@/tests/helpers';

app/(chat)/api/prompts/route.ts → app/[locale]/(chat)/api/prompts/route.ts

@@ -1,4 +1,4 @@
-import { auth } from '@/app/(auth)/auth';
+import { auth } from '@/app/[locale]/(auth)/auth';
 import {
   getPromptsByUserId,
   createPrompt,

app/(chat)/api/suggestions/route.ts → app/[locale]/(chat)/api/suggestions/route.ts

@@ -1,4 +1,4 @@
-import { auth } from '@/app/(auth)/auth';
+import { auth } from '@/app/[locale]/(auth)/auth';
 import { getSuggestionsByDocumentId } from '@/lib/db/queries/queries';
 import { ChatSDKError } from '@/lib/errors';
 

app/(chat)/api/user/route.ts → app/[locale]/(chat)/api/user/route.ts

@@ -1,4 +1,4 @@
-import { auth } from '@/app/(auth)/auth';
+import { auth } from '@/app/[locale]/(auth)/auth';
 import { NextResponse } from 'next/server';
 
 export async function GET() {

app/(chat)/api/vote/route.ts → app/[locale]/(chat)/api/vote/route.ts

@@ -1,4 +1,4 @@
-import { auth } from '@/app/(auth)/auth';
+import { auth } from '@/app/[locale]/(auth)/auth';
 import {
   getChatById,
   getVotesByChatId,

app/(chat)/chat/[id]/page.tsx → app/[locale]/(chat)/chat/[id]/page.tsx

@@ -1,7 +1,7 @@
 import { cookies } from 'next/headers';
 import { notFound, redirect } from 'next/navigation';
 
-import { auth } from '@/app/(auth)/auth';
+import { auth } from '@/app/[locale]/(auth)/auth';
 import { Chat } from '@/components/chat';
 import { DataStreamHandler } from '@/components/data-stream-handler';
 import { entitlementsByUserRole } from '@/lib/ai/entitlements';

app/(chat)/jobs/[id]/results/actions.ts → app/[locale]/(chat)/jobs/[id]/results/actions.ts

@@ -1,6 +1,6 @@
 'use server';
 
-import { auth } from '@/app/(auth)/auth';
+import { auth } from '@/app/[locale]/(auth)/auth';
 import {
   getJobById,
   getJobResultsByJobId,

app/(chat)/jobs/[id]/results/page.tsx → app/[locale]/(chat)/jobs/[id]/results/page.tsx

@@ -1,4 +1,4 @@
-import { auth } from '@/app/(auth)/auth';
+import { auth } from '@/app/[locale]/(auth)/auth';
 import { JobResultCard } from '@/components/job-result-card';
 import { JobResultsFilter } from '@/components/job-results-filter';
 import { Badge } from '@/components/ui/badge';