import React, { useEffect } from 'react'
import { graphql } from 'gatsby'
import Layout from '../components/layout'
import { MDXRenderer } from 'gatsby-plugin-mdx'
import { MDXProvider } from '@mdx-js/react'
const MdLeakH1 = props =>
# {props.children}
const MdLeakH2 = props => ## {props.children}
const MdLeakH3 = props => ### {props.children}
const MdLeakH4 = props => #### {props.children}
const components = {
h1: MdLeakH1,
h2: MdLeakH2,
h3: MdLeakH3,
h4: MdLeakH4,
}
export default function Template({
data, // this prop will be injected by the GraphQL query below.
}) {
const {
frontmatter: { title, path },
body,
} = data.mdx
useEffect(() => {
document.title = `ctdo - ${title.toLowerCase()}`
}, [title])
return (
{title}
{body}
)
}
export const pageQuery = graphql`
query($slug: String!) {
mdx(fields: { slug: { eq: $slug } }) {
id
excerpt(pruneLength: 160)
body
frontmatter {
title
date(formatString: "MMMM DD, YYYY")
description
}
}
}
`