fix(i18n): add internationalization support for app names
- Add i18n for Claude/Codex/Gemini app names in AppSwitcher - Use useTranslation hook with existing translation keys - Fix ASCII diagram alignment in README files
This commit is contained in:
16
README.md
16
README.md
@@ -167,18 +167,18 @@ Download the latest `CC-Switch-v{version}-Linux.deb` package or `CC-Switch-v{ver
|
||||
```
|
||||
┌─────────────────────────────────────────────────────────────┐
|
||||
│ Frontend (React + TS) │
|
||||
│ ┌─────────────┐ ┌──────────────┐ ┌──────────────────┐ │
|
||||
│ │ Components │ │ Hooks │ │ TanStack Query │ │
|
||||
│ │ (UI) │──│ (Bus. Logic) │──│ (Cache/Sync) │ │
|
||||
│ └─────────────┘ └──────────────┘ └──────────────────┘ │
|
||||
│ ┌─────────────┐ ┌──────────────┐ ┌──────────────────┐ │
|
||||
│ │ Components │ │ Hooks │ │ TanStack Query │ │
|
||||
│ │ (UI) │──│ (Bus. Logic) │──│ (Cache/Sync) │ │
|
||||
│ └─────────────┘ └──────────────┘ └──────────────────┘ │
|
||||
└────────────────────────┬────────────────────────────────────┘
|
||||
│ Tauri IPC
|
||||
┌────────────────────────▼────────────────────────────────────┐
|
||||
│ Backend (Tauri + Rust) │
|
||||
│ ┌─────────────┐ ┌──────────────┐ ┌──────────────────┐ │
|
||||
│ │ Commands │ │ Services │ │ Models/Config │ │
|
||||
│ │ (API Layer) │──│ (Bus. Layer) │──│ (Data) │ │
|
||||
│ └─────────────┘ └──────────────┘ └──────────────────┘ │
|
||||
│ ┌─────────────┐ ┌──────────────┐ ┌──────────────────┐ │
|
||||
│ │ Commands │ │ Services │ │ Models/Config │ │
|
||||
│ │ (API Layer) │──│ (Bus. Layer) │──│ (Data) │ │
|
||||
│ └─────────────┘ └──────────────┘ └──────────────────┘ │
|
||||
└─────────────────────────────────────────────────────────────┘
|
||||
```
|
||||
|
||||
|
||||
20
README_ZH.md
20
README_ZH.md
@@ -166,19 +166,19 @@ brew upgrade --cask cc-switch
|
||||
|
||||
```
|
||||
┌─────────────────────────────────────────────────────────────┐
|
||||
│ 前端 (React + TS) │
|
||||
│ ┌─────────────┐ ┌──────────────┐ ┌──────────────────┐ │
|
||||
│ │ Components │ │ Hooks │ │ TanStack Query │ │
|
||||
│ │ (UI) │──│ (业务逻辑) │──│ (缓存/同步) │ │
|
||||
│ └─────────────┘ └──────────────┘ └──────────────────┘ │
|
||||
│ 前端 (React + TS) │
|
||||
│ ┌─────────────┐ ┌──────────────┐ ┌──────────────────┐ │
|
||||
│ │ Components │ │ Hooks │ │ TanStack Query │ │
|
||||
│ │ (UI) │──│ (业务逻辑) │──│ (缓存/同步) │ │
|
||||
│ └─────────────┘ └──────────────┘ └──────────────────┘ │
|
||||
└────────────────────────┬────────────────────────────────────┘
|
||||
│ Tauri IPC
|
||||
┌────────────────────────▼────────────────────────────────────┐
|
||||
│ 后端 (Tauri + Rust) │
|
||||
│ ┌─────────────┐ ┌──────────────┐ ┌──────────────────┐ │
|
||||
│ │ Commands │ │ Services │ │ Models/Config │ │
|
||||
│ │ (API 层) │──│ (业务层) │──│ (数据) │ │
|
||||
│ └─────────────┘ └──────────────┘ └──────────────────┘ │
|
||||
│ 后端 (Tauri + Rust) │
|
||||
│ ┌─────────────┐ ┌──────────────┐ ┌──────────────────┐ │
|
||||
│ │ Commands │ │ Services │ │ Models/Config │ │
|
||||
│ │ (API 层) │──│ (业务层) │──│ (数据) │ │
|
||||
│ └─────────────┘ └──────────────┘ └──────────────────┘ │
|
||||
└─────────────────────────────────────────────────────────────┘
|
||||
```
|
||||
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import type { AppId } from "@/lib/api";
|
||||
import { ClaudeIcon, CodexIcon, GeminiIcon } from "./BrandIcons";
|
||||
import { useTranslation } from "react-i18next";
|
||||
|
||||
interface AppSwitcherProps {
|
||||
activeApp: AppId;
|
||||
@@ -7,6 +8,7 @@ interface AppSwitcherProps {
|
||||
}
|
||||
|
||||
export function AppSwitcher({ activeApp, onSwitch }: AppSwitcherProps) {
|
||||
const { t } = useTranslation();
|
||||
const handleSwitch = (app: AppId) => {
|
||||
if (app === activeApp) return;
|
||||
onSwitch(app);
|
||||
@@ -31,7 +33,7 @@ export function AppSwitcher({ activeApp, onSwitch }: AppSwitcherProps) {
|
||||
: "text-gray-500 dark:text-gray-400 group-hover:text-[#D97757] dark:group-hover:text-[#D97757] transition-colors duration-200"
|
||||
}
|
||||
/>
|
||||
<span>Claude</span>
|
||||
<span>{t("apps.claude")}</span>
|
||||
</button>
|
||||
|
||||
<button
|
||||
@@ -44,7 +46,7 @@ export function AppSwitcher({ activeApp, onSwitch }: AppSwitcherProps) {
|
||||
}`}
|
||||
>
|
||||
<CodexIcon size={16} />
|
||||
<span>Codex</span>
|
||||
<span>{t("apps.codex")}</span>
|
||||
</button>
|
||||
|
||||
<button
|
||||
@@ -64,7 +66,7 @@ export function AppSwitcher({ activeApp, onSwitch }: AppSwitcherProps) {
|
||||
: "text-gray-500 dark:text-gray-400 group-hover:text-[#4285F4] dark:group-hover:text-[#4285F4] transition-colors duration-200"
|
||||
}
|
||||
/>
|
||||
<span>Gemini</span>
|
||||
<span>{t("apps.gemini")}</span>
|
||||
</button>
|
||||
</div>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user