src/components/SingleJob/SingleJob.js

import React, { Component } from 'react'
import PropTypes from 'prop-types'
import Ad from '../Ad'
import styles from './SingleJob.module.scss'
import Description from './Description'
import Location from './Location'
import VacancyGallery from './VacancyGallery'
import { Link } from 'gatsby'
import About from './About'

class SingleJob extends Component {
  render() {
    const {
      job,
      job: { aboutCompany },
      locale,
    } = this.props

    return (
      <div className={styles.root}>
        <div className={styles.inner}>
          <div className={styles.content}>
            <Description {...job} locale={locale} />
            <Location {...job} locale={locale} />
            <VacancyGallery {...job} />
            <About {...{ aboutCompany, locale }} />
          </div>
          <div className={styles.ad}>
            <Link>
              <button className={styles.respond}>Respond</button>
            </Link>
            <Ad locale={locale} />
          </div>
        </div>
      </div>
    )
  }
}

SingleJob.propTypes = {
  title: PropTypes.string,
  url: PropTypes.string,
  html: PropTypes.string,
  locale: PropTypes.string,
}

export default SingleJob