fix: validation for header

components/Header/MainMenu/MobileMenu/index.tsx

@@ -71,8 +71,8 @@ export default function MobileMenu({
               <SearchIcon width={20} height={20} color="burgundy" />
               {intl.formatMessage({ id: "Find booking" })}
             </HeaderLink>
-            {topLink ? (
-              <HeaderLink href={topLink.href}>
+            {topLink.link ? (
+              <HeaderLink href={topLink.link.url}>
                 <GiftIcon width={20} height={20} color="burgundy" />
                 {topLink.title}
               </HeaderLink>

components/Header/MainMenu/MobileMenuWrapper/index.tsx

@@ -1,21 +1,20 @@
-import { serverClient } from "@/lib/trpc/server"
+import { getHeader, getLanguageSwitcher } from "@/lib/trpc/memoizedRequests"
 
 import MobileMenu from "../MobileMenu"
 
 export default async function MobileMenuWrapper({
   children,
 }: React.PropsWithChildren) {
-  const [languages, headerData] = await Promise.all([
-    serverClient().contentstack.languageSwitcher.get(),
-    serverClient().contentstack.base.header(),
-  ])
+  // preloaded
+  const languages = await getLanguageSwitcher()
+  const header = await getHeader()
 
-  if (!languages || !headerData) {
+  if (!languages || !header) {
     return null
   }
 
   return (
-    <MobileMenu languageUrls={languages.urls} topLink={headerData?.topLink}>
+    <MobileMenu languageUrls={languages.urls} topLink={header.data.topLink}>
       {children}
     </MobileMenu>
   )

components/Header/MainMenu/NavigationMenu/NavigationMenuItem/index.tsx

@@ -12,7 +12,7 @@ import styles from "./navigationMenuItem.module.css"
 import type { NavigationMenuItemProps } from "@/types/components/header/navigationMenuItem"
 
 export default function MenuItem({ item, isMobile }: NavigationMenuItemProps) {
-  const { submenu, title, link, seeAllLink, card } = item
+  const { submenu, title, link } = item
   const [isExpanded, setIsExpanded] = useState(false) // TODO: Use store to manage this state when adding the menu itself.
 
   function handleButtonClick() {
@@ -36,9 +36,9 @@ export default function MenuItem({ item, isMobile }: NavigationMenuItemProps) {
     </MainMenuButton>
   ) : (
     <Link
-      href={link!.href}
-      color="burgundy"
       className={`${styles.navigationMenuItem} ${isMobile ? styles.mobile : styles.desktop}`}
+      color="burgundy"
+      href={link!.url}
     >
       {title}
     </Link>

components/Header/MainMenu/NavigationMenu/index.tsx

@@ -1,4 +1,4 @@
-import { serverClient } from "@/lib/trpc/server"
+import { getHeader } from "@/lib/trpc/memoizedRequests"
 
 import NavigationMenuList from "./NavigationMenuList"
 
@@ -7,9 +7,13 @@ import type { NavigationMenuProps } from "@/types/components/header/navigationMe
 export default async function NavigationMenu({
   isMobile,
 }: NavigationMenuProps) {
-  const headerData = await serverClient().contentstack.base.header()
+  const header = await getHeader()
 
-  const filteredItems = headerData?.menuItems.filter(
+  if (!header) {
+    return null
+  }
+
+  const filteredItems = header.data.menuItems.filter(
     ({ link, submenu }) => submenu.length || link
   )