{"size": 716, "ext": "js", "max_stars_repo_path": "src/components/Grid/index.js", "max_stars_repo_name": "jaayperez/movieme", "max_stars_repo_stars_event_min_datetime": "2021-07-27T08:59:23.000Z", "max_stars_repo_stars_event_max_datetime": "2022-03-14T16:43:02.000Z", "max_issues_repo_path": "src/components/Grid/index.js", "max_issues_repo_name": "jaayperez/movieme", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/components/Grid/index.js", "max_forks_repo_name": "jaayperez/movieme", "max_forks_repo_forks_event_min_datetime": "2021-08-09T19:03:49.000Z", "max_forks_repo_forks_event_max_datetime": "2021-08-09T19:03:49.000Z"}
{"max_stars_count": 6, "max_issues_count": null, "max_forks_count": 1, "avg_line_length": 18.8421052632, "max_line_length": 64, "alphanum_fraction": 0.561452514}
import React from 'react';
import PropTypes from 'prop-types';

import GridItem from '../Item';

import GridContainer from './styled';

import Constants from '../../utils/Constants';

function Grid({ items }) {
  return (
    <GridContainer>
      {items.map((item, i) => {
        const idx = i;
        return (
          <GridItem
            key={idx}
            title={item.title}
            image={`${Constants.IMAGE_URL}/${item.poster_path}`}
            overview={item.overview}
            ratings={item.vote_average}
          />
        );
      })}
    </GridContainer>
  );
}

Grid.propTypes = {
  items: PropTypes.arrayOf(PropTypes.any)
};

Grid.defaultProps = {
  items: []
};

export default Grid;
