import React from 'react';
import WidgetMenu from '../../widgets/WidgetMenu';
import Feed from './Feed';
import FeedToolbar from './FeedToolbar';

class FeedWidget extends React.Component {

  render() {
    const menuData = {
      themes: this.props.themes,
      headerSpacing: this.props.headerSpacing,
      textSize: this.props.textSize
    };
    return (
      <div className="Widget-content Widget-content--feed">
        <WidgetMenu widgetType="newsfeed"
                    widgetId={this.props.id}
                    showMenu={this.props.showMenu}
                    toggleMenu={this.props.toggleMenu}
                    menuData={menuData} />

        <FeedToolbar filters={this.props.filters}
                     widgetId={this.props.id} />

        <Feed filters={this.props.filters}
              textSize={this.props.textSize}
              headerSpacing={this.props.headerSpacing}
              themes={this.props.themes} />
      </div>
    );
  }
}

FeedWidget.propTypes = {
  id: React.PropTypes.number,
  filters: React.PropTypes.object,
  themes: React.PropTypes.array,
  showMenu: React.PropTypes.bool,
  toggleMenu: React.PropTypes.func,
  headerSpacing: React.PropTypes.number,
  textSize: React.PropTypes.number
};

FeedWidget.defaultProps = {
  filters: {
    date: null,
    keywords: [],
    channels: [],
    symbols: [],
    watchlists: [],
    contentType: ['story']
  },
  themes: [],
  showMenu: false,
  headerspacing: 1.7,
  textSize: 12
};

export default FeedWidget;
