import React, { Component, PropTypes } from 'react';
import numeral from 'numeral';
import { ListItem } from 'material-ui';

export default class AwardSummaryHeader extends Component {
  render() {
    const summary = this.props;
    return (
      <div className="row">
        <div className="small-6 columns">
          <ListItem primaryText={`Offered: ${numeral(summary.offeredBalance).format('$0,0.00')}`} />
        </div>
        <div className="small-6 columns">
          <ListItem
            primaryText={`Accepted: ${numeral(summary.acceptedBalance).format('$0,0.00')}`}
          />
        </div>
      </div>
    );
  }
}

AwardSummaryHeader.propTypes = {
  offeredBalance: PropTypes.any,
  acceptedBalance: PropTypes.any,
  disbursedBalance: PropTypes.any,
};

AwardSummaryHeader.defaultProps = {
  offeredBalance: 0,
  acceptedBalance: 0,
  disbursedBalance: 0,
};
{
  /*<div>
        <div
          className="row"
          style={{
            paddingLeft: '35px',
            paddingTop: '20px',
            paddingBottom: '5px',
            fontSize: '14px',
          }}
        >
          Aid Year Totals
        </div>
        <Divider style={{ marginBottom: '10px' }} />
        <div
          className="row"
          style={{ paddingLeft: '20px', paddingRight: '20px', fontSize: '14px' }}
        >
          <div className="small-5 columns">
            Offered&nbsp;
            <i style={{ color: 'rgba(0, 0, 0, 0.54)' }}>
              {numeral(summary.offeredBalance).format('$0,0.00')}
            </i>
          </div>
          <div className="small-5 columns">
            Accepted&nbsp;
            <i style={{ color: 'rgba(0, 0, 0, 0.54)' }}>
              {numeral(summary.acceptedBalance).format('$0,0.00')}
            </i>
          </div>
        </div>
      </div>*/
}