初步集成next-intl支持多语言

This commit is contained in:
xintaofei
2026-03-07 10:08:05 +08:00
parent efd87dbd9c
commit 934f689b08
20 changed files with 1186 additions and 89 deletions

View File

@@ -1,7 +1,10 @@
import type { Metadata } from "next"
import "./globals.css"
import { JetBrains_Mono } from "next/font/google"
import { NextIntlClientProvider } from "next-intl"
import { AppI18nProvider } from "@/components/i18n-provider"
import { ThemeProvider } from "@/components/theme-provider"
import enMessages from "@/i18n/messages/en.json"
const jetbrainsMono = JetBrains_Mono({
subsets: ["latin"],
@@ -21,14 +24,18 @@ export default function RootLayout({
return (
<html lang="en" className={jetbrainsMono.variable} suppressHydrationWarning>
<body>
<ThemeProvider
attribute="class"
defaultTheme="system"
enableSystem
disableTransitionOnChange
>
{children}
</ThemeProvider>
<NextIntlClientProvider locale="en" messages={enMessages}>
<AppI18nProvider>
<ThemeProvider
attribute="class"
defaultTheme="system"
enableSystem
disableTransitionOnChange
>
{children}
</ThemeProvider>
</AppI18nProvider>
</NextIntlClientProvider>
</body>
</html>
)

View File

@@ -1,12 +1,17 @@
"use client"
import { Suspense } from "react"
import { useTranslations } from "next-intl"
import { AcpAgentSettings } from "@/components/settings/acp-agent-settings"
export default function SettingsAgentsPage() {
const t = useTranslations("SettingsPages")
return (
<Suspense
fallback={
<div className="h-full flex items-center justify-center text-sm text-muted-foreground">
Agent ...
{t("agentsLoading")}
</div>
}
>

View File

@@ -0,0 +1,141 @@
"use client"
import {
createContext,
useCallback,
useContext,
useEffect,
useMemo,
useState,
useSyncExternalStore,
} from "react"
import { NextIntlClientProvider, type AbstractIntlMessages } from "next-intl"
import enMessages from "@/i18n/messages/en.json"
import zhCNMessages from "@/i18n/messages/zh-CN.json"
import zhTWMessages from "@/i18n/messages/zh-TW.json"
import {
APP_LOCALE_TO_INTL_LOCALE,
DEFAULT_LANGUAGE_SETTINGS,
getSystemLocaleCandidates,
normalizeLanguageSettings,
resolveAppLocale,
} from "@/lib/i18n"
import { getSystemLanguageSettings } from "@/lib/tauri"
import type { AppLocale, SystemLanguageSettings } from "@/lib/types"
interface AppI18nContextValue {
appLocale: AppLocale
languageSettings: SystemLanguageSettings
languageSettingsLoaded: boolean
setLanguageSettings: (settings: SystemLanguageSettings) => void
}
const MESSAGES_BY_LOCALE: Record<AppLocale, AbstractIntlMessages> = {
en: enMessages,
zh_cn: zhCNMessages,
zh_tw: zhTWMessages,
}
const AppI18nContext = createContext<AppI18nContextValue | null>(null)
function subscribeSystemLocale(onStoreChange: () => void) {
if (typeof window === "undefined") return () => {}
window.addEventListener("languagechange", onStoreChange)
return () => {
window.removeEventListener("languagechange", onStoreChange)
}
}
function getSystemLocaleSnapshot(): string {
return getSystemLocaleCandidates().join("|")
}
function getSystemLocaleServerSnapshot(): string {
return ""
}
export function useAppI18n() {
const context = useContext(AppI18nContext)
if (!context) {
throw new Error("useAppI18n must be used within AppI18nProvider")
}
return context
}
export function AppI18nProvider({ children }: { children: React.ReactNode }) {
const [languageSettings, setLanguageSettingsState] =
useState<SystemLanguageSettings>(DEFAULT_LANGUAGE_SETTINGS)
const [languageSettingsLoaded, setLanguageSettingsLoaded] = useState(false)
const systemLocaleSnapshot = useSyncExternalStore(
subscribeSystemLocale,
getSystemLocaleSnapshot,
getSystemLocaleServerSnapshot
)
const systemLocaleCandidates = useMemo(
() => (systemLocaleSnapshot ? systemLocaleSnapshot.split("|") : []),
[systemLocaleSnapshot]
)
const setLanguageSettings = useCallback(
(settings: SystemLanguageSettings) => {
setLanguageSettingsState(normalizeLanguageSettings(settings))
},
[]
)
useEffect(() => {
let cancelled = false
getSystemLanguageSettings()
.then((settings) => {
if (cancelled) return
setLanguageSettings(settings)
})
.catch((err) => {
console.error("[i18n] load language settings failed:", err)
})
.finally(() => {
if (!cancelled) {
setLanguageSettingsLoaded(true)
}
})
return () => {
cancelled = true
}
}, [setLanguageSettings])
const appLocale = useMemo(
() => resolveAppLocale(languageSettings, systemLocaleCandidates),
[languageSettings, systemLocaleCandidates]
)
const intlLocale = APP_LOCALE_TO_INTL_LOCALE[appLocale]
useEffect(() => {
document.documentElement.lang = intlLocale
}, [intlLocale])
const contextValue = useMemo<AppI18nContextValue>(
() => ({
appLocale,
languageSettings,
languageSettingsLoaded,
setLanguageSettings,
}),
[appLocale, languageSettings, languageSettingsLoaded, setLanguageSettings]
)
return (
<AppI18nContext.Provider value={contextValue}>
<NextIntlClientProvider
locale={intlLocale}
messages={MESSAGES_BY_LOCALE[appLocale]}
>
{children}
</NextIntlClientProvider>
</AppI18nContext.Provider>
)
}

View File

@@ -1,6 +1,7 @@
"use client"
import { Monitor, Moon, Sun } from "lucide-react"
import { useTranslations } from "next-intl"
import { useTheme } from "next-themes"
import {
Select,
@@ -13,13 +14,14 @@ import {
type ThemeMode = "system" | "light" | "dark"
export function AppearanceSettings() {
const t = useTranslations("AppearanceSettings")
const { theme, resolvedTheme, setTheme } = useTheme()
const resolvedThemeLabel =
resolvedTheme === "dark"
? "深色"
? t("resolvedTheme.dark")
: resolvedTheme === "light"
? "浅色"
: "--"
? t("resolvedTheme.light")
: t("resolvedTheme.unknown")
return (
<div className="h-full overflow-auto">
@@ -27,41 +29,41 @@ export function AppearanceSettings() {
<section className="rounded-xl border bg-card p-4 space-y-4">
<div className="flex items-center gap-2">
<Sun className="h-4 w-4 text-muted-foreground" />
<h2 className="text-sm font-semibold"></h2>
<h2 className="text-sm font-semibold">{t("sectionTitle")}</h2>
</div>
<p className="text-xs text-muted-foreground leading-5">
{t("sectionDescription")}
</p>
<div className="space-y-2">
<label className="text-xs font-medium text-muted-foreground">
{t("themeMode")}
</label>
<Select
value={theme ?? "system"}
onValueChange={(value) => setTheme(value as ThemeMode)}
>
<SelectTrigger className="w-56">
<SelectValue placeholder="请选择主题模式" />
<SelectValue placeholder={t("placeholder")} />
</SelectTrigger>
<SelectContent align="start">
<SelectItem value="system">
<span className="inline-flex items-center gap-2">
<Monitor className="h-3.5 w-3.5" />
{t("system")}
</span>
</SelectItem>
<SelectItem value="light">
<span className="inline-flex items-center gap-2">
<Sun className="h-3.5 w-3.5" />
{t("light")}
</span>
</SelectItem>
<SelectItem value="dark">
<span className="inline-flex items-center gap-2">
<Moon className="h-3.5 w-3.5" />
{t("dark")}
</span>
</SelectItem>
</SelectContent>
@@ -70,7 +72,7 @@ export function AppearanceSettings() {
className="text-[11px] text-muted-foreground"
suppressHydrationWarning
>
{resolvedThemeLabel}
{t("currentTheme", { theme: resolvedThemeLabel })}
</p>
</div>
</section>

View File

@@ -9,6 +9,7 @@ import {
PlugZap,
Settings,
} from "lucide-react"
import { useTranslations } from "next-intl"
import { usePathname } from "next/navigation"
import { useRouter } from "next/navigation"
import { Button } from "@/components/ui/button"
@@ -18,39 +19,39 @@ import { AppTitleBar } from "@/components/layout/app-title-bar"
interface SettingsNavItem {
href: string
label: string
labelKey: string
icon: ComponentType<{ className?: string }>
}
const SETTINGS_NAV_ITEMS: SettingsNavItem[] = [
{
href: "/settings/appearance",
label: "Appearance",
labelKey: "appearance",
icon: Palette,
},
{
href: "/settings/agents",
label: "Agents",
labelKey: "agents",
icon: Bot,
},
{
href: "/settings/mcp",
label: "MCP",
labelKey: "mcp",
icon: PlugZap,
},
{
href: "/settings/skills",
label: "Skills",
labelKey: "skills",
icon: BookOpenText,
},
{
href: "/settings/shortcuts",
label: "Shortcuts",
labelKey: "shortcuts",
icon: Keyboard,
},
{
href: "/settings/system",
label: "System",
labelKey: "system",
icon: Settings,
},
]
@@ -73,6 +74,7 @@ function isWindowsRuntime(): boolean {
}
export function SettingsShell({ children }: SettingsShellProps) {
const t = useTranslations("SettingsShell")
const pathname = usePathname()
const router = useRouter()
const normalizedPathname = normalizePath(pathname)
@@ -101,14 +103,14 @@ export function SettingsShell({ children }: SettingsShellProps) {
<div className="h-screen flex flex-col overflow-hidden bg-background text-foreground">
<AppTitleBar
center={
<div className="text-sm font-bold tracking-tight">Settings</div>
<div className="text-sm font-bold tracking-tight">{t("title")}</div>
}
/>
<div className="flex-1 min-h-0 flex">
<aside className="w-56 shrink-0 border-r p-3">
<div className="px-1 pb-2 text-[11px] font-medium text-muted-foreground">
Preferences
{t("preferences")}
</div>
<nav className="space-y-1">
{SETTINGS_NAV_ITEMS.map((item) => {
@@ -128,7 +130,7 @@ export function SettingsShell({ children }: SettingsShellProps) {
>
<span className="inline-flex items-center gap-1">
<Icon className="h-3.5 w-3.5" />
{item.label}
{t(`nav.${item.labelKey}`)}
</span>
</Button>
)

View File

@@ -1,12 +1,33 @@
"use client"
import { useCallback, useEffect, useState } from "react"
import { ArrowUpCircle, Loader2, RefreshCw, Save, Wifi } from "lucide-react"
import { useCallback, useEffect, useMemo, useState } from "react"
import {
ArrowUpCircle,
Languages,
Loader2,
RefreshCw,
Save,
Wifi,
} from "lucide-react"
import type { Update } from "@tauri-apps/plugin-updater"
import { useLocale, useTranslations } from "next-intl"
import { toast } from "sonner"
import { useAppI18n } from "@/components/i18n-provider"
import { Button } from "@/components/ui/button"
import { Input } from "@/components/ui/input"
import { getSystemProxySettings, updateSystemProxySettings } from "@/lib/tauri"
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from "@/components/ui/select"
import {
getSystemProxySettings,
updateSystemLanguageSettings,
updateSystemProxySettings,
} from "@/lib/tauri"
import type { AppLocale } from "@/lib/types"
import {
checkAppUpdate,
closeAppUpdate,
@@ -16,10 +37,24 @@ import {
} from "@/lib/updater"
const PROXY_EXAMPLE = "http://127.0.0.1:7890"
const APP_LANGUAGE_VALUES = ["en", "zh_cn", "zh_tw"] as const
type LanguageSelectValue = "system" | AppLocale
function isAppLocale(value: string): value is AppLocale {
return APP_LANGUAGE_VALUES.includes(value as AppLocale)
}
export function SystemNetworkSettings() {
const t = useTranslations("SystemSettings")
const tLanguage = useTranslations("Language")
const locale = useLocale()
const { languageSettings, languageSettingsLoaded, setLanguageSettings } =
useAppI18n()
const [loading, setLoading] = useState(true)
const [saving, setSaving] = useState(false)
const [savingLanguage, setSavingLanguage] = useState(false)
const [enabled, setEnabled] = useState(false)
const [proxyUrl, setProxyUrl] = useState("")
const [loadError, setLoadError] = useState<string | null>(null)
@@ -30,39 +65,60 @@ export function SystemNetworkSettings() {
const [updateError, setUpdateError] = useState<string | null>(null)
const [lastCheckedAt, setLastCheckedAt] = useState<Date | null>(null)
const [appLanguage, setAppLanguage] = useState<LanguageSelectValue>(
languageSettings.mode === "system" ? "system" : languageSettings.language
)
useEffect(() => {
setAppLanguage(
languageSettings.mode === "system" ? "system" : languageSettings.language
)
}, [languageSettings])
const languageLabels = useMemo(
() => ({
en: tLanguage("english"),
zh_cn: tLanguage("simplifiedChinese"),
zh_tw: tLanguage("traditionalChinese"),
}),
[tLanguage]
)
const formattedLastCheckedAt = useMemo(() => {
if (!lastCheckedAt) return null
return new Intl.DateTimeFormat(locale, {
dateStyle: "medium",
timeStyle: "short",
}).format(lastCheckedAt)
}, [lastCheckedAt, locale])
const loadSettings = useCallback(async () => {
setLoading(true)
setLoadError(null)
try {
const settings = await getSystemProxySettings()
setEnabled(settings.enabled)
setProxyUrl(settings.proxy_url ?? "")
const [proxySettings, version] = await Promise.all([
getSystemProxySettings(),
getCurrentAppVersion(),
])
setEnabled(proxySettings.enabled)
setProxyUrl(proxySettings.proxy_url ?? "")
setCurrentVersion(version)
} catch (err) {
const message = err instanceof Error ? err.message : String(err)
setLoadError(message)
console.error("[Settings] load system settings failed:", err)
} finally {
setLoading(false)
}
}, [])
const loadAppVersion = useCallback(async () => {
try {
const version = await getCurrentAppVersion()
setCurrentVersion(version)
} catch (err) {
console.error("[Settings] load app version failed:", err)
}
}, [])
useEffect(() => {
loadSettings().catch((err) => {
console.error("[Settings] load system proxy settings failed:", err)
console.error("[Settings] load system settings failed:", err)
})
loadAppVersion().catch((err) => {
console.error("[Settings] load app version failed:", err)
})
}, [loadSettings, loadAppVersion])
}, [loadSettings])
useEffect(() => {
return () => {
@@ -75,7 +131,7 @@ export function SystemNetworkSettings() {
const saveSettings = useCallback(async () => {
if (enabled && !proxyUrl.trim()) {
toast.error("启用代理时必须填写代理地址")
toast.error(t("proxyRequired"))
return
}
@@ -87,14 +143,34 @@ export function SystemNetworkSettings() {
})
setEnabled(next.enabled)
setProxyUrl(next.proxy_url ?? "")
toast.success("系统代理设置已保存")
toast.success(t("saveSuccess"))
} catch (err) {
const message = err instanceof Error ? err.message : String(err)
toast.error(`保存失败:${message}`)
toast.error(t("saveFailed", { message }))
} finally {
setSaving(false)
}
}, [enabled, proxyUrl])
}, [enabled, proxyUrl, t])
const saveLanguage = useCallback(async () => {
setSavingLanguage(true)
try {
const next = await updateSystemLanguageSettings({
mode: appLanguage === "system" ? "system" : "manual",
language:
appLanguage === "system" ? languageSettings.language : appLanguage,
})
setLanguageSettings(next)
toast.success(t("languageSaveSuccess"))
} catch (err) {
const message = err instanceof Error ? err.message : String(err)
toast.error(t("languageSaveFailed", { message }))
} finally {
setSavingLanguage(false)
}
}, [appLanguage, languageSettings.language, setLanguageSettings, t])
const checkForUpdates = useCallback(async () => {
setCheckingUpdate(true)
@@ -108,10 +184,10 @@ export function SystemNetworkSettings() {
if (result.update) {
setAvailableUpdate(result.update)
toast.success(`发现新版本 v${result.update.version}`)
toast.success(t("foundUpdate", { version: result.update.version }))
} else {
setAvailableUpdate(null)
toast.success("当前已经是最新版本")
toast.success(t("alreadyLatest"))
}
if (previousUpdate && previousUpdate !== result.update) {
@@ -120,11 +196,11 @@ export function SystemNetworkSettings() {
} catch (err) {
const message = err instanceof Error ? err.message : String(err)
setUpdateError(message)
toast.error(`检查更新失败:${message}`)
toast.error(t("checkUpdateFailed", { message }))
} finally {
setCheckingUpdate(false)
}
}, [availableUpdate])
}, [availableUpdate, t])
const installUpdate = useCallback(async () => {
if (!availableUpdate) return
@@ -134,22 +210,22 @@ export function SystemNetworkSettings() {
try {
await installAppUpdate(availableUpdate)
toast.success("升级包已安装,正在重启应用")
toast.success(t("installSuccess"))
await relaunchApp()
} catch (err) {
const message = err instanceof Error ? err.message : String(err)
setUpdateError(message)
toast.error(`升级失败:${message}`)
toast.error(t("installFailed", { message }))
} finally {
setInstallingUpdate(false)
}
}, [availableUpdate])
}, [availableUpdate, t])
if (loading) {
return (
<div className="h-full flex items-center justify-center text-sm text-muted-foreground gap-2">
<Loader2 className="h-4 w-4 animate-spin" />
...
{t("loading")}
</div>
)
}
@@ -158,26 +234,25 @@ export function SystemNetworkSettings() {
<div className="h-full overflow-auto">
<div className="w-full space-y-4">
<section className="space-y-1">
<h1 className="text-sm font-semibold"></h1>
<h1 className="text-sm font-semibold">{t("sectionTitle")}</h1>
<p className="text-xs text-muted-foreground">
{t("sectionDescription")}
</p>
</section>
<section className="rounded-xl border bg-card p-4 space-y-4">
<div className="flex items-center gap-2">
<Wifi className="h-4 w-4 text-muted-foreground" />
<h2 className="text-sm font-semibold"></h2>
<h2 className="text-sm font-semibold">{t("proxyTitle")}</h2>
</div>
<p className="text-xs text-muted-foreground leading-5">
ACP Agent Git
{t("proxyDescription")}
</p>
{loadError && (
<div className="rounded-md border border-red-500/30 bg-red-500/5 px-3 py-2 text-xs text-red-400">
{loadError}
{t("loadFailed", { message: loadError })}
</div>
)}
@@ -187,12 +262,12 @@ export function SystemNetworkSettings() {
checked={enabled}
onChange={(event) => setEnabled(event.target.checked)}
/>
{t("enableProxy")}
</label>
<div className="space-y-2">
<label className="text-xs font-medium text-muted-foreground">
{t("proxyAddress")}
</label>
<Input
value={proxyUrl}
@@ -200,8 +275,7 @@ export function SystemNetworkSettings() {
placeholder={PROXY_EXAMPLE}
/>
<p className="text-[11px] text-muted-foreground">
http(s)/socks5{PROXY_EXAMPLE}
{t("proxyHint", { example: PROXY_EXAMPLE })}
</p>
</div>
@@ -210,12 +284,69 @@ export function SystemNetworkSettings() {
{saving ? (
<>
<Loader2 className="h-3.5 w-3.5 animate-spin" />
...
{t("saving")}
</>
) : (
<>
<Save className="h-3.5 w-3.5" />
{t("save")}
</>
)}
</Button>
</div>
</section>
<section className="rounded-xl border bg-card p-4 space-y-4">
<div className="flex items-center gap-2">
<Languages className="h-4 w-4 text-muted-foreground" />
<h2 className="text-sm font-semibold">{t("languageTitle")}</h2>
</div>
<p className="text-xs text-muted-foreground leading-5">
{t("languageDescription")}
</p>
<div className="space-y-2">
<label className="text-xs font-medium text-muted-foreground">
{t("appLanguage")}
</label>
<Select
value={appLanguage}
onValueChange={(value) => {
if (value === "system") {
setAppLanguage("system")
return
}
if (!isAppLocale(value)) return
setAppLanguage(value)
}}
disabled={savingLanguage || !languageSettingsLoaded}
>
<SelectTrigger className="w-full sm:w-56">
<SelectValue />
</SelectTrigger>
<SelectContent align="start">
<SelectItem value="system">
{tLanguage("followSystem")}
</SelectItem>
<SelectItem value="en">{languageLabels.en}</SelectItem>
<SelectItem value="zh_cn">{languageLabels.zh_cn}</SelectItem>
<SelectItem value="zh_tw">{languageLabels.zh_tw}</SelectItem>
</SelectContent>
</Select>
</div>
<div className="flex justify-end">
<Button size="sm" onClick={saveLanguage} disabled={savingLanguage}>
{savingLanguage ? (
<>
<Loader2 className="h-3.5 w-3.5 animate-spin" />
{t("saving")}
</>
) : (
<>
<Save className="h-3.5 w-3.5" />
{t("save")}
</>
)}
</Button>
@@ -225,37 +356,39 @@ export function SystemNetworkSettings() {
<section className="rounded-xl border bg-card p-4 space-y-4">
<div className="flex items-center gap-2">
<RefreshCw className="h-4 w-4 text-muted-foreground" />
<h2 className="text-sm font-semibold"></h2>
<h2 className="text-sm font-semibold">{t("updateTitle")}</h2>
</div>
<p className="text-xs text-muted-foreground leading-5">
{t("updateDescription")}
</p>
<div className="grid grid-cols-1 gap-2 text-xs sm:grid-cols-2">
<div className="rounded-md border bg-muted/20 px-3 py-2">
<div className="text-muted-foreground"></div>
<div className="text-muted-foreground">{t("currentVersion")}</div>
<div className="mt-1 font-medium">
{currentVersion ? `v${currentVersion}` : "-"}
</div>
</div>
<div className="rounded-md border bg-muted/20 px-3 py-2">
<div className="text-muted-foreground"></div>
<div className="text-muted-foreground">
{t("upgradableVersion")}
</div>
<div className="mt-1 font-medium">
{availableUpdate ? `v${availableUpdate.version}` : "暂无"}
{availableUpdate ? `v${availableUpdate.version}` : t("none")}
</div>
</div>
</div>
{lastCheckedAt && (
{formattedLastCheckedAt && (
<p className="text-[11px] text-muted-foreground">
{lastCheckedAt.toLocaleString()}
{t("lastChecked", { time: formattedLastCheckedAt })}
</p>
)}
{updateError && (
<div className="rounded-md border border-red-500/30 bg-red-500/5 px-3 py-2 text-xs text-red-400">
{updateError}
{t("updateError", { message: updateError })}
</div>
)}
@@ -269,12 +402,12 @@ export function SystemNetworkSettings() {
{checkingUpdate ? (
<>
<Loader2 className="h-3.5 w-3.5 animate-spin" />
...
{t("checking")}
</>
) : (
<>
<RefreshCw className="h-3.5 w-3.5" />
{t("checkUpdate")}
</>
)}
</Button>
@@ -288,12 +421,12 @@ export function SystemNetworkSettings() {
{installingUpdate ? (
<>
<Loader2 className="h-3.5 w-3.5 animate-spin" />
...
{t("updating")}
</>
) : (
<>
<ArrowUpCircle className="h-3.5 w-3.5" />
v{availableUpdate.version}
{t("upgradeTo", { version: availableUpdate.version })}
</>
)}
</Button>

75
src/i18n/messages/en.json Normal file
View File

@@ -0,0 +1,75 @@
{
"Language": {
"followSystem": "Follow System",
"english": "English",
"simplifiedChinese": "Simplified Chinese",
"traditionalChinese": "Traditional Chinese"
},
"SettingsShell": {
"title": "Settings",
"preferences": "Preferences",
"nav": {
"appearance": "Appearance",
"agents": "Agents",
"mcp": "MCP",
"skills": "Skills",
"shortcuts": "Shortcuts",
"system": "System"
}
},
"AppearanceSettings": {
"sectionTitle": "Theme Appearance",
"sectionDescription": "Choose light, dark, or follow system. Settings are saved automatically.",
"themeMode": "Theme mode",
"placeholder": "Select theme mode",
"system": "Follow system",
"light": "Light",
"dark": "Dark",
"currentTheme": "Current effective theme: {theme}",
"resolvedTheme": {
"light": "Light",
"dark": "Dark",
"unknown": "--"
}
},
"SystemSettings": {
"loading": "Loading...",
"sectionTitle": "System Management",
"sectionDescription": "Manage network proxy, app updates and language preferences.",
"proxyTitle": "Network Proxy",
"proxyDescription": "When enabled, subsequent network requests prefer this proxy (including ACP chat, agent installation and Git remote operations).",
"loadFailed": "Load failed: {message}",
"enableProxy": "Enable system proxy",
"proxyAddress": "Proxy address",
"proxyHint": "Supports http(s)/socks5, example: {example}. Only effective when system proxy is enabled.",
"save": "Save",
"saving": "Saving...",
"proxyRequired": "Proxy URL is required when proxy is enabled",
"saveSuccess": "System proxy settings saved",
"saveFailed": "Save failed: {message}",
"languageTitle": "Language",
"languageDescription": "Set app language. When following system locale, unsupported languages fall back to English.",
"appLanguage": "App language",
"languageSaveSuccess": "Language settings saved",
"languageSaveFailed": "Failed to save language settings: {message}",
"updateTitle": "App Update",
"updateDescription": "Check the configured release source for newer versions and install directly when available.",
"currentVersion": "Current version",
"upgradableVersion": "Available version",
"none": "None",
"lastChecked": "Last checked: {time}",
"updateError": "Update error: {message}",
"checking": "Checking...",
"checkUpdate": "Check for updates",
"updating": "Installing...",
"upgradeTo": "Upgrade to v{version}",
"foundUpdate": "New version v{version} found",
"alreadyLatest": "You're on the latest version",
"checkUpdateFailed": "Failed to check for updates: {message}",
"installSuccess": "Update installed. Relaunching app.",
"installFailed": "Update failed: {message}"
},
"SettingsPages": {
"agentsLoading": "Loading agent settings..."
}
}

View File

@@ -0,0 +1,75 @@
{
"Language": {
"followSystem": "跟随系统",
"english": "English",
"simplifiedChinese": "简体中文",
"traditionalChinese": "繁體中文"
},
"SettingsShell": {
"title": "设置",
"preferences": "偏好设置",
"nav": {
"appearance": "外观",
"agents": "Agents",
"mcp": "MCP",
"skills": "Skills",
"shortcuts": "快捷键",
"system": "系统"
}
},
"AppearanceSettings": {
"sectionTitle": "主题外观",
"sectionDescription": "选择浅色、深色或跟随系统主题,设置会自动保存。",
"themeMode": "主题模式",
"placeholder": "请选择主题模式",
"system": "跟随系统",
"light": "浅色",
"dark": "深色",
"currentTheme": "当前生效主题:{theme}",
"resolvedTheme": {
"light": "浅色",
"dark": "深色",
"unknown": "--"
}
},
"SystemSettings": {
"loading": "加载中...",
"sectionTitle": "系统管理",
"sectionDescription": "管理网络代理、应用升级与语言偏好。",
"proxyTitle": "网络代理",
"proxyDescription": "开启后,后续网络请求将优先走该代理(包括 ACP 对话、Agent 安装、Git 远程操作等)。",
"loadFailed": "加载失败:{message}",
"enableProxy": "启用系统代理",
"proxyAddress": "代理地址",
"proxyHint": "支持 http(s)/socks5示例{example}。仅在启用系统代理时生效。",
"save": "保存",
"saving": "保存中...",
"proxyRequired": "启用代理时必须填写代理地址",
"saveSuccess": "系统代理设置已保存",
"saveFailed": "保存失败:{message}",
"languageTitle": "语言",
"languageDescription": "设置应用语言。跟随系统时,若系统语言不受支持将回退为英文。",
"appLanguage": "应用语言",
"languageSaveSuccess": "语言设置已保存",
"languageSaveFailed": "语言设置保存失败:{message}",
"updateTitle": "应用升级",
"updateDescription": "点击检查后会从配置的发布源拉取最新版本信息,有新版本时可直接下载并安装。",
"currentVersion": "当前版本",
"upgradableVersion": "可升级版本",
"none": "暂无",
"lastChecked": "上次检查:{time}",
"updateError": "更新异常:{message}",
"checking": "检查中...",
"checkUpdate": "检查更新",
"updating": "升级中...",
"upgradeTo": "升级到 v{version}",
"foundUpdate": "发现新版本 v{version}",
"alreadyLatest": "当前已经是最新版本",
"checkUpdateFailed": "检查更新失败:{message}",
"installSuccess": "升级包已安装,正在重启应用",
"installFailed": "升级失败:{message}"
},
"SettingsPages": {
"agentsLoading": "加载 Agent 设置中..."
}
}

View File

@@ -0,0 +1,75 @@
{
"Language": {
"followSystem": "跟隨系統",
"english": "English",
"simplifiedChinese": "简体中文",
"traditionalChinese": "繁體中文"
},
"SettingsShell": {
"title": "設定",
"preferences": "偏好設定",
"nav": {
"appearance": "外觀",
"agents": "Agents",
"mcp": "MCP",
"skills": "Skills",
"shortcuts": "快捷鍵",
"system": "系統"
}
},
"AppearanceSettings": {
"sectionTitle": "主題外觀",
"sectionDescription": "選擇淺色、深色或跟隨系統主題,設定會自動儲存。",
"themeMode": "主題模式",
"placeholder": "請選擇主題模式",
"system": "跟隨系統",
"light": "淺色",
"dark": "深色",
"currentTheme": "目前生效主題:{theme}",
"resolvedTheme": {
"light": "淺色",
"dark": "深色",
"unknown": "--"
}
},
"SystemSettings": {
"loading": "載入中...",
"sectionTitle": "系統管理",
"sectionDescription": "管理網路代理、應用升級與語言偏好。",
"proxyTitle": "網路代理",
"proxyDescription": "啟用後,後續網路請求將優先走該代理(包含 ACP 對話、Agent 安裝、Git 遠端操作等)。",
"loadFailed": "載入失敗:{message}",
"enableProxy": "啟用系統代理",
"proxyAddress": "代理位址",
"proxyHint": "支援 http(s)/socks5範例{example}。僅在啟用系統代理時生效。",
"save": "儲存",
"saving": "儲存中...",
"proxyRequired": "啟用代理時必須填寫代理位址",
"saveSuccess": "系統代理設定已儲存",
"saveFailed": "儲存失敗:{message}",
"languageTitle": "語言",
"languageDescription": "設定應用語言。跟隨系統時,若系統語言不受支援將回退為英文。",
"appLanguage": "應用語言",
"languageSaveSuccess": "語言設定已儲存",
"languageSaveFailed": "語言設定儲存失敗:{message}",
"updateTitle": "應用升級",
"updateDescription": "點擊檢查後會從設定的發佈來源拉取最新版本資訊,有新版本時可直接下載並安裝。",
"currentVersion": "目前版本",
"upgradableVersion": "可升級版本",
"none": "暫無",
"lastChecked": "上次檢查:{time}",
"updateError": "更新異常:{message}",
"checking": "檢查中...",
"checkUpdate": "檢查更新",
"updating": "升級中...",
"upgradeTo": "升級到 v{version}",
"foundUpdate": "發現新版本 v{version}",
"alreadyLatest": "目前已是最新版本",
"checkUpdateFailed": "檢查更新失敗:{message}",
"installSuccess": "升級包已安裝,正在重新啟動應用",
"installFailed": "升級失敗:{message}"
},
"SettingsPages": {
"agentsLoading": "載入 Agent 設定中..."
}
}

7
src/i18n/request.ts Normal file
View File

@@ -0,0 +1,7 @@
import { getRequestConfig } from "next-intl/server"
import enMessages from "@/i18n/messages/en.json"
export default getRequestConfig(async () => ({
locale: "en",
messages: enMessages,
}))

84
src/lib/i18n.ts Normal file
View File

@@ -0,0 +1,84 @@
import type { AppLocale, SystemLanguageSettings } from "@/lib/types"
export const APP_LOCALES: readonly AppLocale[] = ["en", "zh_cn", "zh_tw"]
const FALLBACK_APP_LOCALE: AppLocale = "en"
export const DEFAULT_LANGUAGE_SETTINGS: SystemLanguageSettings = {
mode: "system",
language: FALLBACK_APP_LOCALE,
}
export const APP_LOCALE_TO_INTL_LOCALE: Record<AppLocale, string> = {
en: "en",
zh_cn: "zh-CN",
zh_tw: "zh-TW",
}
export function isAppLocale(value: unknown): value is AppLocale {
return APP_LOCALES.includes(value as AppLocale)
}
export function normalizeLanguageSettings(
settings: Partial<SystemLanguageSettings> | null | undefined
): SystemLanguageSettings {
const mode = settings?.mode === "manual" ? "manual" : "system"
const language = isAppLocale(settings?.language)
? settings.language
: FALLBACK_APP_LOCALE
return {
mode,
language,
}
}
function mapSystemLocaleToAppLocale(localeTag: string): AppLocale | null {
const normalized = localeTag.trim().toLowerCase().replace(/_/g, "-")
if (!normalized) return null
if (normalized.startsWith("en")) return "en"
if (
normalized.startsWith("zh-hant") ||
normalized.endsWith("-tw") ||
normalized.endsWith("-hk") ||
normalized.endsWith("-mo")
) {
return "zh_tw"
}
if (normalized.startsWith("zh")) return "zh_cn"
return null
}
export function getSystemLocaleCandidates(): string[] {
if (typeof navigator === "undefined") return []
const candidates = [
...(navigator.languages ?? []),
navigator.language,
].filter((value): value is string => Boolean(value))
return [...new Set(candidates)]
}
export function resolveSystemLocale(candidates: string[]): AppLocale | null {
for (const candidate of candidates) {
const resolved = mapSystemLocaleToAppLocale(candidate)
if (resolved) return resolved
}
return null
}
export function resolveAppLocale(
settings: SystemLanguageSettings,
systemLocaleCandidates: string[]
): AppLocale {
if (settings.mode === "manual") {
return settings.language
}
return resolveSystemLocale(systemLocaleCandidates) ?? FALLBACK_APP_LOCALE
}

View File

@@ -34,6 +34,7 @@ import type {
FileEditContent,
FileSaveResult,
GitLogEntry,
SystemLanguageSettings,
SystemProxySettings,
McpAppType,
LocalMcpServer,
@@ -277,6 +278,16 @@ export async function updateSystemProxySettings(
return invoke("update_system_proxy_settings", { settings })
}
export async function getSystemLanguageSettings(): Promise<SystemLanguageSettings> {
return invoke("get_system_language_settings")
}
export async function updateSystemLanguageSettings(
settings: SystemLanguageSettings
): Promise<SystemLanguageSettings> {
return invoke("update_system_language_settings", { settings })
}
export async function mcpScanLocal(): Promise<LocalMcpServer[]> {
return invoke("mcp_scan_local")
}

View File

@@ -490,6 +490,14 @@ export interface SystemProxySettings {
proxy_url: string | null
}
export type AppLocale = "en" | "zh_cn" | "zh_tw"
export type LanguageMode = "system" | "manual"
export interface SystemLanguageSettings {
mode: LanguageMode
language: AppLocale
}
export type McpAppType = "claude_code" | "codex" | "open_code"
export interface LocalMcpServer {