{"size": 826, "ext": "js", "max_stars_repo_path": "src/components/MeetUps.js", "max_stars_repo_name": "katrinagarloff/convene-frontend", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/components/MeetUps.js", "max_issues_repo_name": "katrinagarloff/convene-frontend", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/components/MeetUps.js", "max_forks_repo_name": "katrinagarloff/convene-frontend", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 22.3243243243, "max_line_length": 118, "alphanum_fraction": 0.6234866828}
import React from 'react';
import { connect } from 'react-redux'
import MeetUp from './MeetUp'

const MeetUps = (props) => {

  const displayMeetUps = () => {
    return props.meetUps.map(meetup => {

      const { id, name, local_date, local_time, description} = meetup
      return (

        <MeetUp key={id} id={id} name={name} description={description} local_date={local_date} local_time={local_time}
          venue={meetup.venue ? meetup.venue : null}
        />)
    })
  }

  displayMeetUps()
  return (
    <div className='meetup-box'>
    <div className="meetup " id="meetup-header"> Meetups </div>
    <div className='scroll'>
      {displayMeetUps()}
      </div>
    </div>
  )
}

const mapStateToProps = (state) => {
  return {
    meetUps: state.meetUps
  }
}

export default connect(mapStateToProps)(MeetUps)
