import * as React from 'react'

import Layout from '../components/layout'
import Seo from '../components/seo'

import { Section } from '../components/shared'
import { SideBar } from '../templates/sidebar'

import type { PageProps } from 'gatsby'
import type { PageContext } from '../types'

const NotFound: React.FC<PageProps<unknown, PageContext>> = ({
  location,
  pageContext
}) => (
  <Layout location={location} heroSection={false}>
        <Section color="black" bgColor="white" bottomArrow={false}>
      <SideBar
        pageContext={pageContext}
        location={location}
        notFoundPage={true}
      />
    </Section>
  </Layout>
)

export default NotFound

export const Head = () => <Seo title="Page Not Found" />