title: change in state does not re-renders the component
body: <pre><code>const [list, setList] = useState([]);
  useEffect(() =&gt; {
          const getData = async () =&gt; {
              let storeList = [];
              for (let i = 0; i&lt;50; i++) {
                  try {   
                      const token = await contract.methods.tokenOfOwnerByIndex(accountId , i).call();
                      let data = await contract.methods.tokenURI(token).call();
                      const receivedData = await fetch(data);
                      let jsonData = await receivedData.json();
                      storeList.push(jsonData);
                      setList(storeList);
                  } catch(error) {
                      cogoToast.error(`Error caused in fetching data of ${i} number token`);
                  }
              }
          };
          if (contract) getData();
      }, [contract]);
  </code></pre>
  <p>the initial state of &quot;list&quot; is empty. When the loop is run for 1st time and the list is updated for the first time, the component re-renders, but after that, even though the state is changing the component does not re-render.</p>
  <p>Ideally, the component should re-render when the state changes.</p>