import React, { Component } from 'react'
import PropTypes from 'prop-types'
import TableHeader from './TableHeader'
import TableBodySection from './TableBodySection'
import {
  TableContainer
} from './style'

class ReportTable extends Component {
  state = {
    allChecked: false
  }

  handleCheckAll = () => {
    this.setState((prevState) => ({
      allChecked: !prevState.allChecked
    }))
  }

  render () {
    const { headers, data, onSelectReport, reportedPatient, status, isNR } = this.props
    const { allChecked } = this.state
    return (
      <TableContainer>
        <TableHeader headers={headers} handleCheckAll={this.handleCheckAll} />
        <TableBodySection
          data={data}
          isNR={isNR}
          onSelectReport={onSelectReport}
          reportedPatient={reportedPatient}
          status={status}
          allChecked={allChecked}
        />
      </TableContainer>
    )
  }
}

ReportTable.propTypes = {
  headers: PropTypes.array.isRequired,
  data: PropTypes.array,
  onSelectReport: PropTypes.func,
  status: PropTypes.string,
  isNR: PropTypes.bool,
  reportedPatient: PropTypes.object
}

export default ReportTable