feat(WEB-93): add Header to CMS and render it in Next

components/Current/Header/index.tsx

@@ -1,30 +1,47 @@
-import { langEnum } from "@/types/lang"
+import { request } from "@/lib/request"
+import { GetHeader } from "@/lib/graphql/Query/Header.graphql"
 
-import Da from "./Da"
-import De from "./De"
-import En from "./En"
-import Fi from "./Fi"
-import No from "./No"
-import Sv from "./Sv"
+import MainMenu from "./MainMenu"
+import OfflineBanner from "./OfflineBanner"
+import TopMenu from "./TopMenu"
+
+import styles from "./header.module.css"
 
-import type { HeaderProps } from "@/types/components/current/header"
 import { LangParams } from "@/types/params"
+import type { HeaderQueryData } from "@/types/requests/header"
 
-export default function Header({ lang, pathname }: LangParams & HeaderProps) {
-  switch (lang) {
-    case langEnum.sv:
-      return <Sv pathname={pathname} />
-    case langEnum.fi:
-      return <Fi pathname={pathname} />
-    case langEnum.en:
-      return <En pathname={pathname} />
-    case langEnum.da:
-      return <Da pathname={pathname} />
-    case langEnum.de:
-      return <De pathname={pathname} />
-    case langEnum.no:
-      return <No pathname={pathname} />
-    default:
+export default async function Header({ lang }: LangParams) {
+  try {
+    const { data } = await request<HeaderQueryData>(GetHeader, { locale: lang })
+    if (!data.all_header.items.length) {
       return null
+    }
+
+    const homeHref = `https://www.scandichotels.com/${lang}`
+    const { frontpage_link_text, logoConnection, menu, top_menu } = data.all_header.items[0]
+    const logo = logoConnection.edges?.[0]?.node
+    const topMenuMobileLinks = top_menu.links.filter(link => link.show_on_mobile)
+      .sort((a, b) => a.sort_order_mobile < b.sort_order_mobile ? 1 : -1)
+
+    return (
+      <header className={styles.header} role="banner">
+        <OfflineBanner />
+        <TopMenu
+          frontpageLinkText={frontpage_link_text}
+          homeHref={homeHref}
+          links={top_menu.links}
+        />
+        <MainMenu
+          frontpageLinkText={frontpage_link_text}
+          homeHref={homeHref}
+          links={menu.links}
+          logo={logo}
+          topMenuMobileLinks={topMenuMobileLinks}
+        />
+      </header>
+    )
+  } catch (error) {
+    console.error(error)
+    return null
   }
 }