+
+ {mmss}{goal ? ` / ${goal}` : ""}
+
+ setRunning((v) => !v)}
+ >
+ {running ? "Stop" : "Iniciar"}
+
+ {completed && (
+
+ Completado ✅
+
+ )}
+
+ );
+}
diff --git a/src/components/AddCategoriaButton.tsx b/src/components/AddCategoriaButton.tsx
new file mode 100644
index 0000000..92852d6
--- /dev/null
+++ b/src/components/AddCategoriaButton.tsx
@@ -0,0 +1,103 @@
+import { useState } from 'react';
+import {
+ IonButton, IonIcon, IonModal, IonHeader, IonToolbar, IonTitle,
+ IonContent, IonItem, IonLabel, IonInput, IonTextarea, IonToggle,
+ IonButtons, IonSpinner, IonToast
+} from '@ionic/react';
+import { addOutline, closeOutline, saveOutline } from 'ionicons/icons';
+import { crearCategoria } from '../services/api';
+
+type Props = { onCreated?: () => void };
+
+export default function AddCategoriaButton({ onCreated }: Props) {
+ const [open, setOpen] = useState(false);
+ const [nombre, setNombre] = useState('');
+ const [descripcion, setDescripcion] = useState('');
+ const [activo, setActivo] = useState(true);
+ const [loading, setLoading] = useState(false);
+ const [toast, setToast] = useState<{open:boolean; msg:string}>({open:false, msg:''});
+
+ async function handleSave() {
+ if (!nombre.trim()) {
+ setToast({ open:true, msg:'El nombre es obligatorio' });
+ return;
+ }
+ try {
+ setLoading(true);
+ await crearCategoria({ nombre: nombre.trim(), descripcion: descripcion || null, activo });
+ setToast({ open:true, msg:'Categoría creada 🎉' });
+ setOpen(false);
+ setNombre(''); setDescripcion(''); setActivo(true);
+ onCreated?.(); // refresca la lista del padre
+ } catch (e:any) {
+ setToast({ open:true, msg: e?.message || 'Error al crear' });
+ } finally {
+ setLoading(false);
+ }
+ }
+
+ return (
+ <>
+ {/* Botón “Añadir” para poner en el header */}
+
+
+ {loading ?
+
+
+
+
+
+
+ );
+ }
+
+ if (error) return {error}
; + if (items.length === 0) returnNo hay actividades disponibles.
; + + return ( + <> +
+ {act.nombre}{" "}
+ {yaRealizada && (
+ Realizada
+ )}
+
+
+ {/* Si no quieres la descripción, comenta esta línea */}
+ {/* {act.descripcion && {act.descripcion}
} */} + +
+ {act.duracion_minutos} min
+ {act.dificultad != null && dif. {act.dificultad} }
+ {act.puntos_base != null && {act.puntos_base} pts }
+
+
+ abrirInstrucciones(act)}>
+ INSTRUCCIONES
+
+
+ {yaRealizada ? (
+ // Deshabilitado para siempre
+
+ COMPLETADA
+
+ ) : running[act.id_actividad] ? (
+ handleStop(act.id_actividad, act)}
+ >
+ DETENER
+
+ ) : (
+ handleStart(act.id_actividad)}
+ >
+ INICIAR
+
+ )}
+
+
+ {sel.duracion_minutos} min
+ {sel.dificultad != null && dif. {sel.dificultad} }
+ {sel.puntos_base != null && {sel.puntos_base} pts }
+
+ + {sel.descripcion || "Sin descripción disponible."} +
+ + )} +
+
+
+
+ Ruta no encontrada
+
+ {/* Lado Izquierdo (Login) */}
+
+
+
+ Correo electrónico
+
+
+ Contraseña
+
+
+ Iniciar Sesión
+
+
+
+ {/* Lado Derecho (Registro) */}
+ ¡Bienvenido!
+Inicia sesión con tu cuenta
++ ¿No tienes cuenta? + setIsLogin(false)}> Regístrate +
+
+
+ Nombre
+
+
+ Correo electrónico
+
+
+ Contraseña
+
+
+ Registrarse
+
+
+ Crea tu Cuenta
++ ¿Ya tienes cuenta? + setIsLogin(true)}> Inicia sesión +
+
+ { /* refrescar si lo necesitas */ }} />
+ )}
+
+
+ + ¡Bienvenida, Raquel! 🌿 +
+ + {/* Mostrar Añadir solo a admins */} + {isAdmin && ( ++ Selecciona una categoría para comenzar tus actividades +
+ +
+
+
+
+
+
+
+
+
+
+
+ ) : categoriaId === null ? (
+
+
+
+
+
+
+
+
+
+
+ {/* --- LISTA DINÁMICA DESDE EL BACKEND (para verificar nuevas) --- */}
+ Otras categorías
+ + {loading ? ( +
+
+ ) : cats.length === 0 ? (
+ {c.nombre}
+ {c.descripcion &&{c.descripcion}
} +Actividades realizadas
+Lista/Historial de actividades completadas por el estudiante.
+
+
+
+ ¡Bienvenida, {usuario}! 🌿
+Selecciona una categoría para comenzar tus actividades
+
+
+
+ {cats.map((c) => (
+
+
+
+
+ ))}
+
+
+
+
+
+
+ {c.titulo}
+
+
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+ {email}
+
+ {nombre}
+
+
+
+ {/* Confirmación logout */}
+
+ {/* Editar nombre */}
+
+
+ Nombre
+ setNombre(e.detail.value || "")}
+ />
+
+
+
+
+ Guardar cambios
+
+
+ {/* Cambiar contraseña */}
+ setShowConfirm(true)}
+ >
+
+
+ {/* Accesos de abajo */}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Contraseña actual
+ setPassActual(e.detail.value || "")}
+ />
+
+
+
+ Nueva contraseña
+ setPassNueva(e.detail.value || "")}
+ />
+
+
+
+ Confirmar nueva contraseña
+ setPassConfirma(e.detail.value || "")}
+ />
+
+
+ {msgPass && (
+
+ {msgPass}
+
+ )}
+
+
+ Actualizar contraseña
+
+
+
+ {/* Botón Cerrar sesión */}
+ Cambiar contraseña
+Mi progreso
+Resumen y estadísticas
+Actividades completas
+Historial de actividades
+Mi progreso
+Aquí puedes renderizar tu gráfica / estadísticas del estudiante.
+
+
+
+
+
+
+
+
+
+
+
+
+ Registrarse
++ ¿Ya tienes cuenta?{" "} + + Inicia sesión + +
+