import get from 'lodash/get';
import { IfActive } from "../../../application/index.js";
import ElectionLink from "../../ElectionLink/index.js";
import ElectionIcon from "../../ElectionIcon/index.js";
import ModuleLastUpdated from "../../ModuleLastUpdated/index.js";
import classes from './styles.module.scss';
const officeTitles = {
  president: 'Presidential',
  senate: 'U.S. Senate',
  house: 'U.S. House'
};
const Title = function Title(props) {
  const {
    office,
    link
  } = props;
  const name = get(officeTitles, office);
  const label = 'Election results';
  return <div className={classes.titleContainer}>
      <div className={classes.title}>
        <ElectionLink to={link}>
          <IfActive active={!!name}>
            {name}
          </IfActive>
          {' '}
          {label}
          {' '}
          <ElectionIcon type="LinkCaret" size="2" />
        </ElectionLink>
      </div>
      <div className={classes.timestamp}>
        <ModuleLastUpdated />
      </div>
    </div>;
};
export default Title;