Estoy trabajando en la validación de un control Autocompletar usando React JS y MaterialUI, por defecto se carga la opción "por favor seleccione..." como en esta imagen:

Si el usuario pulsa Enviar Orden y el valor seleccionado es el primero se envía un mensaje de error al usuario; pero si el usuario eligió una opción diferente, el estado de Autocompletar sigue siendo erróneo, mire esta imagen:

El siguiente código muestra cómo administro el código de Autocompletar:

 <div className={clientMethodPaymentControlClasses}> <label htmlFor="clientMethodPayment">Method of Payment *</label> <Autocomplete id="clientMethodPayment" options={paymentMethods} defaultValue={paymentMethods[0]} getOptionLabel={(option) => option.title} ref={clientMethodPaymentRef} onChange={(e,v) => setPaymentMethodValue(v)} style={{ width: 300 }} autoHighlight renderInput={(params) => ( <TextField {...params} onChange={({ target }) => setPaymentMethodValue(target.value)} variant="outlined" fullWidth autoComplete="off" /> )} /> {!formInputsValidity.clientMethodPayment && ( <p>Please choose a method of payment</p> )} </div>

Uso el siguiente código para la lista de valores y cómo administro el estado del control:

 const paymentDefaultValue = (value) => value !== "Please choose an option"; const paymentMethods = [ { title: "Please choose an option", id: 0 }, { title: "Cash", id: 1 }, { title: "Credit Card", id: 2 }, { title: "Crypto Currency", id: 3 }, ]; const OrderDetails = (props) => { const [paymentMethodValue, setPaymentMethodValue] = useState(paymentMethods[0]);

Además, el siguiente código es la clave para clasificar si un control tiene errores de entrada:

 const enteredClientMethodPaymentIsValid = !paymentDefaultValue( enteredClientMethodPayment );

El caso es que no puedo captar si el usuario eligió una opción diferente a la predeterminada y por esa razón el control siempre está marcado como error, entonces mi pregunta es: ¿qué me falta para validar mi control de Autocompletar? En caso de que pueda ser útil, este es el código completo: https://github.com/hftamayo/reactletsorder/blob/unstable/src/components/FoodOrder/Cart/OrderDetails.js

Muchas gracias