title: useState not updating the state
body: <p>I'm trying to filter users with input search inside the function <code>searchByName</code>.
  I manage to get the right result in <code>copyUsers</code>variable but unfortunately it does not reflect the change inside the state.</p>
  
  <p>Forgot to mention, using bare React-App with hooks and typescript.</p>
  
  <p>For example, i write 'p' in the input and recieve the right filtered array in <code>copyUsers</code> variable but then i push it into the state it does not update.</p>
  
  <p>Attaching screenshot for understanding the situation better: </p>
  
  <p><a href="https://i.stack.imgur.com/vXDFx.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/vXDFx.png" alt="enter image description here"></a></p>
  
  <p>what i have tried instead setFilteredUsers(copyUsers):</p>
  
  <ul>
  <li><p>setFilteredUsers(() => [...filteredUsers, copyUsers]);</p></li>
  <li><p>setFilteredUsers(() => copyUsers);</p></li>
  </ul>
  
  <p>main component:</p>
  
  <pre><code>  const { value } = useSelector(({ test }: any) =&gt; test);
  
    const [users, setUsers] = useState&lt;Users&gt;([]);
  
    const [filteredUsers, setFilteredUsers] = useState&lt;Users&gt;([]);
  
    const [searchNameValue, setSearchNameValue] = useState&lt;string&gt;("");
  
    const [selectedUser, setSelectedUser] = useState&lt;User&gt;();
  
    const [searchOrderBy, setSearchOrderBy] = useState&lt;string&gt;("");
  
    const dispatch = useDispatch();
  
    useEffect(() =&gt; {
      const get = async () =&gt; {
        const response = await ApiTest.testGet();
        setUsers(response);
        setSearchOrderBy("desc");
      };
      get();
    }, []);
  
    useEffect(() =&gt; {
      searchByName();
      setNewOrder();
    }, [searchOrderBy]);
  
    useEffect(() =&gt; {
      console.log('search value changed!', searchNameValue);
        searchByName();
        setNewOrder()
    }, [searchNameValue]);
  
    const setNewOrder = () =&gt; {
      if (users.length) {
        let copyUsers = JSON.parse(
          JSON.stringify(filteredUsers.length ? filteredUsers : users)
        );
        switch (searchOrderBy) {
          case "desc":
            copyUsers.sort((a: any, b: any) =&gt; {
              if (a.id &gt; b.id) {
                return -1;
              }
              if (b.id &gt; a.id) {
                return 1;
              }
              return 0;
            });
            break;
  
          case "asc":
            copyUsers.sort((a: any, b: any) =&gt; {
              if (b.id &gt; a.id) {
                return -1;
              }
              if (a.id &gt; b.id) {
                return 1;
              }
              return 0;
            });
            break;
  
          default:
            break;
        }
        filteredUsers.length ? setFilteredUsers(copyUsers) : setUsers(copyUsers);
      }
    };
  
    const searchByName = () =&gt; {
      if (searchNameValue) {
        let copyUsers = JSON.parse(JSON.stringify(users));
        copyUsers = copyUsers.filter((user: User) =&gt; {
          return user.name
            .toLocaleLowerCase()
            .includes(searchNameValue.toLocaleLowerCase());
        });
        console.log("copyUsers =", copyUsers);
        setFilteredUsers(copyUsers);
        console.log("filteredUsers =", filteredUsers);
      }
    };
  
    const UserCards =
      !!users.length &amp;&amp;
      (searchNameValue ? filteredUsers : users).map(user =&gt; {
        return (
          &lt;UserCard
            selectedUser={selectedUser}
            setSelectedUser={(user: User) =&gt; setSelectedUser(user)}
            user={user}
          /&gt;
        );
      });
  
    return (
      &lt;div&gt;
        &lt;FilterBar
          searchOrderBy={searchOrderBy}
          searchSetOrderBy={(value: string) =&gt; setSearchOrderBy(value)}
          setSearchNameValue={(value: string) =&gt; setSearchNameValue(value)}
          searchNameValue={searchNameValue}
        /&gt;
        &lt;div style={{ display: "flex", flexFlow: "wrap" }}&gt;{UserCards}&lt;/div&gt;
      &lt;/div&gt;
    );
  </code></pre>