Frontend: experiencia de usuario y rutas

Idea principal

El frontend separa con claridad tres experiencias:

publico
negocio
Panel de control

Eso se refleja en:

rutas distintas
guards distintos
requisitos de acceso distintos

Rutas publicas

Ruta	Pantalla	Para que sirve
`/`	Landing	Entrada comercial del producto
`/auth`	AuthPage	Login y registro
`/book/:slug`	PublicBookingPage	Reserva publica del negocio usando su identificador publico
`/booking/:bookingId`	PublicManageBookingPage	Gestion publica del booking ya creado
`/booking/rate/:bookingId`	PublicRateBookingPage	Reseña posterior al servicio

Ruta privada compartida

/admin/select-business-membership funciona como punto de transicion:

permite elegir la membresia activa de negocio
permite entrar a Panel de control si la sesion tiene membresia global valida

Rutas privadas del `Panel de control`

Estas rutas requieren sesion y membresia global valida.

Ejemplos:

/control-panel/home
/control-panel/profile
/control-panel/businesses
/control-panel/plans
/control-panel/users
/control-panel/roles
/control-panel/permissions
/control-panel/modules

Rutas privadas con contexto activo de negocio

La mayor parte del panel operativo vive aqui. Algunos ejemplos:

/admin/home
/admin/profile
/admin/users
/admin/appointments
/admin/booking
/admin/reviews
/admin/metrics
/admin/services
/admin/branches
/admin/roles
/admin/permissions
/admin/modules

Contextos de acceso

Contexto de negocio

Despues de iniciar sesion, el frontend puede necesitar saber con que negocio esta operando la persona.

Para eso usa:

store de usuario
sessionAccessStore con las membresias de negocio de la sesion
store de membresia activa
cookie businessMembershipId
cache de permisos por rol

Sin ese contexto, muchas rutas privadas de negocio no pueden operar.

La pantalla de seleccion de negocio refresca la sesion con GET /auth/me cada vez que entra o cambia la navegacion relevante. Mientras eso ocurre muestra un aviso de actualizacion para evitar indicar falsamente que no existen negocios.

Contexto global

Para Panel de control, el frontend hidrata una membresia global sin businessId.

Ese contexto:

no usa cookie businessMembershipId
no inyecta businessId
habilita modulos globales segun permisos del rol global
vive en globalAccessStore, separado de las membresias de negocio

Guards principales

Guard	Responsabilidad
`PublicRoute`	Evita entrar a auth si ya existe sesion
`PrivateRoute`	Exige sesion y resuelve membresia/contexto de negocio
`PermissionRoute`	Exige permisos especificos del negocio
`AppointmentsAccessRoute`	Regula acceso completo o propio a agenda
`ControlPanelRoute`	Exige membresia global activa
`GlobalPermissionRoute`	Protege modulos del `Panel de control`

Como se siente eso para el usuario

Persona cliente

no necesita entrar al panel privado
usa links publicos por slug o bookingId
reserva, consulta o califica

En el registro tambien puede indicar de forma opcional un identificador de negocio. De cara al producto ese identificador corresponde al slug publico del negocio.

Persona del negocio

entra por login
selecciona negocio si tiene varias membresias
ve solo lo que su rol permite

Persona con acceso global

puede abrir Panel de control
no necesita estar dentro de un negocio para administrar la plataforma
sigue necesitando membresia de negocio si quiere operar dentro de un negocio puntual

Caso especial: agenda de appointments

La agenda tiene una regla especial:

quien posee permisos amplios puede ver todo
quien solo tiene permisos propios y ademas es empleado puede ver su agenda

Esto evita abrir el calendario completo a cualquier perfil.

Redirects y rutas especiales

El router redirige /control-panel hacia /control-panel/home.

Las rutas de negocio activas usan /admin/booking y /admin/appointments. Los links publicos pueden normalizar referencias antiguas de booking cuando la URL embebida trae un identificador, pero esas rutas no sustituyen el catalogo principal de rutas privadas.

Que pasa si algo falla en acceso

El frontend traduce errores como:

token vencido
sesion invalida
membresia inactiva
negocio con suscripcion no valida
acceso global insuficiente
membresia guardada en cookie que ya no existe para la sesion

En esos casos puede:

cerrar sesion
limpiar contexto activo
redirigir a seleccion de negocio
redirigir al home del Panel de control

Comportamientos publicos relevantes

Reserva publica

la reserva publica usa el slug como identificador del negocio
si el negocio esta inactivo o su suscripcion no esta operativa, la pantalla muestra indisponibilidad desde el inicio
el mensaje visible para cliente evita exponer detalles internos del plan

Gestion publica del booking

el cliente puede editar citas existentes
el cliente puede cambiar servicio o colaborador de una cita existente si la validacion operativa lo permite
el cliente puede cancelar citas o cancelar el booking completo
el cliente no puede agregar nuevas citas desde este flujo
este flujo opera con un endpoint publico dedicado y no reutiliza toda la mutacion privada del booking

Idea principal​

Rutas publicas​

Ruta privada compartida​

Rutas privadas del Panel de control​

Rutas privadas con contexto activo de negocio​

Flujo de login​

Contextos de acceso​

Contexto de negocio​

Contexto global​

Guards principales​

Como se siente eso para el usuario​

Persona cliente​

Persona del negocio​

Persona con acceso global​

Caso especial: agenda de appointments​

Redirects y rutas especiales​

Que pasa si algo falla en acceso​

Comportamientos publicos relevantes​

Reserva publica​

Gestion publica del booking​

Documentos relacionados​