Page.tsx

import React from "react"
import { PageProps } from "gatsby"

import { Sections } from "@onegeo/gatsby-theme-onegeo"

interface ISection {
    id: string
}
interface IPageContext {
    id: string
    title: string
    content: string
    slug: string
    sections: ISection[] | []
}

const PageTemplate = (props: PageProps<null, IPageContext>) => {
    const {
        pageContext: { sections, title, content },
    } = props

    const idsSections = sections.map((section) => section.id)

    return (
        <div>
            {title && <h1 className="text-3xl font-extrabold">{title}</h1>}
            {content && (
                <div
                    className="text-lg leading-8 py-4 text-justify"
                    dangerouslySetInnerHTML={{ __html: content }}
                ></div>
            )}
            {idsSections.length > 0 && <Sections ids={idsSections} />}
        </div>
    )
}

export default PageTemplate