.

app/[locale]/setup/page.tsx

@@ -1,4 +1,4 @@
-"use client"
+'use client'
 
 import { ChatbotUIContext } from "@/context/context"
 import { getProfileByUserId, updateProfile } from "@/db/profile"
@@ -21,6 +21,7 @@ import {
   SETUP_STEP_COUNT,
   StepContainer
 } from "../../../components/setup/step-container"
+import { useTranslation } from 'react-i18next'
 
 export default function SetupPage() {
   const {
@@ -35,6 +36,8 @@ export default function SetupPage() {
 
   const router = useRouter()
 
+  const { t } = useTranslation()
+
   const [loading, setLoading] = useState(true)
 
   const [currentStep, setCurrentStep] = useState(1)
@@ -161,9 +164,9 @@ export default function SetupPage() {
       case 1:
         return (
           <StepContainer
-            stepDescription="Let's create your profile."
+            stepDescription={t("Let's create your profile.")}
             stepNum={currentStep}
-            stepTitle="Welcome to Chatbot UI"
+            stepTitle={t("Welcome to Chatbot UI")}
             onShouldProceed={handleShouldProceed}
             showNextButton={!!(username && usernameAvailable)}
             showBackButton={false}
@@ -183,9 +186,9 @@ export default function SetupPage() {
       case 2:
         return (
           <StepContainer
-            stepDescription="Enter API keys for each service you'd like to use."
+            stepDescription={t("Enter API keys for each service you'd like to use.")}
             stepNum={currentStep}
-            stepTitle="Set API Keys (optional)"
+            stepTitle={t("Set API Keys (optional)")}
             onShouldProceed={handleShouldProceed}
             showNextButton={true}
             showBackButton={true}
@@ -229,9 +232,9 @@ export default function SetupPage() {
       case 3:
         return (
           <StepContainer
-            stepDescription="You are all set up!"
+            stepDescription={t("You are all set up!")}
             stepNum={currentStep}
-            stepTitle="Setup Complete"
+            stepTitle={t("Setup Complete")}
             onShouldProceed={handleShouldProceed}
             showNextButton={true}
             showBackButton={true}

public/locales/en/translation.json

@@ -1,5 +1,11 @@
 {
   "Ask anything. Type \"/\" for prompts, \"@\" for files, and \"#\" for tools.": "Ask anything. Type \"/\" for prompts, \"@\" for files, and \"#\" for tools.",
   "Company Name": "Jelly Drops LLC",
-  "Clock In": "Clock In"
-}
+  "Clock In": "Clock In",
+  "Let's create your profile.": "Let's create your profile.",
+  "Welcome to Chatbot UI": "Welcome to Chatbot UI",
+  "Enter API keys for each service you'd like to use.": "Enter API keys for each service you'd like to use.",
+  "Set API Keys (optional)": "Set API Keys (optional)",
+  "You are all set up!": "You are all set up!",
+  "Setup Complete": "Setup Complete"
+}

public/locales/ja/translation.json

@@ -1,5 +1,12 @@
 {
     "Ask anything. Type \"/\" for prompts, \"@\" for files, and \"#\" for tools.": "何でも聞いてください。「/」でプロンプト、「@」でファイル、「#」でツールを入力してください。",
     "Company Name": "Jelly Drops LLC",
-    "Clock In": "出勤する"
-}
+    "Clock In": "出勤する",
+    "Let's create your profile.": "プロフィールを作成しましょう。",
+    "Welcome to Chatbot UI": "Chatbot UIへようこそ",
+    "Enter API keys for each service you'd like to use.": "使用する各サービスのAPIキーを入力してください。",
+    "Set API Keys (optional)": "APIキーの設定（オプション）",
+    "You are all set up!": "設定が完了しました！",
+    "Setup Complete": "セットアップ完了"
+  }
+  

public/locales/zh/translation.json

@@ -1,6 +1,11 @@
 {
-    "Ask anything. Type \"/\" for prompts, \"@\" for files, and \"#\" for tools.": "随便问点什么。输入“/”查找提示，“@”查找文件，“#”查找工具。",
-    "Company Name": "深圳果冻移民咨询有限责任公司",
-    "Clock In": "打卡"
-  }
-  
+  "Ask anything. Type \"/\" for prompts, \"@\" for files, and \"#\" for tools.": "随便问点什么。输入“/”查找提示，“@”查找文件，“#”查找工具。",
+  "Company Name": "深圳果冻移民咨询有限责任公司",
+  "Clock In": "打卡",
+  "Let's create your profile.": "让我们来创建您的个人资料。",
+  "Welcome to Chatbot UI": "欢迎使用 Chatbot UI",
+  "Enter API keys for each service you'd like to use.": "输入您希望使用的每个服务的 API 密钥。",
+  "Set API Keys (optional)": "设置 API 密钥（可选）",
+  "You are all set up!": "设置完成！",
+  "Setup Complete": "设置完成"
+}