import React from 'react';

function Answer({ answer, handleChange, selectedAnswer,showValidate }) {
    const handleSelect = () => {
        handleChange(answer.correct);
    };

    let classNames = 'list-group-item mt-5';

     if(!showValidate)
         classNames+= ` ${selectedAnswer !== null && answer.correct ? 'border-success' : ''} ${selectedAnswer !== null && !answer.correct ? 'border-danger' : ''}`;

    return (
        <li className={classNames}>
            <input className="form-check-input me-1" type="radio" name="listGroupRadio" onChange={handleSelect}/>
                <label className="form-check-label">{answer.text}</label>
        </li>
    );
}

export default Answer;