title: Can't use a third setState. Error: Too many re-renders
body: <p>I'm trying to set an initial state to my Hook, and I have a clickable that when clicked changes the state to Decreasing and Increasing, this part is working fine. The problem is when I try to define the initial state my code crashes and says that are <code>Too Many re-renders. React limits the numbers of renders to produce an infinite loop.</code></p>
  <pre><code>    const [measures, setMeasures] = useState([]);
      const [duration, setDuration] = useState([]);
      const [word, setWord] = useState('Increasing')
  
      useEffect(() =&gt; {
          api.get('measures').then(res =&gt; {
              setMeasures(res.data.measures);
              // let a = res.data.measures
          });
      }, []);
      
      const total = measures.map((duration) =&gt; {
          return parseFloat(duration.duration);
      });
  
      setDuration(total) &lt;&lt;&lt;&lt;&lt;HERE IS CRASHING 
  
      const action = () =&gt; {
          if (word === 'Increasing') {
              setWord('Decreasing');
  
              const increasing = () =&gt; {
                  let organiseIncrease = total.sort(function (a, b) {
                      return (b - a)
                  });
                  setDuration(organiseIncrease);
              };
              increasing()
          } else {
              setWord('Increasing');
  
              const decreasing = () =&gt; {
                  let organiseDecreasing = total.sort(function (a, b) {
                      return(a - b)
                  });
                  setDuration(organiseDecreasing)
              };
              decreasing()
          }  
      }
  </code></pre>
  <p>total returns numbers like [15, 12, 50];
  I just want to render this array automatically when I enter the page and then click the button to organise to a increasing/decreasing order. I tried to change de hook to:</p>
  <pre><code>const [duration, setDuration] = useState([total]);
  </code></pre>
  <p>But gives me: [undefined].
  I tough about wrap all in a function and use Async/Await to fill the hook but I don't know if it'll work.
  Any clue how can I fix this code?</p>