diff --git a/src/app/(dashboard)/dashboard/onboarding/page.tsx b/src/app/(dashboard)/dashboard/onboarding/page.tsx index a782f63964..4c5de1be08 100644 --- a/src/app/(dashboard)/dashboard/onboarding/page.tsx +++ b/src/app/(dashboard)/dashboard/onboarding/page.tsx @@ -2,14 +2,10 @@ import { useState, useEffect } from "react"; import { useRouter } from "next/navigation"; +import { useTranslations } from "next-intl"; -const STEPS = [ - { id: "welcome", title: "Welcome", icon: "waving_hand" }, - { id: "security", title: "Security", icon: "lock" }, - { id: "provider", title: "Provider", icon: "dns" }, - { id: "test", title: "Test", icon: "play_circle" }, - { id: "done", title: "Ready!", icon: "check_circle" }, -]; +const STEP_IDS = ["welcome", "security", "provider", "test", "done"]; +const STEP_ICONS = ["waving_hand", "lock", "dns", "play_circle", "check_circle"]; const COMMON_PROVIDERS = [ { id: "openai", name: "OpenAI", color: "#10A37F" }, @@ -22,6 +18,8 @@ const COMMON_PROVIDERS = [ export default function OnboardingWizard() { const router = useRouter(); + const t = useTranslations("onboarding"); + const tc = useTranslations("common"); const [step, setStep] = useState(0); const [loading, setLoading] = useState(true); @@ -60,6 +58,12 @@ export default function OnboardingWizard() { checkSetup(); }, [router]); + const STEPS = STEP_IDS.map((id, i) => ({ + id, + title: t(id === "done" ? "ready" : id), + icon: STEP_ICONS[i], + })); + const currentStep = STEPS[step]; const isLastStep = step === STEPS.length - 1; @@ -88,12 +92,12 @@ export default function OnboardingWizard() { }); if (!res.ok) { const data = await res.json().catch(() => ({})); - setErrorMessage(data.error || "Failed to set password. Try again."); + setErrorMessage(data.error || t("failedSetPassword")); return; } handleNext(); } catch { - setErrorMessage("Connection error. Please try again."); + setErrorMessage(t("connectionError")); } }; @@ -123,18 +127,18 @@ export default function OnboardingWizard() { }); if (!res.ok) { const data = await res.json().catch(() => ({})); - setErrorMessage(data.error || "Failed to add provider. Try again."); + setErrorMessage(data.error || t("failedAddProvider")); return; } handleNext(); } catch { - setErrorMessage("Connection error. Please try again."); + setErrorMessage(t("connectionError")); } }; const handleTestProvider = async () => { setTestStatus("testing"); - setTestMessage("Testing connection..."); + setTestMessage(t("testingConnection")); try { const res = await fetch("/api/providers"); if (!res.ok) throw new Error("Failed to fetch"); @@ -142,21 +146,21 @@ export default function OnboardingWizard() { const conn = data.connections?.[0]; if (!conn) { setTestStatus("error"); - setTestMessage("No provider found. You can add one from the dashboard later."); + setTestMessage(t("noProviderFound")); return; } const testRes = await fetch(`/api/providers/${conn.id}/test`, { method: "POST" }); if (testRes.ok) { setTestStatus("success"); - setTestMessage("Connection successful! Your provider is ready."); + setTestMessage(t("connectionSuccessful")); } else { const err = await testRes.json().catch(() => ({})); setTestStatus("error"); - setTestMessage(err.error || "Test failed, but you can configure this later."); + setTestMessage(err.error || t("testFailed")); } } catch { setTestStatus("error"); - setTestMessage("Could not test right now. You can test from the dashboard."); + setTestMessage(t("couldNotTest")); } }; @@ -176,7 +180,7 @@ export default function OnboardingWizard() { if (loading) { return (
- OmniRoute is your local AI API proxy. - It routes requests to multiple AI providers with load balancing, failover, and - usage tracking. + OmniRoute{" "} + {t("welcomeDesc").replace("OmniRoute is your local AI API proxy. ", "")}
- Set a password to protect your dashboard, or skip for now. -
+{t("securityDesc")}
{!skipSecurity && (Passwords do not match
+{t("passwordsMismatch")}
)}- Connect your first AI provider. You can add more later. -
+{t("providerDesc")}