diff --git a/src/components/LanguageSwitcher.tsx b/src/components/LanguageSwitcher.tsx index 042b7bd..981a8cd 100644 --- a/src/components/LanguageSwitcher.tsx +++ b/src/components/LanguageSwitcher.tsx @@ -1,19 +1,27 @@ import { useTranslation } from 'react-i18next'; import { useState, useRef, useEffect } from 'react'; - -const languages = [ - { code: 'ru', name: 'RU', flag: '🇷🇺', fullName: 'Русский' }, - { code: 'en', name: 'EN', flag: '🇬🇧', fullName: 'English' }, - { code: 'zh', name: 'ZH', flag: '🇨🇳', fullName: '中文' }, - { code: 'fa', name: 'FA', flag: '🇮🇷', fullName: 'فارسی' }, -]; +import { infoApi, type LanguageInfo } from '@/api/info'; export default function LanguageSwitcher() { const { i18n } = useTranslation(); const [isOpen, setIsOpen] = useState(false); + const [availableLanguages, setAvailableLanguages] = useState([]); const dropdownRef = useRef(null); - const currentLang = languages.find((l) => l.code === i18n.language) || languages[0]; + useEffect(() => { + const fetchLanguages = async () => { + try { + const data = await infoApi.getLanguages(); + setAvailableLanguages(data.languages); + } catch { + // Silently fall back to empty list — component handles it gracefully + } + }; + fetchLanguages(); + }, []); + + const currentLang = availableLanguages.find((l) => l.code === i18n.language) || + availableLanguages[0] || { code: 'ru', name: 'RU', flag: '🇷🇺' }; useEffect(() => { function handleClickOutside(event: MouseEvent) { @@ -27,16 +35,18 @@ export default function LanguageSwitcher() { const changeLanguage = (code: string) => { i18n.changeLanguage(code); - // Set document direction for RTL languages document.documentElement.dir = code === 'fa' ? 'rtl' : 'ltr'; setIsOpen(false); }; - // Set initial direction on mount useEffect(() => { document.documentElement.dir = i18n.language === 'fa' ? 'rtl' : 'ltr'; }, [i18n.language]); + if (availableLanguages.length <= 1) { + return null; + } + return (
))}