44 lines
1.3 KiB
TypeScript
44 lines
1.3 KiB
TypeScript
import httpClient from "@/shared/config/api/httpClient";
|
|
import { LanguageRoutes } from "@/shared/config/i18n/type";
|
|
import { Button } from "@/shared/ui/button";
|
|
import {
|
|
DropdownMenu,
|
|
DropdownMenuContent,
|
|
DropdownMenuItem,
|
|
DropdownMenuTrigger,
|
|
} from "@/shared/ui/dropdown-menu";
|
|
import { languages } from "@/widgets/lang-toggle/lib/data";
|
|
import { useQueryClient } from "@tanstack/react-query";
|
|
import { GlobeIcon } from "lucide-react";
|
|
import { useTranslation } from "react-i18next";
|
|
|
|
const LangToggle = () => {
|
|
const { i18n } = useTranslation();
|
|
const queryClient = useQueryClient();
|
|
const changeLanguage = (lng: LanguageRoutes) => {
|
|
httpClient.defaults.headers.common["Accept-Language"] = lng;
|
|
queryClient.refetchQueries();
|
|
i18n.changeLanguage(lng);
|
|
};
|
|
|
|
return (
|
|
<DropdownMenu>
|
|
<DropdownMenuTrigger asChild>
|
|
<Button variant="outline">
|
|
<GlobeIcon />
|
|
<span>{languages.find((e) => e.key === i18n.language)?.name}</span>
|
|
</Button>
|
|
</DropdownMenuTrigger>
|
|
<DropdownMenuContent align="end">
|
|
{languages.map((e) => (
|
|
<DropdownMenuItem key={e.key} onClick={() => changeLanguage(e.key)}>
|
|
{e.name}
|
|
</DropdownMenuItem>
|
|
))}
|
|
</DropdownMenuContent>
|
|
</DropdownMenu>
|
|
);
|
|
};
|
|
|
|
export default LangToggle;
|