From 95f1c51ccc262643aace58e52cf4444f1d9b6285 Mon Sep 17 00:00:00 2001
From: IO420 <320154041@pcpuma.acatlan.unam.mx>
Date: Wed, 8 Oct 2025 15:47:08 -0600
Subject: [PATCH] merge all and fixed SelectArea.tsx

---
 .../InformacionEquipos/ProgramSelector.tsx    |  5 ++--
 .../{SelectAreas.jsx => SelectAreas.tsx}      | 25 ++++++++-----------
 2 files changed, 13 insertions(+), 17 deletions(-)
 rename app/Components/{SelectAreas.jsx => SelectAreas.tsx} (51%)

diff --git a/app/Components/InformacionEquipos/ProgramSelector.tsx b/app/Components/InformacionEquipos/ProgramSelector.tsx
index 0459d34..928688a 100644
--- a/app/Components/InformacionEquipos/ProgramSelector.tsx
+++ b/app/Components/InformacionEquipos/ProgramSelector.tsx
@@ -1,5 +1,6 @@
 "use client";
 import { useState } from "react";
+import SelectAreas from "../SelectAreas";
 
 interface DatosEquipo {
   titulo: string;
@@ -43,7 +44,7 @@ const caracteristicasPorEquipo: Record<string, string[]> = {
   // Agrega más equipos según necesites
 };
 
-function ProgramSelector({ titulo, opcion }: DatosEquipo) {
+export default function ProgramSelector({ titulo, opcion }: DatosEquipo) {
   // Estado del equipo seleccionado
   const [equipoSeleccionado, setEquipoSeleccionado] = useState("");
   // Estado de los checkboxes (programas)
@@ -110,5 +111,3 @@ function ProgramSelector({ titulo, opcion }: DatosEquipo) {
     </form>
   );
 }
-
-export default ProgramSelector;
diff --git a/app/Components/SelectAreas.jsx b/app/Components/SelectAreas.tsx
similarity index 51%
rename from app/Components/SelectAreas.jsx
rename to app/Components/SelectAreas.tsx
index 380f1dc..71933bc 100644
--- a/app/Components/SelectAreas.jsx
+++ b/app/Components/SelectAreas.tsx
@@ -1,16 +1,14 @@
-"use clien";
-import React, { useEffect, useState } from "react";
+"use client";
+import { useEffect, useState } from "react";
 
 export default function SelectAreas() {
-  const [areas, setAreas] = useState([]); // aquí guardaremos los datos del servidor
+  const [areas, setAreas] = useState([]);
   const [selectedArea, setSelectedArea] = useState("");
 
-  // useEffect se ejecuta una vez al montar el componente
   useEffect(() => {
     fetch("https://venus.acatlan.unam.mx/asignacionTiempo_test/area-ubicacion")
       .then((response) => response.json())
       .then((data) => {
-        console.log("Áreas obtenidas:", data);
         setAreas(data);
       })
       .catch((error) => {
@@ -18,19 +16,18 @@ export default function SelectAreas() {
       });
   }, []);
 
-  const handleChange = (e) => {
-    setSelectedArea(e.target.value);
-    console.log("Área seleccionada:", e.target.value);
-  };
-
   return (
     <div>
       <label htmlFor="areaSelect">Selecciona un área:</label>
-      <select id="areaSelect" value={selectedArea} onChange={handleChange}>
+      <select
+        id="areaSelect"
+        value={selectedArea}
+        onChange={(e) => setSelectedArea(e.target.value)}
+      >
         <option value="">-- Selecciona una opción --</option>
-        {areas.map((area) => (
-          <option key={area.id_area} value={area.id_area}>
-            {area.nombre_area}
+        {areas.map((area: any, index) => (
+          <option key={index} value={area.id_area}>
+            {area.id_area}
           </option>
         ))}
       </select>