import "../../components/main.js"
import Layout from "../../components/main.js"

export async function getServerSideProps(context) {
    const slug = context.params.slug
    const url = 'http://localhost:8000/api/document/' + slug
    console.log(url)
    const res = await fetch(url)
    const article_obj = await res.json()

    const secres = await fetch(`http://localhost:8000/api/sections`)
    const secdata = await secres.json()
    
    return {
        props: { article_obj, sections: secdata }, // will be passed to the page component as props
    }
}

const Article = ({article_obj, sections}) => (
    <Layout sections={sections}>
        <h1>{article_obj.title}</h1>
        <div className="article_body" dangerouslySetInnerHTML={{ __html: article_obj.body }}></div>
    </Layout>
)

export default Article