import { allDocs } from '.contentlayer/data' ; import type { Doc } from '.contentlayer/types' ; import { MDXComponents } from 'components/mdx-components' ; import { GetStaticPaths , GetStaticProps } from 'next' ; import { useMDXComponent } from 'next-contentlayer/hooks' ; import Layout from 'layouts' ; export default function Page ( { doc } ) { const Component = useMDXComponent ( doc . body . code ) ; return ( < Layout frontMatter = { doc . frontMatter } > < Component components = { MDXComponents } /> < /Layout>); } export const getStaticPaths = async ( ) => { const docs = allDocs . map ( ( t ) => t . _raw . flattenedPath . replace ( 'docs/' , '' ) ) . map ( ( id ) => ( { params : { slug : id . split ( '/' ) } } ) ) ; return { paths : docs , fallback : false } ; } ; export const getStaticProps = async ( ctx ) => { const params = Array . isArray ( ctx . params . slug ) ? ctx . params . slug : [ ctx . params . slug ] ; const doc = allDocs . find ( ( doc ) => doc . _id . endsWith ( `${ params . join ( '/' ) }.mdx` ) ) ; return { props : { doc } } ; } ;