freesewing/sites/dev/pages/[...slug].mjs

// Used in static paths
import { pages } from 'site/prebuild/docs.en.mjs'
// Dependencies
import { serverSideTranslations } from 'next-i18next/serverSideTranslations'
import { loadMdxAsStaticProps } from 'shared/mdx/load.mjs'
import { freeSewingConfig as config } from 'shared/config/freesewing.config.mjs'
// Components
import { PageWrapper, ns } from 'shared/components/wrappers/page.mjs'
//import { components } from 'shared/components/mdx/index.mjs'
import { MdxWrapper } from 'shared/components/wrappers/mdx.mjs'
import { Toc } from 'shared/components/mdx/toc.mjs'
import { MdxMetaData } from 'shared/components/mdx/meta.mjs'
import { PrevNext } from 'shared/components/prev-next.mjs'
import { NavLinks, Breadcrumbs, MainSections } from 'shared/components/navigation/sitenav.mjs'
import {
  BaseLayout,
  BaseLayoutLeft,
  BaseLayoutProse,
  BaseLayoutRight,
} from 'shared/components/base-layout.mjs'

/*
 * This page is auto-generated by the prebuild script.
 * Any changes you make will be overwritten on the next (pre)build.
 *
 * See the page-templates folder for more info.
 */
const DocsPage = ({ page, slug, frontmatter, mdx, mdxSlug }) => (
  <PageWrapper {...page} title={frontmatter.title} intro={frontmatter.intro}>
    <BaseLayout>
      <BaseLayoutLeft>
        <MainSections />
        <NavLinks />
      </BaseLayoutLeft>
      <BaseLayoutProse>
        <div className="w-full">
          <Breadcrumbs />
          <h1 className="break-words searchme">{frontmatter.title}</h1>
          <div className="block xl:hidden">
            <Toc toc={frontmatter.toc} wrap />
          </div>
        </div>
        <MdxWrapper mdx={mdx} site="dev" slug={mdxSlug} />
        <PrevNext slug={slug} />
      </BaseLayoutProse>
      <BaseLayoutRight>
        <MdxMetaData frontmatter={frontmatter} slug={slug} locale="en" />
        <div className="hidden xl:block">
          <Toc toc={frontmatter.toc} wrap />
        </div>
      </BaseLayoutRight>
    </BaseLayout>
  </PageWrapper>
)

export default DocsPage

/*
 * getStaticProps() is used to fetch data at build-time.
 * To learn more, see: https://nextjs.org/docs/basic-features/data-fetching
 */
export async function getStaticProps({ params }) {
  return {
    props: {
      ...(await serverSideTranslations('en', ['docs', 'tutorial', 'popout', ...ns])),
      ...(await loadMdxAsStaticProps({
        language: 'en',
        site: 'dev',
        slug: params.slug.join('/'),
      })),
      slug: params.slug.join('/'),
      mdxSlug: params.slug,
      page: {
        locale: 'en',
        path: params.slug,
      },
    },
  }
}

/*
 * getStaticPaths() is used to specify for which routes (think URLs)
 * this page should be used to generate the result.
 *
 * On this page, it is returning a list of routes (think URLs) for all
 * the mdx (markdown) content.
 *
 * To learn more, see: https://nextjs.org/docs/basic-features/data-fetching
 */
export async function getStaticPaths() {
  return {
    paths: Object.keys(pages).map((slug) => '/' + slug),
    fallback: false,
  }
}