File size: 952 Bytes
793e953 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 | import React from 'react'
import { useTranslation } from '../i18n'
/**
* LanguageSwitcher - A compact language toggle button
*
* Displays the current language (中/EN) and switches between Chinese and English on click.
* Designed to be placed in the Layout header, next to the user avatar.
*/
export default function LanguageSwitcher() {
const { locale, setLocale } = useTranslation()
const toggle = () => {
setLocale(locale === 'zh' ? 'en' : 'zh')
}
return (
<button
onClick={toggle}
title={locale === 'zh' ? 'Switch to English' : 'Switch to Chinese'}
className="text-xs font-medium px-2 py-1 rounded-md border border-gray-200 bg-white hover:bg-gray-50 text-gray-600 hover:text-gray-800 transition-colors min-h-[32px] min-w-[40px] flex items-center justify-center"
aria-label={locale === 'zh' ? 'Switch to English' : 'Switch to Chinese'}
>
{locale === 'zh' ? '中' : 'EN'}
</button>
)
}
|