import { Suspense } from "react"

import {
  getHeader,
  getLanguageSwitcher,
  getName,
} from "@/lib/trpc/memoizedRequests"

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

import styles from "./header.module.css"

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

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