import React, { Component, PropTypes } from 'react';
import { ListItem } from 'material-ui';
import DoneIcon from 'material-ui/svg-icons/action/done';
import WarningIcon from 'material-ui/svg-icons/alert/warning';

// import CommunicationCall from 'material-ui/svg-icons/communication/call';

import { green500, yellowA400, darkBlack } from 'material-ui/styles/colors';

const { object, string } = PropTypes;

export default class ApplicationCard extends Component {

  render() {
    const { acceptanceStatus, acadProgDescr, acadCareerDescr, termDescr } = this.props;
    const statusIcon = acceptanceStatus === 'Y' ? (
      <div>
        <DoneIcon className="ih-application-icon" color={green500} />
      </div>) : (
        <div>
          <WarningIcon className="ih-application-icon" color={yellowA400} />
        </div>);

    return (
      <ListItem
        primaryText={acadProgDescr}
        secondaryText={
          (<div>
            <span style={{ color: darkBlack }}>
              {acadCareerDescr}
            </span><br />
            {termDescr}
          </div>)
        }
        disableTouchRipple
        className="ih-application-item"
        leftIcon={statusIcon}
        secondaryTextLines={2}
      />
    );
  }
}
ApplicationCard.propTypes = {
  acadProgDescr: string,
  // acadCareer: string,
  termDescr: string,
  acceptanceStatus: string,
  acadCareerDescr: string,
};

ApplicationCard.childContextTypes = {
  muiTheme: object,
};