import './List.scss'

type TProps = {
    list: string[]
    title: string
    onDelete?: (item: string) => void
}

const List = ({list, title, onDelete}: TProps) => {
    return (
    <div className='List'>
        <h2>{title}</h2>

        <div>
            {
                list.map((item, index) => (
                    <p key={index} onClick={() => onDelete && onDelete(item)}>
                        {item}
                    </p>
                ))
            }
        </div>
    </div>
  )
}

export default List