import React, { Component, PropTypes } from 'react';
import getMuiTheme from 'material-ui/styles/getMuiTheme';
import UCdefaultTheme from '../../themes/DefaultTheme';


import './CourseHistory.css';

export default class CourseHistoryInProgressListItem extends Component {
  constructor(props) {
    super(props);
  }

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

  toUpperFirstLetter(str) {
    let wordArray = str.toLowerCase().split(' ');
    let formattedTitle = wordArray.map((item) => {
      let allCaps = ['i','ii','iii','iv','x'];
      let allLow = ['to','a','and'];

      if (allCaps.indexOf(item) > -1){
        return item.toUpperCase();
      } else if(allLow.indexOf(item) > -1) {
        return item;
      } else {
        return item.charAt(0).toUpperCase() + item.substring(1);
      }
    });

    return formattedTitle.join(' ');
  }

  render() {
    const { title, subject, number, section, units, bookLink } = this.props;
    return (
      <tr>
        <td>{subject}</td>
        <td>{number}</td>
        <td>{this.toUpperFirstLetter(title)}</td>
        <td>{units}</td>
        <td><a href={bookLink} target="_blank" rel="noopener noreferrer"><OpenInNew/></a></td>
      </tr>
    );
  }
}

CourseHistoryInProgressListItem.propTypes = {
  title: PropTypes.string,
  subject: PropTypes.string,
  number: PropTypes.string,
  section:PropTypes.string,
  units: PropTypes.string,
  bookLink: PropTypes.string,
};

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