import React from 'react';

import getMuiTheme from 'material-ui/styles/getMuiTheme';

import UCdefaultTheme from '../../themes/DefaultTheme';

import IHNewsCard from './IHNewsCard';
import IHEmptyNewsCard from './IHEmptyNewsCard';

export default class IHNewsFeed extends React.Component {
  propTypes: {
    showViewButton: React.PropTypes.bool,
    ncd: React.PropTypes.object,
  }

  defaultProps: {
      showViewButton: false,
  }

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

  // Get URL for more news stories
  getMoreLink() {
    const { ncd } = this.props;
    if (ncd['news-publication-result']['section-links'].link !== undefined) {
      return ncd['news-publication-result']['section-links'].link.filter(item => item.viewall === 'yes')[0].text;
    }
    return undefined;
  }

  // When view button is clicked, open PeopleSoft modal to view story
  handleMoreClick() {
    // use PeopleSoft function to open URL in modal
    openContentInModal(this.getMoreLink());
  }

  render() {
    const { ncd, showViewButton } = this.props;
    // let moreButton;

    if (!ncd['news-publication-result'] ||
        !ncd['news-publication-result']['news-publication-top-story']) {
      return (<IHEmptyNewsCard />);
    }

    if (ncd['news-publication-result']['section-links'].link !== undefined) {
      /* moreButton = (
        <RaisedButton
          label="More..."
          onClick={this.handleMoreClick}
        />
      ); */
    }

    return (
      <div key="ih-news">
        <NewsCards
          data={ncd['news-publication-result']['news-publication-top-story'].item} showViewButton={showViewButton}
        />
      </div>
    );
  }
}

IHNewsFeed.childContextTypes = {
  muiTheme: React.PropTypes.object,
};

const NewsCards = (props) => {
  let cardNodes = [];

  if (props.data === undefined) {
    // Use empty news card if no top stories are found
    // See IHEmptyNewsCard.jsx
    cardNodes.push(<IHEmptyNewsCard key={0} />);
  } else {
    const newsList = Array.isArray(props.data) ? props.data : [props.data];
      // Build array of news stories
    cardNodes = newsList.map(cardItem => (
      // Build news card using top news story properties
      // See IHNewsCard.jsx
      <div key={`newscard-${cardItem.id}`}>
        <IHNewsCard
          data={cardItem}
          showViewButton={props.showViewButton}
        />
        <br />
      </div>
    ));
  }

    // render top news stories
  return (
    <div key={'ih-news-feed'}>
      {cardNodes}
    </div>
  );
};

NewsCards.propTypes = {
  showViewButton: React.PropTypes.bool,
};

module.exports = IHNewsFeed;
