content: import React, { Component } from 'react';
  import Jobs from './jobs';
  import styles from './jobs.css';
  
  class JobsPage extends Component {
    state = {
      jobs: []
    }
    componentDidMount = () => {
      console.log('Did mount');
      const query = '/api/jobs';
      this.getJobs(query);
    }
  
    getJobs = (query) => {
      console.log('get jobs');
      return fetch(query)
      .then(response => response.json())
      .then((json) => {
        const jobs = json.jobs.map((job) => {
          const data = {
            title: job.title,
            shortlink: job.shortlink,
            department: job.department,
            shortcode: job.shortcode
          };
          return data;
        });
  
        this.setState({
          jobs
        });
      });
    }
  
    render() {
      const { jobs } = this.state;
      return (
        <div className={styles.jobList}>
          {<Jobs jobs={jobs} />}
        </div>
      );
    }
  }
  
  export default JobsPage;
  