Entiendo que necesitas modificar el formulario para que el check-in y check-out sean rangos de horarios en lugar de horas específicas. Voy a crear una versión actualizada que permita seleccionar un rango de horas tanto para el check-in como para el check-out.

He modificado el formulario para que ahora tanto el check-in como el check-out tengan un rango de horarios con opciones "desde" (from) y "hasta" (to):

• Para el check-in, he establecido un rango predeterminado de 14:00 a 18:00
• Para el check-out, he establecido un rango predeterminado de 10:00 a 12:00

Cada selector de hora incluye opciones para todas las horas del día (de 00:00 a 23:00). El formulario guarda estos valores como rangos y los incluiría en los datos enviados cuando se guarde el formulario.

¿Necesitas algún ajuste adicional en este formulario o quieres que modifique algo más?

Tienes toda la razón. Voy a mejorar el formulario para que las opciones sean coherentes y no permita seleccionar un horario "hasta" que sea anterior al horario "desde".

He mejorado el formulario para que sea coherente con las selecciones de horarios:

1. Ahora, cuando seleccionas un horario "desde", el selector "hasta" solo mostrará opciones a partir de ese horario.

   • Por ejemplo, si seleccionas "desde las 13:00", el selector "hasta" solo mostrará opciones desde las 13:00 en adelante.

2. He añadido validación mediante useEffect para que:

   • Si cambias el horario "desde" a un valor posterior al horario "hasta" actual, automáticamente se actualizará el "hasta" para que coincida con el "desde".
   • Esto garantiza que nunca tendrás un rango inválido donde el tiempo final sea anterior al tiempo inicial.
3. He creado una función getAvailableToOptions() que filtra las opciones disponibles para los selectores "hasta" basándose en la selección del "desde".

Con estos cambios, el formulario ahora garantiza que los rangos de horarios siempre sean coherentes y válidos.