pfadi-bussle/pages/terms.tsx

import { readFileSync } from 'fs'
import renderToString from 'next-mdx-remote/render-to-string'
import mdComponents from '../components/mdComponents'

import Layout from '../components/layout'

export default function TermsPage({ renderedOutput }) {
  return (
    <Layout>
      <div
        className="text-gray-700"
        dangerouslySetInnerHTML={{ __html: renderedOutput }}
      />
    </Layout>
  )
}

export async function getStaticProps() {
  const source = readFileSync('./md/terms.md', 'utf8')
  const { renderedOutput } = await renderToString(source, {
    components: { ...mdComponents },
  })
  return { props: { renderedOutput } }
}