feat: add competencias management to CursosVista component

diplomas/src/pages/cursosVista.jsx

@@ -18,6 +18,7 @@ export default function CursosVista() {
   const [nuevoNombre, setNuevoNombre] = useState("");
   const [nuevaDescripcion, setNuevaDescripcion] = useState("");
   const [nuevaHoras, setNuevaHoras] = useState("");
+  const [competenciasGuardadas, setCompetenciasGuardadas] = useState([]);
   const [mostrarModal, setMostrarModal] = useState(false);
   const [modalMensaje, setModalMensaje] = useState("");
 
@@ -43,6 +44,7 @@ export default function CursosVista() {
     setNuevoNombre(curso.nombre);
     setNuevaDescripcion(curso.descripcion);
     setNuevaHoras(curso.horas);
+    setCompetenciasGuardadas(curso.competencias || []);
   };
 
   const cancelarEdicion = () => {
@@ -50,6 +52,7 @@ export default function CursosVista() {
     setNuevoNombre("");
     setNuevaDescripcion("");
     setNuevaHoras("");
+    setCompetenciasGuardadas([]);
   };
 
   const guardarEdicion = async (id) => {
@@ -59,6 +62,7 @@ export default function CursosVista() {
         nombre: nuevoNombre,
         descripcion: nuevaDescripcion,
         horas: nuevaHoras,
+        competencias: competenciasGuardadas,
       })
       .eq("id", id);
 
@@ -79,7 +83,10 @@ export default function CursosVista() {
   };
 
   const eliminarCurso = async () => {
-    const { error } = await supabaseClient.from("curso").delete().eq("id", cursoAEliminar);
+    const { error } = await supabaseClient
+      .from("curso")
+      .delete()
+      .eq("id", cursoAEliminar);
     if (error) {
       console.error("Error eliminando curso:", error.message);
       setModalMensaje("Error al eliminar el curso");
@@ -102,6 +109,7 @@ export default function CursosVista() {
               <th className="py-2 border-b">Nombre</th>
               <th className="py-2 border-b">Descripción</th>
               <th className="py-2 border-b">Horas</th>
+              <th className="py-2 border-b">Competencias</th>
               <th className="py-2 border-b">Acciones</th>
             </tr>
           </thead>
@@ -129,6 +137,16 @@ export default function CursosVista() {
                       onChange={(e) => setNuevaHoras(e.target.value)}
                     />
                   </td>
+                  <td className="py-2 px-4 border-b">
+                    <Input
+                      type="text"
+                      value={competenciasGuardadas}
+                      onChange={(e) =>
+                        setCompetenciasGuardadas(e.target.value.split(", "))
+                      }
+                      placeholder="Competencias (separadas por comas)"
+                    />
+                  </td>
                   <td className="py-2 px-4 border-b flex justify-center">
                     <Button
                       className="bg-green-500 hover:bg-green-700 text-white font-bold py-1 px-3 m-2 rounded"
@@ -150,6 +168,9 @@ export default function CursosVista() {
                   <td className="py-2 px-4 border-b">{curso.nombre}</td>
                   <td className="py-2 px-4 border-b">{curso.descripcion}</td>
                   <td className="py-2 px-4 border-b">{curso.horas}</td>
+                  <td className="py-2 px-4 border-b">
+                    {curso.competencias.join(", ")}
+                  </td>
                   <td className="py-2 px-4 border-b space-x-2">
                     <Button
                       className="bg-blue-500 hover:bg-blue-700 text-white font-bold py-1 px-3 rounded"
@@ -175,9 +196,12 @@ export default function CursosVista() {
       <Dialog open={confirmarEliminar} onOpenChange={setConfirmarEliminar}>
         <DialogContent>
           <DialogHeader>
-            <DialogTitle className="text-black">Confirmar eliminación</DialogTitle>
+            <DialogTitle className="text-black">
+              Confirmar eliminación
+            </DialogTitle>
             <DialogDescription>
-              ¿Estás seguro de que deseas eliminar este curso? Esta acción no se puede deshacer.
+              ¿Estás seguro de que deseas eliminar este curso? Esta acción no se
+              puede deshacer.
             </DialogDescription>
           </DialogHeader>
           <DialogFooter>
@@ -213,4 +237,4 @@ export default function CursosVista() {
       </Dialog>
     </Layout>
   );
-}
+}