Infinite loop

Question

Hey everyone, i have a infite loop when i try to insert data in my bd but the probleme it's i dont have infite loop when i dont try to insert and i just log my form. Someone help me ? code : import {Phase, Projet} from "@/utils/types/types";
import {LinkingOfferPhase} from "@/utils/types/databaseTypes";
import {useKocoContext} from "@/sections/moulinetteKoCo/context/KocoContext";
import {FormKOCO} from "@/sections/moulinetteKoCo/types";
import {useQueryClient} from "@tanstack/react-query";
import addPhaseProjetDB from "@/sections/moulinetteKoCo/utils/addPhaseProjetDB";
import {enqueueSnackbar} from "notistack";

type Props = {
    phases: Phase[];
    linkingOfferPhase: LinkingOfferPhase[] | undefined;
    project: Projet | null;
};

export async function UseInsertData({phases, linkingOfferPhase, project}: Props) {

const {opportunities} = useKocoContext();

const queryClient = useQueryClient();

const findOpportunities = opportunities.filter((opportunity) =>
        linkingOfferPhase?.some((linking) => linking.offer_id === opportunity.offer_id)
    );

const phasesTmp = phases

await Promise.all(phasesTmp.map(async (phase) => {
        try {
            const form: FormKOCO = {
                name: phase.name,
                date_fin: "2024-12-02",
                date_debut: "2024-12-02",
                linking_opportunities: [],
                list_clickup_id: "",
            };

console.log("form", form);
            const result = await addPhaseProjetDB(form, project, queryClient);
            if (result) {
                enqueueSnackbar(`La phase ${phase.name} a été ajoutée avec succès`, {variant: "success"});
            } else {
                enqueueSnackbar(`Erreur lors de l'ajout de la phase ${phase.name}`, {variant: "error"});
            }
        } catch (error) {
            console.error(`Erreur pour la phase ${phase.name}:`, error);
        }
    }));
}

B33fb0n3 · Answer

the way how you insert it from a client component into your DB is wrong.

1. Your client shouldn't have access to your DB (maybe addPhaseProjetDB is a server action, then it's fine)
2. Use your hooks. For example a useEffect hook when you want to insert it instantly. Or build functions that will be called during a specific event

So do at least "2." and it will solve your problem

Infinite loop

2 Replies