Shop-Storefront/src/modules/layout/components/vt-mega-menu/index.tsx

35 lines
826 B
TypeScript

import {
LayoutComponentDefinition,
LayoutContext,
} from "vibentec/component-map"
import React, { Suspense } from "react"
import SkeletonMegaMenu from "@modules/skeletons/components/vt-skeleton-mega-menu"
import MegaMenuWrapper from "@modules/layout/components/vt-mega-menu/mega-menu-wrapper"
interface MegaMenuProps {
navLabel: {
text: string
className?: string
}
}
export default function VtMegaMenu({
nodes,
context,
}: {
nodes: LayoutComponentDefinition
context: LayoutContext
}) {
const { navLabel } = nodes.config as MegaMenuProps ?? {}
return (
<nav>
<ul className="space-x-4 hidden small:flex">
<li>
<Suspense fallback={<SkeletonMegaMenu />}>
<MegaMenuWrapper navLabel={navLabel} />
</Suspense>
</li>
</ul>
</nav>
)
}