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;