title: React: Execute function in useEffect Hook to update state. Use the state value to return component A or B
body: <p>When a user arrives in this component. I want to execute two function in the useEffect hook:
  - hasError (returns true if there is an error)
  - hasState  (returns true if there is an state)</p>
  
  <p>Based on the state i want to return a specific component. If access is false than 
  If it is true than </p>
  
  <p>The first time the user comes on the page it says that access if <code>false</code> when i refresh the page it is <code>true</code> Why doesn't the state update the first time?</p>
  
  <p>Am I using the wrong lifecycle method?</p>
  
  <p><strong>Component:</strong></p>
  
  <pre><code>const ContinueRouteComponent = () =&gt; {
  
      const dispatch = useDispatch();
  
      // const [access, setAccess] = useState(false);
      // const [error, setError] =  useState(false);
  
  
      const query = useQuery();
  
      //check if user has valid state
      const hasState = (stateId: string) =&gt; {
          // No state is given in the uri so no access
  
          if(stateId === null) {
              return false;
          }
  
          // You have a state in the uri but doesn't match the localstorage
          return localStorage.getItem(stateId) !== null;
      };
  
      const hasError = (error: string) =&gt; {
          return error !== null;
      };
  
      const [access, setAccess] = useState(() =&gt; hasState(query.get("state")));
      const [error, setError] =  useState(() =&gt; hasError(query.get("error")));
  
  
      useEffect(() =&gt; {
          dispatch(fetchResources());
      },[]);
  
  
      if(error){
          let errorType = query.get("error");
          let errorDescription = query.get("error_description");
  
          return &lt;Redirect exact={true} to={{
              pathname: '/error',
              state: {
                  error: errorType,
                  description: errorDescription
              }
          }} /&gt;;
      }
  
      if(access){
          const retrievedStorage = JSON.parse(localStorage.getItem(query.get("state")));
          localStorage.removeItem(query.get("state"));
          return &lt;Redirect exact to={retrievedStorage} /&gt;
      } else {
          return &lt;Redirect to="/"/&gt;
      }
  };
  
  
  export default ContinueRouteComponent
  </code></pre>