import PropTypes from 'prop-types';
import StateRaceDistrictsMap from '../StateDistrictsMap';
import ModuleTitle from '../ModuleTitle';
import classes from './styles.module.scss';

/**
 * A module displaying a state's district results on map, along with an optional headline.
 */
const StateDistrictsResults = function StateDistrictsResults(props) {
  const {
    collectionId,
    reporterNote: reporterNoteProps,
    eyebrow,
    headline
  } = props;
  return <div className={classes.container}>
      <ModuleTitle headline={headline} eyebrow={{
      isLive: true,
      ...eyebrow
    }} reporterNote={reporterNoteProps} />
      <StateRaceDistrictsMap collectionId={collectionId} />
    </div>;
};
StateDistrictsResults.defaultProps = {
  reporterNote: undefined,
  eyebrow: undefined,
  headline: undefined
};
StateDistrictsResults.propTypes = {
  /**
   * The ID of the contest collection that contains the districts
   */
  collectionId: PropTypes.string.isRequired,
  /**
   * An optional reporter note to include as an inline annotation for this
   * module. Should be passed through to the `ReporterNote` component.
   */
  reporterNote: PropTypes.shape({}),
  /**
   * Custom configuration for the module eyebrow
   */
  eyebrow: PropTypes.shape({}),
  /**
   * Custom headline
   */
  headline: PropTypes.string
};
export default StateDistrictsResults;