diff --git a/components/LanguageSwitcher/index.tsx b/components/LanguageSwitcher/index.tsx index f087502c0..16d5e8d41 100644 --- a/components/LanguageSwitcher/index.tsx +++ b/components/LanguageSwitcher/index.tsx @@ -1,9 +1,10 @@ "use client" +import { usePathname, useSearchParams } from "next/navigation" import { useRef } from "react" import { useIntl } from "react-intl" -import { languages } from "@/constants/languages" +import { Lang, languages } from "@/constants/languages" import useDropdownStore from "@/stores/main-menu" import { ChevronDownSmallIcon, GlobeIcon } from "@/components/Icons" @@ -23,6 +24,7 @@ import { type LanguageSwitcherProps, LanguageSwitcherTypesEnum, } from "@/types/components/languageSwitcher/languageSwitcher" +import type { LanguageSwitcherData } from "@/types/requests/languageSwitcher" export default function LanguageSwitcher({ urls, @@ -36,11 +38,23 @@ export default function LanguageSwitcher({ isHeaderLanguageSwitcherMobileOpen, isHeaderLanguageSwitcherOpen, } = useDropdownStore() + const searchParams = useSearchParams() + const pathname = usePathname() + const queryParams = new URLSearchParams(searchParams.toString()) + const languageSwitcherRef = useRef(null) const isFooter = type === LanguageSwitcherTypesEnum.Footer const isHeader = !isFooter const globeIconSize = type === "desktopHeader" ? 16 : 20 + const currentUrl = `${pathname}?${queryParams.toString()}` + + const fullUrls = Object.entries(urls).reduce((acc, [lang, { url }]) => { + const newUrl = currentUrl.replace(/^\/[a-z]{2}\//, url) + acc[lang as Lang] = { url: newUrl } + return acc + }, {} as LanguageSwitcherData) + const position = isFooter ? "footer" : "header" const dropdownType = { @@ -105,7 +119,7 @@ export default function LanguageSwitcher({ {isLanguageSwitcherOpen ? ( toggleDropdown(dropdownType)} />