diff --git a/src/components/LanguageSwitcher.tsx b/src/components/LanguageSwitcher.tsx index 45585f3..47b95a7 100644 --- a/src/components/LanguageSwitcher.tsx +++ b/src/components/LanguageSwitcher.tsx @@ -1,25 +1,23 @@ import { useTranslation } from 'react-i18next'; import { useState, useRef, useEffect } from 'react'; -import { infoApi, type LanguageInfo } from '@/api/info'; +import { useQuery } from '@tanstack/react-query'; +import { infoApi } from '@/api/info'; import { ChevronDownIcon } from '@/components/icons'; export default function LanguageSwitcher() { const { i18n } = useTranslation(); const [isOpen, setIsOpen] = useState(false); - const [availableLanguages, setAvailableLanguages] = useState([]); const dropdownRef = useRef(null); - 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(); - }, []); + // Кэш react-query переживает перемонтирование AppShell при смене роута: + // локальный useState начинал каждый маунт с пустого списка, и до ответа API + // компонент рендерил null — переключатель «мигал» при каждой навигации. + const { data } = useQuery({ + queryKey: ['languages'], + queryFn: infoApi.getLanguages, + staleTime: 1000 * 60 * 5, + }); + const availableLanguages = data?.languages ?? []; const currentLang = availableLanguages.find((l) => l.code === i18n.language) || availableLanguages[0] || { code: 'ru', name: 'RU', flag: '🇷🇺' };