Merged in fix/SW-705-language-switcher (pull request #1005)

fix(SW-705): Add path and searchparams to language switcher

Approved-by: Simon.Emanuelsson

components/Current/Header/MainMenu/index.tsx

@@ -112,16 +112,14 @@ export function MainMenu({
           >
             <ul className={styles.linkRow}>
               {!isThreeStaticPagesPathnames && !!user ? (
-                <>
+                <li className={styles.mobileLinkRow}>
-                  <li className={styles.mobileLinkRow}>
+                  <Link
-                    <Link
+                    className={styles.mobileLinkButton}
-                      className={styles.mobileLinkButton}
+                    href={myPages[lang]}
-                      href={myPages[lang]}
+                  >
-                    >
+                    {intl.formatMessage({ id: "My pages" })}
-                      {intl.formatMessage({ id: "My pages" })}
+                  </Link>
-                    </Link>
+                </li>
-                  </li>
-                </>
               ) : (
                 <>
                   <li>

components/LanguageSwitcher/LanguageSwitcherContent/index.tsx

@@ -1,5 +1,6 @@
 "use client"
 
+import { usePathname } from "next/navigation"
 import { useIntl } from "react-intl"
 
 import { Lang, languages } from "@/constants/languages"
@@ -10,6 +11,8 @@ import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
 import useLang from "@/hooks/useLang"
 import { useTrapFocus } from "@/hooks/useTrapFocus"
 
+import { replaceUrlPart } from "./utils"
+
 import styles from "./languageSwitcherContent.module.css"
 
 import type { LanguageSwitcherContentProps } from "@/types/components/languageSwitcher/languageSwitcher"
@@ -24,6 +27,8 @@ export default function LanguageSwitcherContent({
   const languageSwitcherRef = useTrapFocus()
   const urlKeys = Object.keys(urls) as Lang[]
 
+  const pathname = usePathname()
+
   return (
     <div className={styles.languageSwitcherContent} ref={languageSwitcherRef}>
       <div className={styles.languageWrapper}>
@@ -39,8 +44,9 @@ export default function LanguageSwitcherContent({
                 <li key={key}>
                   <Link
                     className={`${styles.link} ${isActive ? styles.active : ""}`}
-                    href={url}
+                    href={replaceUrlPart(pathname, url)}
                     onClick={onLanguageSwitch}
+                    keepSearchParams
                   >
                     {languages[key]}
                     {isActive ? <CheckIcon color="burgundy" /> : null}

components/LanguageSwitcher/LanguageSwitcherContent/utils.ts

@@ -0,0 +1,19 @@
+export function replaceUrlPart(currentPath: string, newPart: string): string {
+  const pathSegments = currentPath.split("/").filter((segment) => segment)
+
+  const newPathSegments = newPart
+    .replace(/\/$/, "")
+    .split("/")
+    .filter((segment) => segment)
+
+  const isFullPathReplacement = newPathSegments.length > 1
+
+  if (isFullPathReplacement) {
+    return `/${newPathSegments.join("/")}`
+  }
+
+  const updatedPathSegments = pathSegments.slice(1)
+  const updatedPath = `/${newPathSegments.concat(updatedPathSegments).join("/")}`
+
+  return updatedPath
+}

components/LanguageSwitcher/index.tsx

@@ -36,6 +36,7 @@ export default function LanguageSwitcher({
     isHeaderLanguageSwitcherMobileOpen,
     isHeaderLanguageSwitcherOpen,
   } = useDropdownStore()
+
   const languageSwitcherRef = useRef<HTMLDivElement>(null)
   const isFooter = type === LanguageSwitcherTypesEnum.Footer
   const isHeader = !isFooter