import './EligibilityCriterion.scss';
import redLine from '../../../../assets/images/line.svg';
import greenCheck from '../../../../assets/images/check-green.svg'

type EligibilityCriterionProps = {
    context: string,
    eligibilityStatus: boolean   
}

const EligibilityCriterion = ({context, eligibilityStatus}: EligibilityCriterionProps) => {
    return (
         <div className={`eligiblity-criterion-container ${eligibilityStatus === true ? 'eligibility-border-green' : 'eligibility-border-red'}`}>
            <div className='eligibility-criterion'>
               <img width={23} height={18} src={eligibilityStatus === true ? greenCheck : redLine} alt="eligibility-status"/>
               <p className='eligibility-criterion--text'>{context}</p>
            </div>
         </div>
    );
}
export default EligibilityCriterion;