title: sort an array with react hooks
body: <p>I'm doing a simple sort of an array with react hooks, but its not updating state. Can anyone point out what I'm going here?</p>
  
  <pre><code>import React, { useState } from "react";
  import ReactDOM from "react-dom";
  
  import "./styles.css";
  
  const dogs = [{ name: "fido", age: 22 }, { name: "will", age: 50 }];
  
  function App() {
    const [dogList, setDogList] = useState(dogs);
  
    const sortByAge = () =&gt; {
      const sorted = dogList.sort((a, b) =&gt; {
        return b.age - a.age;
      });
      setDogList(sorted);
      alert(sorted[0].name);
    };
  
    return (
      &lt;div&gt;
        {dogs.map((dog, i) =&gt; {
          return &lt;p key={i}&gt;{dog.name}&lt;/p&gt;;
        })}
        &lt;div onClick={sortByAge}&gt;sort by age&lt;/div&gt;
      &lt;/div&gt;
    );
  }
  
  const rootElement = document.getElementById("root");
  ReactDOM.render(&lt;App /&gt;, rootElement);
  </code></pre>