import React, { Component } from "react"
import * as PropTypes from "prop-types"

import CatalogGrid from '../../components/CatalogGrid'

const propTypes = {
  data: PropTypes.object.isRequired,
}

class CatalogPage extends Component {
  render() {
    const artistList = this.props.data.allContentfulArtist.edges
    return (
      <CatalogGrid list={artistList} />
    )
  }
}

export default CatalogPage

export const pageQuery = graphql`
  query PageQuery {
    allContentfulArtist {
      edges {
        node {
          id
          artistName
          soundCloudUsername
          profilePicture {
            responsiveResolution(width:400, height: 400) {
              width
              height
              src
              srcSet
            }
          }
        }
      }
    }
  }
`
