[V0_FILE]typescriptreact:file="app/page.tsx" isMerged="true" "use client" import { StudentDashboard } from "@/components/student-dashboard" export default function Home() { return (

) } [V0_FILE]typescript:file="lib/predictor.ts" isMerged="true" // Rango de asistencia: BAJA (0-50), REGULAR (50-70), FRECUENTE (70-100) function getAsistenciaLevel(value: number): string { if (value < 50) return "baja" if (value < 70) return "regular" return "frecuente" } // Horas de sueño: INSUFICIENTES (0-6), ADECUADAS (6-8), EXCESIVO (8-10) function getSuenoLevel(value: number): string { if (value < 6) return "insuficientes" if (value <= 8) return "adecuadas" return "excesivo" } // Horas de estudio: POCAS (0-2), MODERADAS (2-6), MUCHAS (6-9) function getEstudioLevel(value: number): string { if (value < 2) return "pocas" if (value < 6) return "moderadas" return "muchas" } // Salud mental: MALA (0-2), MEDIA (2-6), BUENA (6-10) function getSaludMentalLevel(value: number): string { if (value < 2) return "mala" if (value < 6) return "media" return "buena" } export function predictPerformance(inputs: { asistencia: number horasSueno: number horasEstudio: number saludMental: number }) { let score = 0 let riesgoDesercion = "bajo" // Score por asistencia (0-25 puntos) const asistenciaLevel = getAsistenciaLevel(inputs.asistencia) if (asistenciaLevel === "frecuente") score += 25 else if (asistenciaLevel === "regular") score += 15 else score += 5 // Score por sueño (0-25 puntos) const suenoLevel = getSuenoLevel(inputs.horasSueno) if (suenoLevel === "adecuadas") score += 25 else if (suenoLevel === "insuficientes") score += 8 else score += 15 // excesivo // Score por estudio (0-25 puntos) const estudioLevel = getEstudioLevel(inputs.horasEstudio) if (estudioLevel === "muchas") score += 25 else if (estudioLevel === "moderadas") score += 18 else score += 8 // Score por salud mental (0-25 puntos) const saludLevel = getSaludMentalLevel(inputs.saludMental) if (saludLevel === "buena") score += 25 else if (saludLevel === "media") score += 15 else score += 5 // Determinar calificación según score let calificacion = "bajo" if (score >= 70) { calificacion = "alto" riesgoDesercion = "bajo" } else if (score >= 50) { calificacion = "regular" riesgoDesercion = "medio" } else { calificacion = "bajo" riesgoDesercion = "alto" } // Lógica adicional para riesgo de deserción if (asistenciaLevel === "baja" || suenoLevel === "insuficientes" || saludLevel === "mala") { if (riesgoDesercion === "bajo") riesgoDesercion = "medio" else if (riesgoDesercion === "medio") riesgoDesercion = "alto" } return { calificacion, riesgo: riesgoDesercion, score, detalles: { asistencia: asistenciaLevel, sueno: suenoLevel, estudio: estudioLevel, saludMental: saludLevel, }, } } [V0_FILE]json:file="package.json" isMerged="true" { "name": "my-v0-project", "version": "0.1.0", "private": true, "scripts": { "dev": "next dev", "build": "next build", "start": "next start", "lint": "eslint ." }, "dependencies": { "@hookform/resolvers": "^3.10.0", "@radix-ui/react-accordion": "1.2.2", "@radix-ui/react-alert-dialog": "1.1.4", "@radix-ui/react-aspect-ratio": "1.1.1", "@radix-ui/react-avatar": "1.1.2", "@radix-ui/react-checkbox": "1.1.3", "@radix-ui/react-collapsible": "1.1.2", "@radix-ui/react-context-menu": "2.2.4", "@radix-ui/react-dialog": "1.1.4", "@radix-ui/react-dropdown-menu": "2.1.4", "@radix-ui/react-hover-card": "1.1.4", "@radix-ui/react-label": "2.1.1", "@radix-ui/react-menubar": "1.1.4", "@radix-ui/react-navigation-menu": "1.2.3", "@radix-ui/react-popover": "1.1.4", "@radix-ui/react-progress": "1.1.1", "@radix-ui/react-radio-group": "1.2.2", "@radix-ui/react-scroll-area": "1.2.2", "@radix-ui/react-select": "2.1.4", "@radix-ui/react-separator": "1.1.1", "@radix-ui/react-slider": "1.2.2", "@radix-ui/react-slot": "1.1.1", "@radix-ui/react-switch": "1.1.2", "@radix-ui/react-tabs": "1.1.2", "@radix-ui/react-toast": "1.2.4", "@radix-ui/react-toggle": "1.1.1", "@radix-ui/react-toggle-group": "1.1.1", "@radix-ui/react-tooltip": "1.1.6", "@vercel/analytics": "1.3.1", "autoprefixer": "^10.4.20", "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", "cmdk": "1.0.4", "date-fns": "4.1.0", "embla-carousel-react": "8.5.1", "input-otp": "1.4.1", "lucide-react": "^0.454.0", "next": "16.0.0", "next-themes": "^0.4.6", "react": "19.2.0", "react-day-picker": "9.8.0", "react-dom": "19.2.0", "react-hook-form": "^7.60.0", "react-resizable-panels": "^2.1.7", "recharts": "2.15.4", "sonner": "^1.7.4", "tailwind-merge": "^3.3.1", "tailwindcss-animate": "^1.0.7", "vaul": "^0.9.9", "zod": "3.25.76" }, "devDependencies": { "@tailwindcss/postcss": "^4.1.9", "@types/node": "^22", "@types/react": "^19", "@types/react-dom": "^19", "postcss": "^8.5", "tailwindcss": "^4.1.9", "tw-animate-css": "1.3.3", "typescript": "^5" } } [V0_FILE]typescript:file="lib/student-names.ts" isMerged="true" export const studentNames = [ // Grupo 1 (30 estudiantes) { name: "Carlos Eduardo Mendoza", group: 1 }, { name: "María Alejandra Rodríguez", group: 1 }, { name: "Juan Pablo Sánchez", group: 1 }, { name: "Sofía Gabriela Torres", group: 1 }, { name: "Diego Andrés Flores", group: 1 }, { name: "Laura Marcela Gómez", group: 1 }, { name: "Miguel Antonio Reyes", group: 1 }, { name: "Valentina Rosa Díaz", group: 1 }, { name: "Ricardo Felipe Castillo", group: 1 }, { name: "Camila Josefina Martínez", group: 1 }, { name: "Fernando Luis Vargas", group: 1 }, { name: "Isabella Sofía Moreno", group: 1 }, { name: "Andrés Guillermo Navarro", group: 1 }, { name: "Paula Andrea Romero", group: 1 }, { name: "Javier Raúl Cortés", group: 1 }, { name: "Martina Isabel Salazar", group: 1 }, { name: "Sergio Gabriel Hidalgo", group: 1 }, { name: "Daniela Cristina Pineda", group: 1 }, { name: "Cristóbal Maximiliano Cruz", group: 1 }, { name: "Alejandra Valentina Suárez", group: 1 }, { name: "Roberto Francisco Jiménez", group: 1 }, { name: "Gabriela Monserrat Vega", group: 1 }, { name: "Mateo Sebastián Acosta", group: 1 }, { name: "Anita Lorena Escobar", group: 1 }, { name: "Víctor Enrique Medina", group: 1 }, { name: "Catalina Beatriz Zambrano", group: 1 }, { name: "Raúl Óscar Montenegro", group: 1 }, { name: "Emilia Francisca Quintana", group: 1 }, { name: "Ignacio Leopoldo Aguirre", group: 1 }, { name: "Violeta María Concha", group: 1 }, // Grupo 2 (27 estudiantes) { name: "Óscar Alfredo Donoso", group: 2 }, { name: "Constanza Isabel Flores", group: 2 }, { name: "Pablo Arturo Santana", group: 2 }, { name: "Rosario Eugenia Bravo", group: 2 }, { name: "Humberto Manuel Correa", group: 2 }, { name: "Begoña Micaela Sandoval", group: 2 }, { name: "Tomás Leopoldo Velázquez", group: 2 }, { name: "Francisca Soledad Vera", group: 2 }, { name: "Alejandro Ramón Camacho", group: 2 }, { name: "Cecilia Josefina Peña", group: 2 }, { name: "Guillermo Alberto Herrera", group: 2 }, { name: "Mercedes Antonia Soto", group: 2 }, { name: "Fabio Enrique López", group: 2 }, { name: "Graciela Margarita Fuentes", group: 2 }, { name: "Claudio Esteban Molina", group: 2 }, { name: "Adriana Marcela Prieto", group: 2 }, { name: "Eugenio Rodrigo Carrasco", group: 2 }, { name: "Silvia Amparo Arévalo", group: 2 }, { name: "Gerardo Joaquín Ibáñez", group: 2 }, { name: "Roxana Liliana Gutiérrez", group: 2 }, { name: "Leoncio Simón Osoria", group: 2 }, { name: "Natalia Claudia Maturana", group: 2 }, { name: "Pío Ismael Burgos", group: 2 }, { name: "Elena Verónica Barrios", group: 2 }, { name: "Florencio Aurelio Carvajal", group: 2 }, { name: "Irene Esperanza Quirós", group: 2 }, { name: "Vicente Erasmo Arriagada", group: 2 }, // Grupo 3 (23 estudiantes) { name: "Abelardo Mariano Pereira", group: 3 }, { name: "Dominga Rufina Espinoza", group: 3 }, { name: "Aníbal Fernando Araya", group: 3 }, { name: "Elsa Gregoria Valenzuela", group: 3 }, { name: "Basilio Adolfo Quezada", group: 3 }, { name: "Herminia Petronila Valdivia", group: 3 }, { name: "Casimiro Liborio Sepúlveda", group: 3 }, { name: "Isolde Herminia Henríquez", group: 3 }, { name: "Darío Eleuterio Labrador", group: 3 }, { name: "Filomena Escolástica Munoz", group: 3 }, { name: "Exequiel Timoteo Carrillo", group: 3 }, { name: "Gesualda Milagros Osorio", group: 3 }, { name: "Fortunato Cornelio Beltrán", group: 3 }, { name: "Hercilia Venancia Navarrete", group: 3 }, { name: "Hilario Emigdio Sánchez", group: 3 }, { name: "Idalia Severina Landeta", group: 3 }, { name: "Isidro Eutimio Contreras", group: 3 }, { name: "Josefina Teodora Peña", group: 3 }, { name: "Leodegario Cándido Montoya", group: 3 }, { name: "Magdalena Adelaida Chacón", group: 3 }, { name: "Nemesio Ubaldo Ramírez", group: 3 }, { name: "Orinda Enriqueta Luque", group: 3 }, { name: "Pascasio Victorino Rivera", group: 3 }, ] [V0_FILE]typescriptreact:file="app/globals.css" isEdit="true" isMerged="true" @import "tailwindcss"; @import "tw-animate-css"; @custom-variant dark (&:is(.dark *)); :root { /* Modern color scheme with vibrant blues, purples and greens */ --background: oklch(0.98 0.01 250); --foreground: oklch(0.15 0.02 250); --card: oklch(1 0 0); --card-foreground: oklch(0.15 0.02 250); --popover: oklch(1 0 0); --popover-foreground: oklch(0.15 0.02 250); --primary: oklch(0.52 0.27 260); --primary-foreground: oklch(1 0 0); --secondary: oklch(0.65 0.2 180); --secondary-foreground: oklch(1 0 0); --muted: oklch(0.93 0.01 250); --muted-foreground: oklch(0.5 0.05 250); --accent: oklch(0.6 0.25 145); --accent-foreground: oklch(1 0 0); --destructive: oklch(0.63 0.24 25); --destructive-foreground: oklch(1 0 0); --border: oklch(0.9 0.01 250); --input: oklch(0.95 0.01 250); --ring: oklch(0.52 0.27 260); --chart-1: oklch(0.52 0.27 260); --chart-2: oklch(0.6 0.25 145); --chart-3: oklch(0.63 0.24 25); --chart-4: oklch(0.65 0.2 180); --chart-5: oklch(0.7 0.2 50); --radius: 0.75rem; --sidebar: oklch(0.98 0.01 250); --sidebar-foreground: oklch(0.15 0.02 250); --sidebar-primary: oklch(0.52 0.27 260); --sidebar-primary-foreground: oklch(1 0 0); --sidebar-accent: oklch(0.6 0.25 145); --sidebar-accent-foreground: oklch(1 0 0); --sidebar-border: oklch(0.9 0.01 250); --sidebar-ring: oklch(0.52 0.27 260); } .dark { --background: oklch(0.12 0.01 250); --foreground: oklch(0.95 0.02 250); --card: oklch(0.18 0.01 250); --card-foreground: oklch(0.95 0.02 250); --popover: oklch(0.18 0.01 250); --popover-foreground: oklch(0.95 0.02 250); --primary: oklch(0.65 0.22 260); --primary-foreground: oklch(0.12 0.01 250); --secondary: oklch(0.5 0.18 180); --secondary-foreground: oklch(0.95 0.02 250); --muted: oklch(0.3 0.01 250); --muted-foreground: oklch(0.7 0.05 250); --accent: oklch(0.7 0.2 145); --accent-foreground: oklch(0.12 0.01 250); --destructive: oklch(0.5 0.2 25); --destructive-foreground: oklch(0.95 0.02 250); --border: oklch(0.3 0.01 250); --input: oklch(0.25 0.01 250); --ring: oklch(0.65 0.22 260); --chart-1: oklch(0.65 0.22 260); --chart-2: oklch(0.7 0.2 145); --chart-3: oklch(0.65 0.2 25); --chart-4: oklch(0.5 0.18 180); --chart-5: oklch(0.65 0.18 50); --sidebar: oklch(0.15 0.01 250); --sidebar-foreground: oklch(0.95 0.02 250); --sidebar-primary: oklch(0.65 0.22 260); --sidebar-primary-foreground: oklch(0.12 0.01 250); --sidebar-accent: oklch(0.7 0.2 145); --sidebar-accent-foreground: oklch(0.12 0.01 250); --sidebar-border: oklch(0.3 0.01 250); --sidebar-ring: oklch(0.65 0.22 260); } @theme inline { --font-sans: "Geist", "Geist Fallback"; --font-mono: "Geist Mono", "Geist Mono Fallback"; --color-background: var(--background); --color-foreground: var(--foreground); --color-card: var(--card); --color-card-foreground: var(--card-foreground); --color-popover: var(--popover); --color-popover-foreground: var(--popover-foreground); --color-primary: var(--primary); --color-primary-foreground: var(--primary-foreground); --color-secondary: var(--secondary); --color-secondary-foreground: var(--secondary-foreground); --color-muted: var(--muted); --color-muted-foreground: var(--muted-foreground); --color-accent: var(--accent); --color-accent-foreground: var(--accent-foreground); --color-destructive: var(--destructive); --color-destructive-foreground: var(--destructive-foreground); --color-border: var(--border); --color-input: var(--input); --color-ring: var(--ring); --color-chart-1: var(--chart-1); --color-chart-2: var(--chart-2); --color-chart-3: var(--chart-3); --color-chart-4: var(--chart-4); --color-chart-5: var(--chart-5); --radius-sm: calc(var(--radius) - 4px); --radius-md: calc(var(--radius) - 2px); --radius-lg: var(--radius); --radius-xl: calc(var(--radius) + 4px); --color-sidebar: var(--sidebar); --color-sidebar-foreground: var(--sidebar-foreground); --color-sidebar-primary: var(--sidebar-primary); --color-sidebar-primary-foreground: var(--sidebar-primary-foreground); --color-sidebar-accent: var(--sidebar-accent); --color-sidebar-accent-foreground: var(--sidebar-accent-foreground); --color-sidebar-border: var(--sidebar-border); --color-sidebar-ring: var(--sidebar-ring); } @layer base { * { @apply border-border outline-ring/50; } body { @apply bg-background text-foreground; } } /* Modern animations */ @keyframes fade-in-up { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } } .animate-fade-in-up { animation: fade-in-up 0.5s ease-out; } [V0_FILE]typescriptreact:file="components/feedback-modal.tsx" isEdit="true" isQuickEdit="true" isMerged="true" "use client" import { Dialog, DialogContent, DialogHeader, DialogTitle } from "@/components/ui/dialog" import { Button } from "@/components/ui/button" import { Card, CardContent } from "@/components/ui/card" import { AlertCircle, CheckCircle, X } from "lucide-react" interface FeedbackModalProps { student: { id: string name: string } results: { calificacion: string riesgo: string score: number } onClose: () => void } const feedbackMessages = { alto: { title: "Felicitaciones", icon: CheckCircle, color: "green", message: "Excelente rendimiento académico", advice: [ "Mantén tus hábitos de estudio actuales", "Sigue dedicando el tiempo necesario al aprendizaje", "Preserva tu salud mental y descanso", "Considera ser tutor para otros compañeros", ], }, regular: { title: "Rendimiento Regular", icon: AlertCircle, color: "amber", message: "Tienes potencial para mejorar", advice: [ "Aumenta tus horas de estudio diarias", "Mejora tu asistencia a clases", "Busca apoyo en temas difíciles", "Cuida tu salud mental y descanso", ], }, bajo: { title: "Bajo Rendimiento", icon: AlertCircle, color: "red", message: "Necesitas hacer cambios importantes", advice: [ "Incrementa significativamente tus horas de estudio", "Asiste a todas las clases posibles", "Busca ayuda académica con tus profesores", "Considera apoyo psicológico si es necesario", "Crea un plan de mejora con objetivos claros", ], }, } export function FeedbackModal({ student, results, onClose }: FeedbackModalProps) { const feedback = feedbackMessages[results.calificacion as keyof typeof feedbackMessages] const Icon = feedback.icon const colorClasses = { green: "bg-green-50 border-green-200 text-green-900", amber: "bg-amber-50 border-amber-200 text-amber-900", red: "bg-red-50 border-red-200 text-red-900", } const iconColors = { green: "text-green-600", amber: "text-amber-600", red: "text-red-600", } return ( ) } [V0_FILE]typescriptreact:file="components/results-dashboard.tsx" isEdit="true" isMerged="true" "use client" import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card" import { BarChart, Bar, PieChart, Pie, Cell, XAxis, YAxis, CartesianGrid, Tooltip, Legend, ResponsiveContainer, } from "recharts" import { ChevronDown } from "lucide-react" import { useState } from "react" interface Student { id: string name: string email: string group: number evaluation?: { asistencia: number horasSueno: number horasEstudio: number saludMental: number } results?: { calificacion: string riesgo: string score?: number detalles?: { asistencia: string sueno: string estudio: string saludMental: string } } } interface ResultsDashboardProps { students: Student[] } export function ResultsDashboard({ students }: ResultsDashboardProps) { const evaluatedStudents = students.filter((s) => s.results) const totalEvaluated = evaluatedStudents.length const performanceCount = { alto: evaluatedStudents.filter((s) => s.results?.calificacion === "alto").length, regular: evaluatedStudents.filter((s) => s.results?.calificacion === "regular").length, bajo: evaluatedStudents.filter((s) => s.results?.calificacion === "bajo").length, } const riskCount = { bajo: evaluatedStudents.filter((s) => s.results?.riesgo === "bajo").length, medio: evaluatedStudents.filter((s) => s.results?.riesgo === "medio").length, alto: evaluatedStudents.filter((s) => s.results?.riesgo === "alto").length, } const groupStats = [1, 2, 3].map((groupNum) => { const groupStudents = students.filter((s) => s.group === groupNum) const groupEvaluated = groupStudents.filter((s) => s.results) return { grupo: `Grupo ${groupNum}`, total: groupStudents.length, evaluados: groupEvaluated.length, alto: groupEvaluated.filter((s) => s.results?.calificacion === "alto").length, regular: groupEvaluated.filter((s) => s.results?.calificacion === "regular").length, bajo: groupEvaluated.filter((s) => s.results?.calificacion === "bajo").length, } }) const performanceData = [ { name: "Alto Rendimiento", value: performanceCount.alto, fill: "#22c55e" }, { name: "Rendimiento Regular", value: performanceCount.regular, fill: "#f59e0b" }, { name: "Bajo Rendimiento", value: performanceCount.bajo, fill: "#ef4444" }, ] const riskData = [ { name: "Riesgo Bajo", value: riskCount.bajo, fill: "#22c55e" }, { name: "Riesgo Medio", value: riskCount.medio, fill: "#f59e0b" }, { name: "Riesgo Alto", value: riskCount.alto, fill: "#ef4444" }, ] const [expandPerformance, setExpandPerformance] = useState(false) const [expandRisk, setExpandRisk] = useState(false) const studentsByPerformance = { alto: evaluatedStudents .filter((s) => s.results?.calificacion === "alto") .sort((a, b) => a.name.localeCompare(b.name)), regular: evaluatedStudents .filter((s) => s.results?.calificacion === "regular") .sort((a, b) => a.name.localeCompare(b.name)), bajo: evaluatedStudents .filter((s) => s.results?.calificacion === "bajo") .sort((a, b) => a.name.localeCompare(b.name)), } const studentsByRisk = { bajo: evaluatedStudents.filter((s) => s.results?.riesgo === "bajo").sort((a, b) => a.name.localeCompare(b.name)), medio: evaluatedStudents.filter((s) => s.results?.riesgo === "medio").sort((a, b) => a.name.localeCompare(b.name)), alto: evaluatedStudents.filter((s) => s.results?.riesgo === "alto").sort((a, b) => a.name.localeCompare(b.name)), } return (

{/* Key Metrics */}

Estudiantes Evaluados

{totalEvaluated}

de {students.length}

Alto Rendimiento

{performanceCount.alto}

{totalEvaluated > 0 ? Math.round((performanceCount.alto / totalEvaluated) * 100) : 0}%

Rendimiento Regular

{performanceCount.regular}

{totalEvaluated > 0 ? Math.round((performanceCount.regular / totalEvaluated) * 100) : 0}%

Bajo Rendimiento

{performanceCount.bajo}

{totalEvaluated > 0 ? Math.round((performanceCount.bajo / totalEvaluated) * 100) : 0}%

{/* Charts */}

Distribución de Rendimiento Cantidad de estudiantes por nivel de desempeño `${name}: ${value}`} outerRadius={80} fill="#8884d8" dataKey="value" > {performanceData.map((entry, index) => ( ))} Distribución de Riesgo de Deserción Evaluación del riesgo académico `${name}: ${value}`} outerRadius={80} fill="#8884d8" dataKey="value" > {riskData.map((entry, index) => ( ))}

{/* Group Performance Comparison */} Comparación por Grupo Rendimiento de cada grupo de estudiantes {/* Overall Statistics Table */} Estadísticas Detalladas Resumen por grupo de estudiantes

{groupStats.map((stat, idx) => ( ))}

Grupo	Total	Evaluados	Alto	Regular	Bajo
{stat.grupo}	{stat.total}	{stat.evaluados}	{stat.alto}	{stat.regular}	{stat.bajo}

setExpandPerformance(!expandPerformance)} >

Listado de Estudiantes por Rendimiento Detalle completo de evaluación por cada estudiante

{expandPerformance && ( {/* Alto Rendimiento */}

Alto Rendimiento ({studentsByPerformance.alto.length})

{studentsByPerformance.alto.length > 0 ? ( studentsByPerformance.alto.map((student) => ( )) ) : ( )}

Estudiante	Grupo	Asistencia %	Sueño hrs	Estudio hrs	Salud Mental	Score
{student.name}	G{student.group}	{student.evaluation?.asistencia.toFixed(1) \|\| "-"}%	{student.evaluation?.horasSueno.toFixed(1) \|\| "-"}	{student.evaluation?.horasEstudio.toFixed(1) \|\| "-"}	{student.evaluation?.saludMental.toFixed(1) \|\| "-"}/10	{student.results?.score \|\| "N/A"}
No hay estudiantes en este nivel

{/* Rendimiento Regular */}

Rendimiento Regular ({studentsByPerformance.regular.length})

{studentsByPerformance.regular.length > 0 ? ( studentsByPerformance.regular.map((student) => ( )) ) : ( )}

Estudiante	Grupo	Asistencia %	Sueño hrs	Estudio hrs	Salud Mental	Score
{student.name}	G{student.group}	{student.evaluation?.asistencia.toFixed(1) \|\| "-"}%	{student.evaluation?.horasSueno.toFixed(1) \|\| "-"}	{student.evaluation?.horasEstudio.toFixed(1) \|\| "-"}	{student.evaluation?.saludMental.toFixed(1) \|\| "-"}/10	{student.results?.score \|\| "N/A"}
No hay estudiantes en este nivel

{/* Bajo Rendimiento */}

Bajo Rendimiento ({studentsByPerformance.bajo.length})

{studentsByPerformance.bajo.length > 0 ? ( studentsByPerformance.bajo.map((student) => ( )) ) : ( )}

Estudiante	Grupo	Asistencia %	Sueño hrs	Estudio hrs	Salud Mental	Score
{student.name}	G{student.group}	{student.evaluation?.asistencia.toFixed(1) \|\| "-"}%	{student.evaluation?.horasSueno.toFixed(1) \|\| "-"}	{student.evaluation?.horasEstudio.toFixed(1) \|\| "-"}	{student.evaluation?.saludMental.toFixed(1) \|\| "-"}/10	{student.results?.score \|\| "N/A"}
No hay estudiantes en este nivel

)} setExpandRisk(!expandRisk)} >

Listado de Estudiantes por Riesgo de Deserción Detalle completo de evaluación por cada estudiante

{expandRisk && ( {/* Riesgo Bajo */}

Riesgo Bajo ({studentsByRisk.bajo.length})

{studentsByRisk.bajo.length > 0 ? ( studentsByRisk.bajo.map((student) => ( )) ) : ( )}

Estudiante	Grupo	Asistencia %	Sueño hrs	Estudio hrs	Salud Mental	Estado
{student.name}	G{student.group}	{student.evaluation?.asistencia.toFixed(1) \|\| "-"}%	{student.evaluation?.horasSueno.toFixed(1) \|\| "-"}	{student.evaluation?.horasEstudio.toFixed(1) \|\| "-"}	{student.evaluation?.saludMental.toFixed(1) \|\| "-"}/10	Seguro
No hay estudiantes en este nivel

{/* Riesgo Medio */}

Riesgo Medio ({studentsByRisk.medio.length})

{studentsByRisk.medio.length > 0 ? ( studentsByRisk.medio.map((student) => ( )) ) : ( )}

Estudiante	Grupo	Asistencia %	Sueño hrs	Estudio hrs	Salud Mental	Estado
{student.name}	G{student.group}	{student.evaluation?.asistencia.toFixed(1) \|\| "-"}%	{student.evaluation?.horasSueno.toFixed(1) \|\| "-"}	{student.evaluation?.horasEstudio.toFixed(1) \|\| "-"}	{student.evaluation?.saludMental.toFixed(1) \|\| "-"}/10	Alerta
No hay estudiantes en este nivel

{/* Riesgo Alto */}

Riesgo Alto ({studentsByRisk.alto.length})

{studentsByRisk.alto.length > 0 ? ( studentsByRisk.alto.map((student) => ( )) ) : ( )}

Estudiante	Grupo	Asistencia %	Sueño hrs	Estudio hrs	Salud Mental	Estado
{student.name}	G{student.group}	{student.evaluation?.asistencia.toFixed(1) \|\| "-"}%	{student.evaluation?.horasSueno.toFixed(1) \|\| "-"}	{student.evaluation?.horasEstudio.toFixed(1) \|\| "-"}	{student.evaluation?.saludMental.toFixed(1) \|\| "-"}/10	Crítico
No hay estudiantes en este nivel

)}

) } [V0_FILE]typescriptreact:file="components/prediction-form.tsx" isEdit="true" isQuickEdit="true" isMerged="true" "use client" import type React from "react" import { useState } from "react" import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from "@/components/ui/dialog" import { Card, CardContent } from "@/components/ui/card" import { Button } from "@/components/ui/button" import { Label } from "@/components/ui/label" import { Input } from "@/components/ui/input" import { predictPerformance } from "@/lib/predictor" import { FeedbackModal } from "@/components/feedback-modal" interface Student { id: string name: string } interface PredictionFormProps { student: Student onClose: () => void onResults: (results: any) => void } export function PredictionForm({ student, onClose, onResults }: PredictionFormProps) { const [formData, setFormData] = useState({ asistencia: "", horasSueno: "", horasEstudio: "", saludMental: "", }) const [results, setResults] = useState(null) const [showFeedback, setShowFeedback] = useState(false) const handleInputChange = (e: React.ChangeEvent) => { const { name, value } = e.target setFormData((prev) => ({ ...prev, [name]: value === "" ? "" : Number.parseFloat(value), })) } const handleSubmit = (e: React.FormEvent) => { e.preventDefault() if ( formData.asistencia === "" || formData.horasSueno === "" || formData.horasEstudio === "" || formData.saludMental === "" ) { alert("Por favor completa todos los campos") return } const prediction = predictPerformance({ asistencia: formData.asistencia, horasSueno: formData.horasSueno, horasEstudio: formData.horasEstudio, saludMental: formData.saludMental, }) setResults({ ...prediction, evaluation: { asistencia: formData.asistencia, horasSueno: formData.horasSueno, horasEstudio: formData.horasEstudio, saludMental: formData.saludMental, }, }) setShowFeedback(true) } if (showFeedback && results) { return ( { onResults(results) onClose() }} /> ) } return ( ) } [V0_FILE]typescriptreact:file="components/inline-evaluation-form.tsx" isMerged="true" "use client" import type React from "react" import { useState } from "react" import { Button } from "@/components/ui/button" import { Label } from "@/components/ui/label" import { Input } from "@/components/ui/input" import { predictPerformance } from "@/lib/predictor" interface Student { id: string name: string } interface InlineEvaluationFormProps { student: Student onClose: () => void onSubmit: (evaluation: any) => void } export function InlineEvaluationForm({ student, onClose, onSubmit }: InlineEvaluationFormProps) { const [formData, setFormData] = useState({ asistencia: "", horasSueno: "", horasEstudio: "", saludMental: "", }) const handleInputChange = (e: React.ChangeEvent) => { const { name, value } = e.target setFormData((prev) => ({ ...prev, [name]: value === "" ? "" : Number.parseFloat(value), })) } const handleSubmit = (e: React.FormEvent) => { e.preventDefault() if ( formData.asistencia === "" || formData.horasSueno === "" || formData.horasEstudio === "" || formData.saludMental === "" ) { alert("Por favor completa todos los campos") return } const prediction = predictPerformance({ asistencia: formData.asistencia, horasSueno: formData.horasSueno, horasEstudio: formData.horasEstudio, saludMental: formData.saludMental, }) const evaluationData = { ...prediction, evaluation: { asistencia: formData.asistencia, horasSueno: formData.horasSueno, horasEstudio: formData.horasEstudio, saludMental: formData.saludMental, }, } onSubmit(evaluationData) } return ( ) } [V0_FILE]typescriptreact:file="components/student-group.tsx" isEdit="true" isQuickEdit="true" "use client" import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card" import { Badge } from "@/components/ui/badge" import { Users, TrendingUp, AlertCircle, CheckCircle2, Edit2 } from "lucide-react" import { useState } from "react" import { InlineEvaluationForm } from "./inline-evaluation-form" import { Button } from "@/components/ui/button" interface Student { id: string name: string email: string group: number evaluation?: { asistencia: number horasSueno: number horasEstudio: number saludMental: number } results?: { calificacion: string riesgo: string score?: number detalles?: { asistencia: string sueno: string estudio: string saludMental: string } } } interface StudentGroupProps { groupNum: number students: Student[] stats: { total: number evaluated: number alto: number regular: number bajo: number } onSelectStudent: (student: Student) => void selectedStudent: Student | null onEvaluateStudent: (student: Student, evaluation: any) => void } export function StudentGroup({ groupNum, students, stats, onSelectStudent, selectedStudent, onEvaluateStudent, }: StudentGroupProps) { const [expandedStudentId, setExpandedStudentId] = useState(null) const getResultBadge = (calificacion?: string, score?: number) => { if (!calificacion) return ( No evaluado ) if (calificacion === "alto") return ( Rendimiento: Alto {score && `(${score}%)`} ) if (calificacion === "regular") return ( Rendimiento: Regular {score && `(${score}%)`} ) return ( Rendimiento: Bajo {score && `(${score}%)`} ) } const getRiskBadge = (riesgo?: string) => { if (!riesgo) return null if (riesgo === "bajo") return Bajo Riesgo if (riesgo === "medio") return Riesgo Medio return Alto Riesgo } return (

{/* Statistics Cards */}

Total

{stats.total}

Evaluados

{stats.evaluated}

Alto

{stats.alto}

Regular

{stats.regular}

Bajo

{stats.bajo}

{/* Students List */}

Estudiantes - Grupo {groupNum} Haz clic para evaluar el rendimiento académico

{students.map((student) => (

setExpandedStudentId(expandedStudentId === student.id ? null : student.id)} className={`cursor-pointer transition-all duration-200 hover:bg-accent/5 ${ expandedStudentId === student.id ? "bg-primary/5 border-l-4 border-primary" : "border-l-4 border-transparent" }`} >

Nombre y Apellidos

{student.name}

{student.evaluation && student.results ? (

{/* Asistencia */}

Asistencia

{student.evaluation.asistencia}%

{student.results.detalles?.asistencia}

{/* Horas de Sueño */}

Sueño

{student.evaluation.horasSueno} hrs

{student.results.detalles?.sueno}

{/* Horas de Estudio */}

Estudio

{student.evaluation.horasEstudio} hrs

{student.results.detalles?.estudio}

{/* Salud Mental */}

Salud Mental

{student.evaluation.saludMental}/10

{student.results.detalles?.saludMental}

) : (

)}

{student.results && ( )}

{student.results ? getResultBadge(student.results.calificacion, student.results.score) : getResultBadge()} {student.results && student.results.riesgo && (

Riesgo: {student.results.riesgo === "bajo" && ( Bajo (20%) )} {student.results.riesgo === "medio" && ( Medio (50%) )} {student.results.riesgo === "alto" && ( Alto (80%) )}

)}

{expandedStudentId === student.id && (

setExpandedStudentId(null)} onSubmit={(evaluation) => { onEvaluateStudent(student, evaluation) setExpandedStudentId(null) }} />

)}

))}

) } [V0_FILE]typescriptreact:file="components/evaluation-report.tsx" "use client" import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card" import { Badge } from "@/components/ui/badge" import { CheckCircle2, TrendingUp, AlertCircle, Users } from "lucide-react" interface Student { id: string name: string email: string group: number evaluation?: { asistencia: number horasSueno: number horasEstudio: number saludMental: number } results?: { calificacion: string riesgo: string score?: number detalles?: { asistencia: string sueno: string estudio: string saludMental: string } } } interface EvaluationReportProps { students: Student[] } export function EvaluationReport({ students }: EvaluationReportProps) { const evaluatedStudents = students.filter((s) => s.results) const getPerformanceIcon = (calificacion: string) => { if (calificacion === "alto") return if (calificacion === "regular") return return } const getRiskColor = (riesgo: string) => { if (riesgo === "bajo") return "bg-green-100 dark:bg-green-950/20" if (riesgo === "medio") return "bg-amber-100 dark:bg-amber-950/20" return "bg-red-100 dark:bg-red-950/20" } return (

Total Evaluados

{evaluatedStudents.length}

Alto Rendimiento

{evaluatedStudents.filter((s) => s.results?.calificacion === "alto").length}

Rendimiento Regular

{evaluatedStudents.filter((s) => s.results?.calificacion === "regular").length}

Bajo Rendimiento

{evaluatedStudents.filter((s) => s.results?.calificacion === "bajo").length}

Reporte de Evaluaciones Todos los estudiantes evaluados y sus resultados

{evaluatedStudents.map((student) => ( ))}

Nombre	Grupo	Asistencia	Sueño	Estudio	Salud Mental	Rendimiento	Score	Riesgo
{student.name} {student.email}	Grupo {student.group}	{student.evaluation?.asistencia}% {student.results?.detalles?.asistencia}	{student.evaluation?.horasSueno} hrs {student.results?.detalles?.sueno}	{student.evaluation?.horasEstudio} hrs {student.results?.detalles?.estudio}	{student.evaluation?.saludMental}/10 {student.results?.detalles?.saludMental}	{getPerformanceIcon(student.results?.calificacion \|\| "")} {student.results?.calificacion}	{student.results?.score}%	{student.results?.riesgo}

Nombre

Grupo

Asistencia

Sueño

Estudio

Salud Mental

Rendimiento

Score

Riesgo

{student.name}

{student.email}

Grupo {student.group}

{student.evaluation?.asistencia}%

{student.results?.detalles?.asistencia}

{student.evaluation?.horasSueno} hrs

{student.results?.detalles?.sueno}

{student.evaluation?.horasEstudio} hrs

{student.results?.detalles?.estudio}

{student.evaluation?.saludMental}/10

{student.results?.detalles?.saludMental}

{getPerformanceIcon(student.results?.calificacion || "")} {student.results?.calificacion}

{student.results?.score}%

{student.results?.riesgo}

{evaluatedStudents.length === 0 && (

No hay estudiantes evaluados aún

)}

) } [V0_FILE]typescriptreact:file="components/student-dashboard.tsx" isEdit="true" isQuickEdit="true" "use client" import { useState } from "react" import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs" import { StudentGroup } from "@/components/student-group" import { ResultsDashboard } from "@/components/results-dashboard" import { EvaluationReport } from "@/components/evaluation-report" import { studentNames } from "@/lib/student-names" import { BookOpen, BarChart3, FileText } from "lucide-react" interface Student { id: string name: string email: string group: number evaluation?: { asistencia: number horasSueno: number horasEstudio: number saludMental: number } results?: { calificacion: string riesgo: string score?: number detalles?: { asistencia: string sueno: string estudio: string saludMental: string } } } const initialStudents: Student[] = studentNames.map((student, index) => ({ id: `std-${student.group}-${index + 1}`, name: student.name, email: `${student.name.toLowerCase().replace(/\s+/g, ".")}.est@universidad.edu`, group: student.group, })) export function StudentDashboard() { const [students, setStudents] = useState(initialStudents) const [selectedStudent, setSelectedStudent] = useState(null) const [activeTab, setActiveTab] = useState("estudiantes") const updateStudentResults = (studentId: string, results: any) => { setStudents(students.map((s) => (s.id === studentId ? { ...s, ...results } : s))) } const handleEvaluateStudent = (student: Student, evaluation: any) => { const resultsData = { evaluation: evaluation.evaluation, results: { calificacion: evaluation.calificacion, riesgo: evaluation.riesgo, score: evaluation.score, detalles: evaluation.detalles, }, } updateStudentResults(student.id, resultsData) } const getGroupStats = (groupNum: number) => { const groupStudents = students.filter((s) => s.group === groupNum) const withResults = groupStudents.filter((s) => s.results) return { total: groupStudents.length, evaluated: withResults.length, alto: withResults.filter((s) => s.results?.calificacion === "alto").length, regular: withResults.filter((s) => s.results?.calificacion === "regular").length, bajo: withResults.filter((s) => s.results?.calificacion === "bajo").length, } } const totalStats = { total: students.length, evaluated: students.filter((s) => s.results).length, alto: students.filter((s) => s.results?.calificacion === "alto").length, regular: students.filter((s) => s.results?.calificacion === "regular").length, bajo: students.filter((s) => s.results?.calificacion === "bajo").length, } return (

{/* Header */}

Sistema Predictor

Rendimiento Académico - 5to Ciclo Sistemas

Total Estudiantes

{totalStats.total}

Evaluados

{totalStats.evaluated}

Alto Rendimiento

{totalStats.alto}

Por Mejorar

{totalStats.regular + totalStats.bajo}

{/* Navigation Buttons */}

{activeTab === "estudiantes" && ( <> {/* Tabs por grupo */}

Grupo 1 ({getGroupStats(1).total}) Grupo 2 ({getGroupStats(2).total}) Grupo 3 ({getGroupStats(3).total})

s.group === 1)} stats={getGroupStats(1)} onSelectStudent={setSelectedStudent} selectedStudent={selectedStudent} onEvaluateStudent={handleEvaluateStudent} /> s.group === 2)} stats={getGroupStats(2)} onSelectStudent={setSelectedStudent} selectedStudent={selectedStudent} onEvaluateStudent={handleEvaluateStudent} /> s.group === 3)} stats={getGroupStats(3)} onSelectStudent={setSelectedStudent} selectedStudent={selectedStudent} onEvaluateStudent={handleEvaluateStudent} />

)} {activeTab === "reporte" && } {activeTab === "analisis" && }

) }