pd-todo-list.js

const TodoList = ({ todos, onDelete, canDelete }) => {
  return (
    <div>
      <Title value="Todo List" />
      <div>
        {todos.map(todo => (
          <TodoItem
            key={todo.id}
            todo={todo}
            onDelete={onDelete}
            canDelete={canDelete}
          />
        ))}
      </div>
    </div>
  );
};

TodoList.propTypes = {
  todos: PropTypes.array,
  onDelete: PropTypes.func,
  canDelete: PropTypes.bool,
};