Menus, globals, vendor page

frontend/components/layout.js

@@ -1,13 +1,13 @@
-import { Container } from '@chakra-ui/react'
+import { Container, Box } from '@chakra-ui/react'
 import Footer from '~/components/footer'
 import Header from '~/components/header'
 
-export default function Layout({ children }) {
+export default function Layout({ globals, menus, children }) {
   return (
     <Container maxW={'8xl'}>
-      <Header />
-      <main>{children}</main>
-      <Footer />
+      <Header menu={menus.find((m) => m.id === 'MAIN_MENU')} globals={globals} />
+      <Box marginY="6">{children}</Box>
+      <Footer menu={menus.find((m) => m.id === 'FOOTER_MENU')} globals={globals} />
     </Container>
   )
 }