0

estoy haciendo un programa de gestión academica, y mi lider quiere que cada vez que se haga un petición al back, este token se refresque. Tengo mi problema el cual es, que mi useEffect se está renderizando infinitamente. Aqui dejo el codigo por si pueden ayudar. Mil gracias!!!!

import { useEffect, useState } from "react";
import { Permission } from "../interfaces/Permission";
import { getAllPermissions } from "../helpers/getAllPermissions";
import { useContext } from "react";
import { AuthContext } from "../../login/context/AuthContext";
export const usePermissions = () => {
    const [permissions, setPermissions] = useState<null | Permission[]>(null);
    const { user, setUser } = useContext(AuthContext);

    useEffect(() => {
        if (user) {
            getAllPermissions(user.token)
                .then((data) => {
                    setUser((newUser) => {
                        if (!newUser) {
                            return null;
                        }
                        return { ...newUser, token: data.token };
                   });
                   return data.data;
                })
           .then((data) => setPermissions(data))
           .catch((err) => console.log(err));
      }
    }, [user, setUser]);
   console.log(user);
   return permissions;
   };

Espero me puedan ayudar, muchas de antemano nuevamente!!

1 respuesta 1

0

Podrías intentar separando el useEffect para que uno sea la actualización del token y otra para obtener los permisos, te quedaría algo así:

import { useEffect, useState } from "react";
import { Permission } from "../interfaces/Permission";
import { getAllPermissions } from "../helpers/getAllPermissions";
import { useContext } from "react";
import { AuthContext } from "../../login/context/AuthContext";

export const usePermissions = () => {
    const [permissions, setPermissions] = useState<null | Permission[]>(null);
    const { user, setUser } = useContext(AuthContext);

    // Obtener permisos
    useEffect(() => {
        if (user) {
            getAllPermissions(user.token)
                .then((data) => {
                    setPermissions(data.data);
                })
                .catch((err) => console.log(err));
        }
    }, [user?.token]); // Dependencia solo en el token para evitar ciclos

    // Efecto para actualizar el token, separado del de obtener permisos
    useEffect(() => {
        const actualizarToken = async () => {
            // Simula la obtención de un nuevo token
            const nuevoToken = "NUEVO_TOKEN";
            if (user) {
                setUser({ ...user, token: nuevoToken });
            }
        };

        actualizarToken();
    }, []); 

    return permissions;
};

Remplaza solamente NUEVO_TOKEN por el token que obtengas.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.