hello i have a problem with my code i have function that filter the state of users (users is the state that contain all the users that added) but i need on the same onclick event that 1 i will delete the current object from the array (and i did it correctly)

2 to get this users and count all the number after the delete

but when i go to users forEach it not getting the updated state and get the old one only the second click will update.. so after deleteFlight function execute its update the users without the current number but when i start to use user.forEach it not give me the update state

  const [users, setUsers] = useState([]);
  const deleteFlight = (num) => {
    const afterFilter = users.filter((user) => {
      return user.numFlight !== num;
    });
    
     setUsers(afterFilter);
     alert("deleted")
  };
      <button
        onClick={() => {
          const inp = numFlightInp.current.value;

          deleteFlight(Number(inp));

          users.forEach((user) => {
            passengerCnt += user.passenger;
            totalFlightCnt++;
          });
          setFlightCnt2(totalFlightCnt);
          setPassengerCnt2(passengerCnt);

          if (!checkDuplicateFlight(Number(inp))) return alert("not found match");
        }}
      >
        delete
      </button>