export const TodoWrapper = ({ data, handleRemove }) => {
    return (
        <div>
            <div>
                My tasks:
            </div>
            <div>
                {data.length > 0 ?
                    <ul>
                        {data.map(task => {
                            return (
                                <div key={task._id}>
                                    <li>
                                        {task.title} <span onClick={() => handleRemove(task)} style={{
                                            marginLeft: '30px',
                                            cursor: "pointer"
                                        }}>
                                            X
                                        </span>
                                    </li>
                                </div>
                            )
                        })}
                    </ul>
                    : <div>
                        No tasks to do.Yaay!
                    </div>
                }

            </div>
        </div>
    )
}