import { Suspense } from "react"

import { getHeader } from "@/lib/trpc/memoizedRequests"

import MainMenu from "./MainMenu"
import TopMenu, { TopMenuSkeleton } from "./TopMenu"

export default async function Header() {
  void getHeader()

  return (
    <header>
      <Suspense fallback={<TopMenuSkeleton />}>
        <TopMenu />
      </Suspense>
      <MainMenu />
    </header>
  )
}