title: Logical error in React useEffect and conditional statement
body: <p>I have recently asked a question about infinite loop caused by useState in React, and I got help. But now I have another bug with same code;</p>
  <pre><code>const [scoutMode, setScoutMode] = useState(&quot;&quot;);
  const [bottomLinks, setBottomLinks] = useState([]);
  
  useEffect(() =&gt; {
  
  setScoutMode(&quot;weeklyProgramme&quot;);
  
  if (scoutMode == &quot;weeklyProgramme&quot;) {
    setBottomLinks([&quot;x&quot;, &quot;y&quot;])
    console.log(&quot;weeklyprogramme&quot;);
  
  } 
  else if (scoutMode == &quot;camp&quot;) {
    setBottomLinks([&quot;a&quot;, &quot;b&quot;])
    console.log(&quot;camp&quot;);
  
  } 
  
  else {
    setBottomLinks([&quot;c&quot;, &quot;d&quot;]);
    console.log(&quot;None&quot;)
  }
  console.log(bottomLinks);
  }, [scoutMode])
  </code></pre>
  <p>I expected that it writes [&quot;x&quot;, &quot;y&quot;] and &quot;weeklyprogramme&quot; in console because obviously the first condition is true, but instead the output is like this:
  <a href="https://i.stack.imgur.com/bGSF9.png" rel="nofollow noreferrer">picture of output</a></p>
  <p>It looks like it runs partly the first condition's statements and also the else statement. Could somebody explain? Does React or hook work unexpectedly?</p>