Agora, nós vamos utilizar o check. Nós iremos no componente “EditHabit” para poder fazer o uso do nosso serviço. “Components → Home → EditHabit → index.jsx”

Nós vamos adicionar o serviço na função “handleCheck”, mas antes vamos precisar pegar a data de hoje, para poder fazer o “lastCheck” ser no dia que a pessoa estiver dando o check no hábito. (Podemos colocar isso acima da função handleCheck)

// ... Outros códigos

const checkData = new Date();
const formatDate = `${checkData.getFullYear()}-${checkData.getMonth()}-${checkData.getDate()}`;

function handleCheck() {

// ... Outros códigos

Nós usamos o “formatDate” para poder ter a data em um formato específico, que é sem horário, para utilizamos mais na frente, o que vai facilitar a nossa vida.

Agora, dentro da função handleCheck vamos usar o serviço.

import CheckService from "../../../service/CheckService";

// ... Outros códigos

function handleCheck() {
  if (habitCheck === 0) {
    CheckService.checkHabit({
      lastCheck: formatDate,
      habitIsChecked: 1,
      habitChecks: habit?.habitChecks + 1,
      habitArea: habit?.habitArea,
    });

    setHabitCheck(1);
  }
}

Com isso feito, nós podemos monitorar o nosso código através do console. Podemos colocar na home um console.log() em um dos hábitos para vermos a mudança acontecer. (Vamos colocar acima do useEffect) “Pages → Home → index.jsx”

// ... Outros códigos

console.log({ mindHabit });

useEffect(() => {
  HabitsService.findByArea("Mente").then((mind) => {
    setMindHabit(mind[0]);
  });
  HabitsService.findByArea("Financeiro").then((money) => {
    setMoneyHabit(money[0]);
  });
  HabitsService.findByArea("Corpo").then((body) => {
    setBodyHabit(body[0]);
  });
  HabitsService.findByArea("Humor").then((fun) => {
    setFunHabit(fun[0]);
  });

// ... Outros códigos

Agora, nós podemos criar o hábito, veremos que ele vai vir com o “habitIsCheck” como 0 e o nosso “habitChecks” como null, que é assim que deve iniciar.

Agora, ao clicar no botão de check precisamos atualizar o app para o console.log vir de novo, e ao vermos, ele vai estar com os dois parâmetros modificados. O nosso “habitChecks” vai aumentando de acordo com a quantidade de checks dada no app.

Podemos então remover esse nosso “console.log” da home, pois não será mais necessário vermos a atualização do check.