How To Update useState with customer's name and ID in a single onChange Event Reactjs

I want to update the a useState on the change of a drop down menu. When you choose a customer's name it would change the name from the drop down menu but also update another useState to his corresponding ID from firebase firestore.

I am getting all customers id's and names from my firebase firestore database. And when I select to choose a different customer i want to update both the name and ID in the database.

In other words i want to view the selected customer name in the drop down menu but change his name and ID in firebase firestore.

How can I achieve this in a single onChange Event?

Here is my code:

  const [customerName, setCustomerName] = useState();
  const [customerID, setCustomerID] = useState();
  const [customer, setCustomer] = useState([]);

  const [updateCustomer, setUpdateCustomer] = useState();
  const [updateCustomerID, setUpdateCustomerID] = useState();

  const getAllCustomers = async () => {
    await firebase
      .firestore()
      .collection("Customers")
      .get()
      .then(snapshot => {
        const customers = snapshot.docs.map(customer => customer.data());
        setCustomer(customers);
      });
  };

 const updateProperty = async () => {
    firebase
      .firestore()
      .collection("Properties")
      .doc(propID)
      .update({
        customer: updateCustomer || customerName || "",//done
        //customerID:, //here i would add the updatedCustomerID

      })
      .then(result => {
  
      })
      .catch(e => {
        console.log(e);
      }


return (


          <FormGroup className="mb-3">
                      <Label className="control-label">Customer</Label>

                      <select
                        className="form-control select2"
                        onChange={e => {
                          setUpdateCustomer(e.target.value);
                        }}
                      >
                        <option value={customerName}>
                          {customerName}
                        </option>
                        {customer.map((cust, i) => (
                          <option value={cust.name} key={i}>
                            {cust.name}
                      </option>
                    ))}
                </select>
       </FormGroup>
)