fix(header): кэшировать список языков — переключатель не мигает при смене страницы

This commit is contained in:
kewldan
2026-07-13 01:46:24 +03:00
parent b40f939e91
commit a7ff8a6b09

View File

@@ -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<LanguageInfo[]>([]);
const dropdownRef = useRef<HTMLDivElement>(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: '🇷🇺' };