class Experience extends React.Component {
  onDeleteClick = exp_id => {
    this.props.deleteExperience(exp_id);
  };
  /*onDeleteClick(exp_id) {
    this.props.deleteExperience(exp_id)
  }*/

  render() {
    const experience = this.props.experience.map(exp => (
      <tr key={exp._id}>
        <td>{exp.company}</td>
        <td>{exp.title}</td>
        <td>
          {/*{exp.from} - {exp.to}*/}
          <Moment format="MM/DD/YYYY">{exp.from}</Moment> -{" "}
          {exp.to === null ? (
            "Present"
          ) : (
            <Moment format="MM/DD/YYYY">{exp.to}</Moment>
          )}
        </td>
        <td>
          <button
            onClick={this.onDeleteClick(exp._id)}
            className="btn btn-danger"
          >
            Delete
          </button>
        </td>
      </tr>
    ));
    return (
      <div>
        <h4 className="mb-4">Experience</h4>
        <table className="table">
          <thead>
            <tr>
              <th>Company</th>
              <th>Job Title</th>
              <th>Job Duration</th>
              <th />
            </tr>
            {experience}
          </thead>
        </table>
      </div>
    );
  }
}