import React, { Component, PropTypes } from 'react';
import OpenInNewIcon from 'material-ui/svg-icons/action/open-in-new';
import getMuiTheme from 'material-ui/styles/getMuiTheme';
import UCdefaultTheme from '../../../themes/DefaultTheme';

export default class ClassScheduleTermListItem extends Component {
  // constructor(props) {
  //   super(props);
  // } Useless constructor

  getChildContext() {
    const theme = getMuiTheme(UCdefaultTheme);
    return {
      muiTheme: theme,
    };
  }

  render() {
    const { classNumber, section, type, instructor, room, days, times, booklink } = this.props;
    return (
      <table className="class-section">
        <tbody>
          <tr>
            <td>Class #</td>
            <td>Section</td>
            <td>Component</td>
            <td style={{ textAlign: 'right' }}>Instructor</td>
          </tr>
          <tr className="col-title">
            <td>{classNumber}</td>
            <td>{section}</td>
            <td><span style={{ textTransform: 'uppercase' }}>{type}</span></td>
            <td style={{ textAlign: 'right' }}>{instructor}</td>
          </tr>
          <tr className="col-heads">
            <th>Room</th>
            <th>Days</th>
            <th>Times</th>
            <th>Book</th>
          </tr>
          <tr>
            <td style={{ fontWeight: 'bold' }}>{room}</td>
            <td style={{ fontWeight: 'bold' }}>{days}</td>
            <td style={{ fontWeight: 'bold' }}>{times}</td>
            <td style={{ fontWeight: 'bold' }}>{booklink ?
              <a href={booklink} target="_blank" rel="noopener noreferrer"><OpenInNewIcon /></a> : 'NA' }
              {/* ES Lint says security risk when using target=_blank */}
            </td>
          </tr>
        </tbody>
      </table>
    );
  }
}

ClassScheduleTermListItem.propTypes = {
  classNumber: PropTypes.string,
  section: PropTypes.string,
  type: PropTypes.string,
  instructor: PropTypes.string,
  room: PropTypes.string,
  days: PropTypes.string,
  times: PropTypes.string,
  booklink: PropTypes.string,
};

ClassScheduleTermListItem.childContextTypes = {
  muiTheme: PropTypes.object,
};
