{"size": 811, "ext": "js", "max_stars_repo_path": "src/components/routes/app/results/ItemList.js", "max_stars_repo_name": "CodeHubOrg/organisations-database", "max_stars_repo_stars_event_min_datetime": "2016-01-26T13:35:34.000Z", "max_stars_repo_stars_event_max_datetime": "2017-10-18T09:17:48.000Z", "max_issues_repo_path": "src/components/routes/app/results/ItemList.js", "max_issues_repo_name": "CodeHubOrg/organisations-database", "max_issues_repo_issues_event_min_datetime": "2016-03-03T10:08:55.000Z", "max_issues_repo_issues_event_max_datetime": "2020-05-18T09:23:42.000Z", "max_forks_repo_path": "src/components/routes/app/results/ItemList.js", "max_forks_repo_name": "CodeHubOrg/organisations-database", "max_forks_repo_forks_event_min_datetime": "2016-01-26T12:03:10.000Z", "max_forks_repo_forks_event_max_datetime": "2017-07-18T10:13:13.000Z"}
{"max_stars_count": 10, "max_issues_count": 43, "max_forks_count": 17, "avg_line_length": 22.5277777778, "max_line_length": 72, "alphanum_fraction": 0.5030826141}
import React, { Component } from 'react'
import ItemListRow from './ItemListRow'

const ItemList = ({items, onSelectItem, onDeselectItem}) => {
  let rows = items.map(
    (item, index) => {
      return (
        <ItemListRow
          name = {item.name}
          selected = {item.selected}
          id = {item.id}
          key = {index}
          onSelectItem = {() => onSelectItem(item.id)}
          onDeselectItem = {() => onDeselectItem()}
          />
      )
    }
  )

  return (
      <table className="table table-striped table-bordered table-hover">
        <thead className="thead">
          <tr>
            <th>Name</th>
            <th>Id</th>
          </tr>
        </thead>
        <tbody className="tbody">
          {rows}
        </tbody>
      </table>
  )
}

export default ItemList
