title: What is the corrct way of running useEffect hook depending on state variable?
body: <p>I am writing a camera app. So when the user goes to the camera page they are provided with the option to grant camera permissions or not. I am saving their decision in variable <code>  const [hasPermission, setHasPermission] = useState(null);</code> My current use effect function:</p>
  <pre><code>useEffect(() =&gt; {
      (async () =&gt; {
        const { status } = await Camera.requestPermissionsAsync();
        const audioPermissions = await Audio.requestPermissionsAsync();
        if (
          cameraPermissions.status === &quot;granted&quot; &amp;&amp;
          audioPermissions.status === &quot;granted&quot;
        ) {
          setHasPermission(true);
        }
      })();
    }, []);
  </code></pre>
  <p>This currently works correctly when the user runs the app for the very first time - they grant permission, and thats it - I can use the camera!</p>
  <p>However..... what if they dont grant permission. They ecide not to use the camera, they deny access and later on they change their mind.. For instance 5 mins later, they open the &quot;camera&quot; page again and want to grant a permission. Here is my problem. As it is in the current situation <code>useEffect</code>, i.e. the request to use the camera will show only once, when you initially load the page. How do I force it to pop up again if the user hasnt granted permissions yet?</p>
  <p>I tried the following:</p>
  <pre><code>useEffect(() =&gt; {
      (async () =&gt; {
        const { status } = await Camera.requestPermissionsAsync();
        const audioPermissions = await Audio.requestPermissionsAsync();
        if (
          cameraPermissions.status === &quot;granted&quot; &amp;&amp;
          audioPermissions.status === &quot;granted&quot;
        ) {
          setHasPermission(true);
        }
      })();
    }, [hasPermission === null]);
  </code></pre>
  <p>but it didnt work. Any suggestions?</p>