FRONTEND: Crear vista SETS CHECKIN

[Francmho]

CRITERIOS DE ASIGNACION

• [x] Crear archivo vista3.js (Sets checkin).
• [x] Crear Funcion SetsCheckIn y su Return.
• [x] Renderizar con map los ejercicios. Eje(item.exercises). PRIMER DIV.
• [x] Renderizar con map los SETS. Eje(item.sets). SEGUNDO DIV.
• [x] Renderizar alerta de onClick de boton anterior sets. {== actual set + 1 en alerta}.
• [x] Renderizar cronometro Eje(item.rest_time). TERCER DIV.
• [x] Renderizar boton next. CUARTO DIV {}.

[Ocampo81]

He creado con éxito la vista llamada Workout.js:

Estructura y Diseño Inicial

Para manejar la vista de los ejercicios con detalles como repeticiones y series. Implementación de un componente Timer.js para manejar el cronómetro.

Estilización y Organización

Ajustes de estilos en index.css para mejorar la apariencia y disposición de los elementos en Workout.js. Estilización del cronómetro para un diseño más atractivo y adecuado para una aplicación de gimnasio.

Funcionalidad del Cronómetro

Modificación de Timer.js para aceptar props (startTimer y resetTimer) que controlen el inicio y reinicio del cronómetro desde Workout.js. Implementación de lógica en Timer.js para iniciar el cronómetro automáticamente al hacer clic en los botones de las series y mostrar una alerta después de 25 segundos indicando que el tiempo de descanso ha terminado. Reseteo automático del cronómetro al cerrar la alerta. Integración del Cronómetro con Workout.js

Actualización de Workout.js para manejar el estado del cronómetro y coordinarlo con los botones de las series. Función para alternar la visibilidad de los detalles del ejercicio (toggleDetails). Manejo del estado para iniciar y reiniciar el cronómetro al hacer clic en los botones de las series (toggleSetCompletion).