Removed use server in NavigationMenu

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"}>
+          <Suspense fallback={"Loading nav"}>{children}</Suspense>
-            <NavigationMenu isMobile={true} />
-          </Suspense>
           <footer className={styles.footer}>
             <HeaderLink href="#">
               <SearchIcon width={20} height={20} color="burgundy" />

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>
   )
 }

components/Header/MainMenu/NavigationMenu/index.tsx

@@ -1,4 +1,3 @@
-"use server"
 import { serverClient } from "@/lib/trpc/server"
 
 import NavigationMenuList from "./NavigationMenuList"

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>