Quando se apaga uma das Tasks, e depois cria uma nova Task, as duas ultimas tasks ficam com o mesmo ID, gerando um erro de duplicidade!
Quando se apaga uma das Tasks, e depois cria uma nova Task, as duas ultimas tasks ficam com o mesmo ID, gerando um erro de duplicidade!
O problema está em usar oldState.length + 1 como ID. Quando você deleta uma tarefa, o comprimento do array diminui, e o próximo ID gerado pode ser duplicado.
`import { createContext, useState, useRef } from "react";
export const TaskContext = createContext();
export function TasksProvider({ children }) {
const [tasks, setTasks] = useState([]);
const idCounterRef = useRef(0);
const addTask = (description) => {
console.log(Tarefa adicionada: ${description});
idCounterRef.current += 1;
setTasks(oldState => {
return [
...oldState,
{
description,
id: idCounterRef.current,
}
]
})
};
// ...`
Dessa forma, o id sempre incrementa independentemente de quantas tarefas existem, garantindo IDs únicos mesmo após deletar tarefas.