TodoList.js

import { useTodoListStore } from '../../store/TodoListStore';

const TodoList = () => {
  const {
    tasks,
    addTask,
    renameTask,
    removeTask,
  } = useTodoListStore();

  return (
    <>
      <TodoListItem addTask={addTask} />

      {tasks && tasks.map(task =>
        <TodoListItem
          key={task.id}
          {...task}
          renameTask={renameTask}
          removeTask={removeTask}
        />
      )}
    </>
  );
};

export default TodoList;