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'



const description = {
  title: 'nfisn',
  company: 'TESLA',
  location: 'MINSK, BELARUS',
  content: `lsirn`,
}

const locationData = {
  title: 'Location',
  content: `Zipari is located in the historic Dumbo neighborhood. Outlined by the beautiful Brooklyn Bridge Park enjoy
    lunch outside or under the Brooklyn bridge.`,
  coordinates: {
    longitude: '27.567444',
    latitude: '53.893009',
  },
}

// const photos = [
//   { url: 'https://happypetstories.com/cache/com_zoo/images/pembrokewelshcorgi_3aff402ddf0864e094e2f1f71bbb8b97.jpg' },
//   {
//     url: 'https://www.pets4homes.co.uk/images/breeds/50/d248d59954bb644e4437cce1758a9ce2.jpg',
//   },
//   {
//     url:
//       'https://images.mentalfloss.com/sites/default/files/styles/width-constrained-728/public/istock_000016651146_small.jpg',
//   },
//   { url: 'https://www.pets4homes.co.uk/images/breeds/50/fdaffb675fe084458758d97f7bac468f.jpg' },
// ]

class SingleJob extends Component {

  render() {
    const {job:{title, companyName, description, geolocation, photo }} = this.props
    return (
      <div className={styles.root}>
        <div className={styles.inner}>
          <div className={styles.content}>
            <Description {...description} title ={title} company ={companyName} content={description}/>
                <Location {...locationData} title={title} content={description} geolocation={geolocation}/>
            <VacancyGallery photos={photo} />
          </div>
          <div className={styles.ad}>
            <Ad />
          </div>
        </div>
      </div>
    )
  }
}

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

export default SingleJob