64 lines
1.7 KiB
TypeScript
64 lines
1.7 KiB
TypeScript
import NextLink from "next/link"
|
|
import { Suspense } from "react"
|
|
|
|
import Image from "@/components/Image"
|
|
import { getIntl } from "@/i18n"
|
|
import { getLang } from "@/i18n/serverContext"
|
|
|
|
import { NavigationMenuListSkeleton } from "./NavigationMenu/NavigationMenuList"
|
|
import { MobileMenuSkeleton } from "./MobileMenu"
|
|
import MobileMenuWrapper from "./MobileMenuWrapper"
|
|
import MyPagesMenuWrapper, {
|
|
MyPagesMenuWrapperSkeleton,
|
|
} from "./MyPagesMenuWrapper"
|
|
import NavigationMenu from "./NavigationMenu"
|
|
|
|
import styles from "./mainMenu.module.css"
|
|
|
|
export default function MainMenu() {
|
|
return (
|
|
<div className={styles.mainMenu}>
|
|
<nav className={styles.nav}>
|
|
<Suspense fallback={<Logo alt="..." />}>
|
|
<MainMenuLogo />
|
|
</Suspense>
|
|
<div className={styles.menus}>
|
|
<Suspense fallback={<NavigationMenuListSkeleton />}>
|
|
<NavigationMenu isMobile={false} />
|
|
</Suspense>
|
|
<Suspense fallback={<MyPagesMenuWrapperSkeleton />}>
|
|
<MyPagesMenuWrapper />
|
|
</Suspense>
|
|
<Suspense fallback={<MobileMenuSkeleton />}>
|
|
<MobileMenuWrapper>
|
|
<NavigationMenu isMobile={true} />
|
|
</MobileMenuWrapper>
|
|
</Suspense>
|
|
</div>
|
|
</nav>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
async function MainMenuLogo() {
|
|
const intl = await getIntl()
|
|
|
|
return <Logo alt={intl.formatMessage({ id: "Back to scandichotels.com" })} />
|
|
}
|
|
|
|
function Logo({ alt }: { alt: string }) {
|
|
const lang = getLang()
|
|
|
|
return (
|
|
<NextLink className={styles.logoLink} href={`/${lang}`}>
|
|
<Image
|
|
alt={alt}
|
|
className={styles.logo}
|
|
height={22}
|
|
src="/_static/img/scandic-logotype.svg"
|
|
width={103}
|
|
/>
|
|
</NextLink>
|
|
)
|
|
}
|