Menus, globals, vendor page

frontend/pages/_app.js

@@ -1,13 +1,43 @@
+import App from 'next/app'
 import { ChakraProvider } from '@chakra-ui/react'
 import Layout from '~/components/layout'
 import theme from '~/src/theme'
 
-export default function MyApp({ Component, pageProps }) {
+export default function MyApp({ Component, pageProps, globals, menus }) {
   return (
     <ChakraProvider theme={theme}>
-      <Layout>
+      <Layout globals={globals} menus={menus}>
         <Component {...pageProps} />
       </Layout>
     </ChakraProvider>
   )
 }
+
+MyApp.getInitialProps = async (context) => {
+  const pageProps = await App.getInitialProps(context)
+
+  let url = new URL(`${process.env.NEXT_PUBLIC_DIRECTUS_API_URL}/items/globals`)
+  url.searchParams.append('fields[]', '*')
+  url.searchParams.append('limit', 1)
+  const resG = await fetch(url.toString())
+  let { data: globals } = await resG.json()
+
+  url = new URL(`${process.env.NEXT_PUBLIC_DIRECTUS_API_URL}/items/menus`)
+  url.searchParams.append('fields[]', '*')
+  url.searchParams.append('fields[]', 'menus_menu_items.sort')
+  url.searchParams.append('fields[]', 'menus_menu_items.menu_items_id.label')
+  url.searchParams.append('fields[]', 'menus_menu_items.menu_items_id.url')
+  url.searchParams.append('fields[]', 'menus_menu_items.menu_items_id.sort')
+  url.searchParams.append('limit', -1)
+  const resM = await fetch(url.toString())
+  const { data: menus } = await resM.json()
+
+  return {
+    ...pageProps,
+    globals,
+    menus: menus.map((m) => ({
+      id: m.id,
+      items: m.menus_menu_items.sort((a, b) => a.sort - b.sort).map((mm) => mm.menu_items_id),
+    })),
+  }
+}