Reservar clase
Ruta: /student/book · Auth: Magic link (alumno)
Wizard de 3 pasos para que el alumno reserve una sesion usando sus creditos.
Que hay
Section titled “Que hay”Paso 1 — Seleccionar enrollment
Section titled “Paso 1 — Seleccionar enrollment”Grid de enrollments activos mostrando creditos restantes por cada uno. Solo se muestran enrollments con creditos disponibles.
Paso 2 — Seleccionar servicio
Section titled “Paso 2 — Seleccionar servicio”Grid de servicios elegibles filtrados por eligibleServiceIds del enrollment.
Si el enrollment tiene servicios cross-service, se muestran todos los compatibles.
Paso 3 — Elegir horario
Section titled “Paso 3 — Elegir horario”Calendario semanal con slots agrupados por periodo del dia:
| Periodo | Horario | Icono |
|---|---|---|
| Manana | Antes de 12:00 | Sol |
| Tarde | 12:00 – 18:00 | Sol parcial |
| Noche | Desde 18:00 | Luna |
Navegacion semanal: Flechas izquierda/derecha con rango de fechas visible. Maximo 4 semanas de anticipacion (weekOffset 0-3).
Horas preferidas:
- Toggle para mostrar/editar preferencias horarias del alumno
- Selectores de hora inicio/fin (intervalos de 30 min)
- Selector de dias de la semana (7 toggles Lun-Dom)
- Los slots que coinciden con las preferencias muestran una estrella ambar
Confirmacion: Barra inferior con nombre del servicio + hora seleccionada antes de reservar.
Estado de exito: Checkmark + “Reserva exitosa” + boton “Reservar otra”.
Que falta
Section titled “Que falta”| Feature | Descripcion | Estado | Implementado |
|---|---|---|---|
| Heatmap de disponibilidad | Indicador visual de densidad de slots disponibles por dia en las cabeceras del calendario. Permite ver de un vistazo que dias tienen mas opciones | ✅ | Batch 4 |
| Selector de timezone manual | Dropdown de timezone junto al display de GMT offset. El alumno puede ajustar manualmente si viaja | ✅ | Batch 4 |
| Multi-select de slots | Solo se puede reservar una sesion a la vez. Para paquetes grandes, deberia poder reservar varias sesiones en una misma operacion | Implementado ✅ |
Que falla
Section titled “Que falla”| Bug | Descripcion | Estado | Corregido |
|---|---|---|---|
| Sin validacion endTime mayor que startTime | Las preferencias horarias no validaban que la hora de fin sea posterior a la de inicio. Corregido con validacion client-side y backend | ✅ | Batch 4 |
| Horas preferidas sin leyenda inicial | Componente StarLegend muestra icono estrella ambar + texto explicativo, con tooltip auto-show en primera visita (6s, localStorage) | ✅ | Batch 5 |
Que cambiaria
Section titled “Que cambiaria”| Mejora | Descripcion | Dificultad | Estado | Implementado |
|---|---|---|---|---|
| Selector de timezone | Dropdown de timezone junto al display de GMT offset | Facil | ✅ | Batch 4 |
| Heatmap visual | Indicador de intensidad en las cabeceras de dia mostrando cantidad de slots disponibles | Medio | ✅ | Batch 4 |
| Reserva multiple | Permitir seleccionar multiples slots y reservar en batch, descontando creditos de una vez | Dificil |
Referencia tecnica
Section titled “Referencia tecnica”Archivos clave
Section titled “Archivos clave”| Archivo | Proposito |
|---|---|
apps/web/src/routes/student/book.lazy.tsx | Wizard de reserva |
| Endpoint | Metodo | Proposito |
|---|---|---|
/student/teacher | GET | Info del profesor + servicios |
/student/enrollments | GET | Enrollments activos del alumno |
/student/preferred-hours | GET/PATCH | Preferencias horarias |
/public/:slug/service-availability | GET | Slots disponibles (con flag isPreferred) |
/student/sessions | POST | Reservar sesion |