Merged in feat/refactor-header-footer-sitewidealert (pull request #1374)

Refactor: removed parallel routes for header, footer and sidewidealert. Langswitcher and sidewidealert now client components

* feat - removed parallel routes and made sidepeek and sitewidealerts as client components

* Langswitcher as client component

* Fixed lang switcher for current header

* Passing lang when fetching siteconfig

* Merge branch 'master' into feat/refactor-header-footer-sitewidealert

* Refactor

* Removed dead code

* Show only languages that has translation

* Refetch sitewidealert every 60 seconds

* Merge branch 'master' into feat/refactor-header-footer-sitewidealert

* Removed sidepeek parallel route from my-stay

* Added missing env.var to env.test

* Removed console.log


Approved-by: Joakim Jäderberg

components/Current/Header/LanguageSwitcher/index.tsx

@@ -1,15 +1,37 @@
+"use client"
+
+import { usePathname } from "next/navigation"
+
+import { trpc } from "@/lib/trpc/client"
+
+import SkeletonShimmer from "@/components/SkeletonShimmer"
+import useLang from "@/hooks/useLang"
+
 import Desktop from "./Desktop"
 import Mobile from "./Mobile"
 
-import type { LanguageSwitcherData } from "@/types/requests/languageSwitcher"
+export default function LanguageSwitcher() {
+  const currentLanguage = useLang()
+  const pathName = usePathname()
 
-type LanguageSwitcherProps = { urls: LanguageSwitcherData }
+  const { data: languagesResponse, isLoading } =
+    trpc.contentstack.languageSwitcher.get.useQuery({
+      pathName,
+      lang: currentLanguage,
+    })
+
+  if (isLoading) {
+    return <SkeletonShimmer width="12ch" />
+  }
+
+  if (!languagesResponse?.urls) {
+    return null
+  }
 
-export default function LanguageSwitcher({ urls }: LanguageSwitcherProps) {
   return (
     <>
-      <Desktop urls={urls} />
-      <Mobile urls={urls} />
+      <Desktop urls={languagesResponse.urls} />
+      <Mobile urls={languagesResponse.urls} />
     </>
   )
 }

components/Current/Header/MainMenu/index.tsx

@@ -74,8 +74,6 @@ export function MainMenu({
     toggleDropdown(DropdownTypeEnum.MyPagesMobileMenu)
   }
 
-  console.log("isMyPagesMobileMenuOpen", isMyPagesMobileMenuOpen)
-
   return (
     <div className={styles.mainMenu}>
       <div

components/Current/Header/index.tsx

@@ -1,10 +1,6 @@
 import { homeHrefs } from "@/constants/homeHrefs"
 import { env } from "@/env/server"
-import {
-  getCurrentHeader,
-  getLanguageSwitcher,
-  getName,
-} from "@/lib/trpc/memoizedRequests"
+import { getCurrentHeader, getName } from "@/lib/trpc/memoizedRequests"
 
 import { getLang } from "@/i18n/serverContext"
 
@@ -18,13 +14,9 @@ import styles from "./header.module.css"
 
 export default async function Header() {
   const lang = getLang()
-  const [data, user, languages] = await Promise.all([
-    getCurrentHeader(lang),
-    getName(),
-    getLanguageSwitcher(),
-  ])
+  const [data, user] = await Promise.all([getCurrentHeader(lang), getName()])
 
-  if (!languages || !data?.header) {
+  if (!data?.header) {
     return null
   }
 
@@ -42,7 +34,7 @@ export default async function Header() {
         frontpageLinkText={frontpageLinkText}
         homeHref={homeHref}
         links={topMenu.links}
-        languageSwitcher={<LanguageSwitcher urls={languages.urls} />}
+        languageSwitcher={<LanguageSwitcher />}
       />
       <MainMenu
         frontpageLinkText={frontpageLinkText}
@@ -50,7 +42,7 @@ export default async function Header() {
         links={menu.links}
         logo={logo}
         topMenuMobileLinks={topMenuMobileLinks}
-        languageSwitcher={<LanguageSwitcher urls={languages.urls} />}
+        languageSwitcher={<LanguageSwitcher />}
         myPagesMobileDropdown={<MyPagesMobileDropdown />}
         bookingHref={homeHref}
         user={user}