I want to recive the state isAuthenticated in Home.js but when I change it before , in Login.js to true (I saw it in useEffect -->true) , the useAppContext() in Home.js return the old state -->false (the Old one in App.js) not the Last change in Login?

//----------------------in App.js----------------------

var [isAuthenticated, userHasAuthenticated] = useState('false');

<AppContext.Provider value={{ isAuthenticated, userHasAuthenticated }}>
//...
</AppContext.Provider>



//-------------- in Login.js---------------------

const { isAuthenticated, userHasAuthenticated } = useAppContext();

useEffect(() => {
  console.log(isAuthenticated);    //  true 
}, [isAuthenticated]);

const login = () => {
  userHasAuthenticated('true'); 
  window.location.assign("/Home");
}



//  ---------------------in Home.js------------------------

 const { isAuthenticated,userHasAuthenticated } = useAppContext();
        console.log(isAuthenticated);// --->false ?