import React from "react" import "./index.scss" import classnames from "classnames" const Navigation = ({ questions, answer, handleClick, isAnalysis }) => { return ( <div className="navigation"> <ul> {!!questions.length && questions.map((item, index) => { const userSelectIndex = item.options.findIndex( (item) => item.user_select ) const rightAnswerIndex = item.options.findIndex( (item) => item.is_ans ) return ( <li key={index} onClick={handleClick.bind(this, index)} className={classnames({ active: answer && answer[item.id], correct: isAnalysis && userSelectIndex === rightAnswerIndex, error: isAnalysis && userSelectIndex >= 0 && userSelectIndex !== rightAnswerIndex, unselect: isAnalysis && userSelectIndex < 0, })} > {index + 1} </li> ) })} </ul> </div> ) } export default Navigation