import React from 'react';

import styles from './VoteCard.module.css';
import { ReactComponent as Coffee } from '../../assets/images/coffee.svg';
import { ReactComponent as Infinity } from '../../assets/images/infinity.svg';

const VoteCard = ({ number, isSelected, isCoffee, isInfinity, onClick }) => {
    return (
        <button className={`${styles.voteCard} ${isSelected ? styles.selected : ""} ${styles["cardo-regular"]}`} onClick={() => onClick(number)}>
            <section className={styles.voteCardInnerLayer}>
                {isCoffee
                    ? <Coffee className={styles.coffee} />
                    : isInfinity ? <Infinity className={styles.infinity} /> : number
                }
            </section>
        </button>
    );
};

export default VoteCard;
