Agora que a gente aprendeu sobre o atributo ou propriedade checked, vamos usá-la para fazer o onChange. Então, o que a gente vai fazer aqui? Primeiro a gente tem que buscar. Faz a busca para ver se o elemento que a gente está se referindo no onChange, se está presente na array de frutas. Lista de frutas. Se estiver presente, a gente vai remover. Se atostado e remove aquele elemento da array da lista. Se não estiver presente, a gente vai adicionar o elemento, a fruta, a lista de frutas. Primeiro coisa a gente tem que encontrar o índice, o index do elemento. E se não tiver, vai dar negativo 1, menos 1. Mudar const index, eu vou dar the state frutas.indexOf. A gente está procurando o que? Vai ser assim, banana, maçã ou alguma coisa. Esse aqui vai ser o event.target.value. Certo? Se quiser extrair isso para fora, pode ser. Você pode fazer o destrutoramento assim, dessa maneira. Está extraindo o value desse objeto event.target. E pode ser ferir a value aqui. Da mesma maneira, você pode fazer com o destrutor.satis, que a gente vai usar tanto, tanto, que você vai notar que a gente pode fazer destrutoramento também. Mas vou deixar para depois. Então, a gente vai dar um f. Se o index... Vamos supor que não foi encontrado. Index é menos 1, significa não foi encontrado. Fruta não foi encontrada. A gente vai adicionar. Então, vamos dar uma variável chamada nova ou new frutas. Uma coisa assim. Vou dar só um let, porque eu vou definir aqui. Ou no caso do else. Se não foi encontrado, new fruta vai ser o quê? Vai ser a des, ponto state, ponto frutas. Adicionando a nossa fruta. Vendeu? Conquete a função que concatena a array. Por exemplo, você tem a array de números ou de strings, vamos lá, banana assim. Você dá um conquete em outra array. Combina as duas. Tá bom? Então, essa array vai ser combinada com essa outra array que tem o valor value. Pode ser banana, morango ou maçã. Certo? Essa vai ser as novas frutas. Se for encontrada, a gente vai deletar. Como? Primeiro fala que novas frutas, new frutas vai ser o quê? Vamos fazer uma cópia dos frutas. Vamos fazer a cópia, que a gente não pode modificar o estado diretamente. A gente vai usar a função slice só para fazer uma cópia. Quando a gente der um slice em qualquer array, faz uma cópia e não modifica. Essa cópia não é a original, uma nova array. Desta cópia, eu vou remover o quê? Eu vou remover aquele elemento baseado no index. Você sabe a função splice? Você der um index e quantas elementos você quer remover? Um elemento na posição index. Tá bom? Então, o index é a posição do elemento que a gente quer remover. Nesse caso, remove só um elemento. A gente remover, a gente vai ter essa new frutas que vai ser modificada. O splice modifica a variável original. Não faz uma cópia. Depois disso, a gente tem novas frutas. A gente só precisa dar o set state com frutas, vai ser new frutas. Assim. Tá bom? Eu vou dar um console log aqui, só para ver o que acontece. A função set state é a síncrona. Então, se eu der o console log depois disso, pode ser que eu não veja realmente o verdadeiro valor do estado. Se eu der um console log, veja esse state da frutas aqui. Talvez, esse demore a fazer isso e vai dar o console log antes de setar o estado. Para consertar isso, a gente passa um callback como segundo parâmetro para a função set state, fazer uma função de flusher, e vou dar o console log. Entendeu? Quando você, quando terminar de setar o state, chame o console log. Assim vai aparecer o console log corretamente. Certo? Não sei se eu gosto do estilo, depende de você. Salvar. Agora, vamos ver o que acontece. Voltando aqui, você note que a gente deixou o padrão banana e maçã. Quando a gente clica aqui, maçã, vai dar um on change. Vamos pensar no que vai acontecer. Qual é a expectativa aqui? Entendeu? A gente vai achar a maçã, se a gente clicar na maçã, a maçã está dentro da array, vai achar. Então, não vai dar negativo. Vai dar aqui. Vai entrar aqui, vai dar os slides para copiar a array e vai remover o elemento da posição número 1 e vai ficar só com banana. Vamos lá. E aí, valeu? Só banana. Adicione de novo, está a maçã. Adicione o morango, remove banana. E assim, cuide antes, não tem nada. Maçã. Entendeu? Agora, você pode dar um refactor aqui, senão eu estou usando esse potstate de frutos todo o tempo. Eu posso extrair esse cara daqui e eu pego aqui, dá uma destruturada assim. Pega aqui do state. Está dentro do ds.state. Esse objeto tem a propriedade de frutos que eu vou destruturar e qualquer chamada para o ds.state.sefile não precisa mais. Entendeu? Salvar, ao invés de não ter problema no meu refactoring, aprimoramento do meu código. Eita, o que é que deu? Ah, agora. Só pode ser esse cara aqui. É. Se eu tirar e destruturar esse cara aqui, vai dar uns problemas. O que será? Acho que porque esse fruto está se referindo ao estado antigo e por isso não funciona. Então, deixe esse cara como ds.state. Doutrutas. Tá bom? Então, só atualizar e ver se não deu problema. Tudo ok. Então, deixe esse cara assim.