feat(client): add i18n with i18next and react-i18next
- install i18next and react-i18next - create src/i18n/index.ts bootstrapping i18next with initReactI18next - add src/i18n/locales/en.json with keys for nav, all pages, and ThemeSwitcher - replace hardcoded English strings in App, all pages, and ThemeSwitcher with t() - move static column definitions inside components where useTranslation is available
This commit is contained in:
@@ -1,16 +1,18 @@
|
||||
import { Sun, Moon } from 'lucide-react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { useTheme } from '../../hooks/useTheme';
|
||||
import styles from './ThemeSwitcher.module.css';
|
||||
|
||||
export function ThemeSwitcher() {
|
||||
const { theme, toggleTheme } = useTheme();
|
||||
const { t } = useTranslation();
|
||||
|
||||
return (
|
||||
<button
|
||||
className={styles.btn}
|
||||
onClick={toggleTheme}
|
||||
aria-label={theme === 'dark' ? 'Switch to light theme' : 'Switch to dark theme'}
|
||||
title={theme === 'dark' ? 'Light mode' : 'Dark mode'}
|
||||
aria-label={theme === 'dark' ? t('theme.switch_to_light') : t('theme.switch_to_dark')}
|
||||
title={theme === 'dark' ? t('theme.light_mode') : t('theme.dark_mode')}
|
||||
>
|
||||
{theme === 'dark' ? <Sun size={16} /> : <Moon size={16} />}
|
||||
</button>
|
||||
|
||||
Reference in New Issue
Block a user