import Gallery from './Gallery'
import File from './File'

const Project = props => {
  const { name, abbreviation, description, files, versions } = props.data
  return (
    <div>
      <h2>{name}</h2>
      <p>{abbreviation}</p>
      <p>{description}</p>
      <Gallery title='files' items={files.map(file => <File key={file.filename} data={file} />)} />
      <Gallery title='versions' items={versions.map(version => <p>{version.name}</p>)} />
    </div>
  )
}

export default Project