import classnames from 'classnames';
import CandidateVotes from "../../CandidateVotes/index.js";
import IfActive from "../../../application/IfActive/index.js";
import { getCandidateCallStatus } from "../../../../utils/election/index.js";
import { useContestSummaryResults } from "../../../../hooks/election/index.js";
import { useResultsTableFormatContext } from '../context';
import CandidateHeader from '../CandidateHeader';
import typography from '../typography.module.scss';
import classes from './styles.module.scss';
const RegularRow = function RegularRow(props) {
  const {
    id,
    candidateId,
    idx
  } = props;
  const {
    showVotes
  } = useResultsTableFormatContext();
  const summary = useContestSummaryResults(id);
  const candidateStatus = getCandidateCallStatus(summary, candidateId);
  return <>
      <CandidateHeader id={id} candidateId={candidateId} idx={idx} />
      <IfActive active={showVotes}>
        <div role="cell" className={classnames(classes.cell, typography.cellText, {
        [typography.bold]: candidateStatus === 'winner'
      })}>
          <CandidateVotes id={id} candidateId={candidateId} />
        </div>
      </IfActive>
      <div role="cell" className={classnames(classes.cell, classes.votes, typography.cellText, {
      [typography.bold]: candidateStatus === 'winner'
    })}>
        <CandidateVotes id={id} candidateId={candidateId} format="percent" minimumFractionDigits={1} />
      </div>
    </>;
};
export default RegularRow;