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!
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Solucionado
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.