Se crearon hooks para el setup de la aplicación

import { set, useForm } from "react-hook-form";

import { useGetInterests } from "./useGetInterests";

import { IOption } from "../../common/domain/entities/option";

import { useEffect, useState } from "react";

import { ApiRequestStatus } from "../../common/constants/api_request_states";

export type SetUpProfileFormValues = {

  interests: number[];

  birthdate: string;

};

export const useSetUpProfile = () => {

  const { control, handleSubmit, setValue } = useForm<SetUpProfileFormValues>();

  const { interests: allCategories, requestStatus } = useGetInterests();

  // TODO: Si se agregan mas campos que requieran datos de la API, debemos procurar que todos los request status esten en success

  const [interests, setInterests] = useState<IOption[]>([]);

  useEffect(() => {

    if (requestStatus === ApiRequestStatus.SUCCESS && allCategories && allCategories.length > 0) {

        setInterests([...allCategories]);

    }

  }, [requestStatus]);

  const toogleInterest = (id: number) => {

    console.log("toogle");

    const newInterests = interests.map((interest) => {

      if (interest.id === id) {

        return { ...interest, isSelected: !interest.isSelected };

      }

      return interest;

    });

    setInterests(newInterests);

  };

  const onSubmit = async () => {

    setValue("interests", interests.filter((interest) => interest.isSelected).map((interest) => interest.id));

    await handleSubmit((data) => {

        //TODO: Implementar la logica de envio de datos

        //TODO: Verificar si se enviará la fecha de nacimiento y los intereses en el mismo request o por separado

      console.log(data);

    })();

  };

  return { control, onSubmit, toogleInterest, interests, requestStatus };

};