1import Head from 'next/head'
2import { Router, useRouter } from 'next/router'
3import { MDXProvider } from '@mdx-js/react'
4
5import { Layout } from '@/components/Layout'
6import * as mdxComponents from '@/components/mdx'
7import { useMobileNavigationStore } from '@/components/MobileNavigation'
8
9import '@/styles/tailwind.css'
10import 'focus-visible'
11
12function onRouteChange() {
13 useMobileNavigationStore.getState().close()
14}
15
16Router.events.on('routeChangeStart', onRouteChange)
17Router.events.on('hashChangeStart', onRouteChange)
18
19export default function App({ Component, pageProps }) {
20 let router = useRouter()
21
22 return (
23 <>
24 <Head>
25 {router.pathname === '/' ? (
26 <title>Zed Internal Docs</title>
27 ) : (
28 <title>{`${pageProps.title} - Zed Internal Docs`}</title>
29 )}
30 <meta name="description" content={pageProps.description} />
31 </Head>
32 <MDXProvider components={mdxComponents}>
33 <Layout {...pageProps}>
34 <Component {...pageProps} />
35 </Layout>
36 </MDXProvider>
37 </>
38 )
39}