Files
testing-tool/pages/Base64Converter/index.tsx
T
雨霖铃 aa23a263fe refactor: 迁移 i18n 系统从 react-i18next 到 chrome.i18n
- 移除 react-i18next、i18next 及相关依赖
- 删除旧的 i18n/ 目录和 useLazyTranslation 工具
- 新增 utils/chromeI18n.ts 类型安全 wrapper(useI18n Hook + getMessage)
- 生成 public/_locales/{zh,en}/messages.json(298 个翻译 key)
- 批量更新 39+ 组件文件的导入和翻译调用
- 转换翻译键格式:namespace:key → namespace_key
- 修复 ErrorBoundary/PageErrorBoundary 从 withTranslation HOC 改为直接调用 getMessage
- 更新 vitest.setup.ts mock 加载实际翻译文本
- 修复 11 个测试文件的断言以匹配中文翻译
- TypeScript、ESLint、547 项测试全部通过

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
2026-05-28 19:21:54 +08:00

44 lines
1.6 KiB
TypeScript

import { useI18n } from '@/utils/chromeI18n';
import { useStorageState } from '@/utils/useStorageState';
import type { Base64ConverterPageMode } from '@/types/storage';
import TextMode from './TextMode';
import Base64ConverterSection from './Base64ConverterSection'; // ✅ 正确对接全新的一体化大组件
import SwitchButtonGroup from '@/components/SwitchButtonGroup';
const VALID_PAGE_MODES: readonly Base64ConverterPageMode[] = ['text', 'file', 'image'];
const isValidPageMode = (val: unknown): val is Base64ConverterPageMode =>
typeof val === 'string' && (VALID_PAGE_MODES as readonly string[]).includes(val);
type PageMode = Base64ConverterPageMode;
export default function Index() {
const { t } = useI18n('base64Converter');
const [pageMode, setPageMode] = useStorageState(
'base64Converter/pageMode',
'text',
isValidPageMode,
);
return (
<div className="p-4 w-full flex flex-col space-y-4 min-h-[520px] select-none">
<SwitchButtonGroup
value={pageMode}
options={[
{ value: 'text', label: t('base64Converter:textMode') },
{ value: 'file', label: t('base64Converter:fileMode') },
{ value: 'image', label: t('base64Converter:imageMode') },
]}
onChange={(value: PageMode) => setPageMode(value)}
size="small"
className="w-full sm:w-auto"
/>
<div className="w-full pt-1">
{pageMode === 'text' && <TextMode onSwitchToImageMode={() => setPageMode('image')} />}
{pageMode === 'file' && <Base64ConverterSection mode="file" />}
{pageMode === 'image' && <Base64ConverterSection mode="image" />}
</div>
</div>
);
}