title: Change state conditioned on in useEffect without triggering the hook and without breaking the exhaustive dependencies rule
body: <p>I am trying to register a mutation as being inFlight in a useEffect hook. The registration should only occur if the mutation has not already been registered. Thus, I have a boolean variable in state to keep track of whether the mutation has already been registered and I register conditionally based on it. Right after I register the mutation in the useEffect, I set this variable to true. Consequently, I set it to false in my deregister mutation function right after I conduct the deregistration. </p>
  
  <p>Here comes the issue: In order to adhere to the exhaustive dependency rule of useEffect, I have to include the boolean state variable in the dependency array. However, that means that as soon as I deregister, the useEffect will run and re-register the mutation. Instead, I want the deregister to simply "prepare" for registration and then only have registration occur once a specific value changes. Is that even possible while complying with the exhaustive dependency rule?</p>
  
  <p>I've tried to change the boolean variable to an ENUM containing three states (AwaitingValueChange, ShouldDispatch, HasDispatched), only dispatch if its value is ShouldDispatch, and set the value to AwaitingValueChange in the deregister. Then I've created a new hook to be run every time the value that should trigger registration changes and set the state variable to ShouldDispatch if its current value is AwaitingValueChange. However, the new hook is conditioned on the state variable too, so I run into the exact same problem, just this time around the call chain is: Deregister -> new hook -> old hook -> register instead of deregister -> old hook -> register.</p>
  
  <p>The register code:</p>
  
  <pre><code>useEffect(() =&gt; {
    if (hasRegisteredMutationInFlight &amp;&amp; inFlightDispatch) {
          inFlightDispatch({ type: 'registerMutation', mutationName });
          setHasRegisteredMutationInFlight(true);
        }
    }, [hasRegisteredMutationInFlight, ...]);
  </code></pre>
  
  <p>The deregister code:</p>
  
  <pre><code>const deregisterMutation = () =&gt; {
    inFlightDispatch({ type: 'deregisterMutation', mutationName });
    setHasRegisteredMutationInFlight(false);
  };
  </code></pre>
  
  <p>I would like some way to set a state, not have it trigger my useEffect but use that state to carry out an action conditionally in that same useEffect. I also would like to not break the exhaustive dependency rule. To me, it sounds impossible with the current implementation of useEffect, but I hope someone in here is a bit smarter than me and can see some solution I am overlooking</p>