While creating a protected route for a react app using react router v6 i check the auth state of an AWS user on the project. The protection works after the useEffect makes too many attempts and is throttled by the browser, but i would like to stop this error from happening, this is the error message that is received...
react-dom.development.js:86 Warning: Maximum update depth exceeded. This can happen when a component calls setState inside useEffect, but useEffect either doesn't have a dependency array, or one of the dependencies changes on every render.
here is the code for the useEffect that checks a current authenticated user
const [isAuthenticated, setLoggedIn] = useState(true);
useEffect(() => {
(async () => {
let user = null;
try {
user = await Auth.currentSession();
if (user) {
console.log("protected route use effecrt");
setLoggedIn(true);
} else {
setLoggedIn(false);
console.log("NO permission");
}
} catch (e) {
setLoggedIn(false);
}
})();
}, []);