title: My function that changes state is not rerendering the page [react]
body: <p>My state looks like:</p>
  <pre><code>const [profileList, setProfileList] = useState([]);
  </code></pre>
  <p>function looks like:</p>
  <pre><code>const getFriends = async () =&gt; {
      await axios
          .get(APICallString + id)
          .then((response) =&gt; {
              (async () =&gt; {
                  let p = [];
                  for await (const e of response.data) {
                      axios
                          .get(
                              &quot;http://localhost:3002/persons/getById/&quot; +
                                  e.friendId
                          )
                          .then((response) =&gt; {
                              p.push(response.data);
                          })
                          .catch((error) =&gt; {
                              console.log(error);
                          });
                  }
                  console.log(p);
                  setProfileList(p);
              })();
          })
          .catch((error) =&gt; {
              errMsg = error.message;
              console.log(error);
          });
  
      setLoaded(true);
  };
  </code></pre>
  <p>Button:</p>
  <pre><code>&lt;Button className=&quot;p-2 border&quot; onClick={() =&gt; getFriends()}&gt;
      Search
  &lt;/Button&gt;
  </code></pre>
  <p>The function works as expected, when I change state by typing in my textbox... but it doesnt change state its self.</p>
  <p>Why?</p>