From 4649799f2bce632807bc1a0f640db275aad9ad4a Mon Sep 17 00:00:00 2001
From: Linus Flood <linus.flood@scandichotels.com>
Date: Thu, 19 Sep 2024 09:59:25 +0200
Subject: [PATCH] Removed use server in NavigationMenu

---
 components/Header/MainMenu/MobileMenu/index.tsx       | 11 ++++++-----
 .../Header/MainMenu/MobileMenuWrapper/index.tsx       |  8 ++++++--
 components/Header/MainMenu/NavigationMenu/index.tsx   |  1 -
 components/Header/MainMenu/index.tsx                  |  4 +++-
 4 files changed, 15 insertions(+), 9 deletions(-)

diff --git a/components/Header/MainMenu/MobileMenu/index.tsx b/components/Header/MainMenu/MobileMenu/index.tsx
index fdffa1ce7..0eca2dd10 100644
--- a/components/Header/MainMenu/MobileMenu/index.tsx
+++ b/components/Header/MainMenu/MobileMenu/index.tsx
@@ -11,14 +11,17 @@ import LanguageSwitcher from "@/components/LanguageSwitcher"
 import { useHandleKeyUp } from "@/hooks/useHandleKeyUp"
 
 import HeaderLink from "../../HeaderLink"
-import NavigationMenu from "../NavigationMenu"
 
 import styles from "./mobileMenu.module.css"
 
 import { DropdownTypeEnum } from "@/types/components/dropdown/dropdown"
 import type { MobileMenuProps } from "@/types/components/header/mobileMenu"
 
-export default function MobileMenu({ languageUrls, topLink }: MobileMenuProps) {
+export default function MobileMenu({
+  children,
+  languageUrls,
+  topLink,
+}: React.PropsWithChildren<MobileMenuProps>) {
   const intl = useIntl()
   const {
     handleHamburgerClick,
@@ -62,9 +65,7 @@ export default function MobileMenu({ languageUrls, topLink }: MobileMenuProps) {
           className={styles.dialog}
           aria-label={intl.formatMessage({ id: "Menu" })}
         >
-          <Suspense fallback={"Loading nav"}>
-            <NavigationMenu isMobile={true} />
-          </Suspense>
+          <Suspense fallback={"Loading nav"}>{children}</Suspense>
           <footer className={styles.footer}>
             <HeaderLink href="#">
               <SearchIcon width={20} height={20} color="burgundy" />
diff --git a/components/Header/MainMenu/MobileMenuWrapper/index.tsx b/components/Header/MainMenu/MobileMenuWrapper/index.tsx
index fb851248c..1c8c8e21b 100644
--- a/components/Header/MainMenu/MobileMenuWrapper/index.tsx
+++ b/components/Header/MainMenu/MobileMenuWrapper/index.tsx
@@ -2,7 +2,9 @@ import { serverClient } from "@/lib/trpc/server"
 
 import MobileMenu from "../MobileMenu"
 
-export default async function MobileMenuWrapper() {
+export default async function MobileMenuWrapper({
+  children,
+}: React.PropsWithChildren) {
   const [languages, headerData] = await Promise.all([
     serverClient().contentstack.languageSwitcher.get(),
     serverClient().contentstack.base.header(),
@@ -13,6 +15,8 @@ export default async function MobileMenuWrapper() {
   }
 
   return (
-    <MobileMenu languageUrls={languages.urls} topLink={headerData?.topLink} />
+    <MobileMenu languageUrls={languages.urls} topLink={headerData?.topLink}>
+      {children}
+    </MobileMenu>
   )
 }
diff --git a/components/Header/MainMenu/NavigationMenu/index.tsx b/components/Header/MainMenu/NavigationMenu/index.tsx
index 8bbef197a..d653b2fe5 100644
--- a/components/Header/MainMenu/NavigationMenu/index.tsx
+++ b/components/Header/MainMenu/NavigationMenu/index.tsx
@@ -1,4 +1,3 @@
-"use server"
 import { serverClient } from "@/lib/trpc/server"
 
 import NavigationMenuList from "./NavigationMenuList"
diff --git a/components/Header/MainMenu/index.tsx b/components/Header/MainMenu/index.tsx
index 41ba01b0a..a97ed097e 100644
--- a/components/Header/MainMenu/index.tsx
+++ b/components/Header/MainMenu/index.tsx
@@ -39,7 +39,9 @@ export default async function MainMenu() {
             <MyPagesMenuWrapper />
           </Suspense>
           <Suspense fallback={"Loading menu"}>
-            <MobileMenuWrapper />
+            <MobileMenuWrapper>
+              <NavigationMenu isMobile={true} />
+            </MobileMenuWrapper>
           </Suspense>
         </div>
       </nav>