added equipo by student

app/Components/InformacionEquipos/SelectorEquipo.tsx

@@ -0,0 +1,60 @@
+"use client";
+import { envConfig } from "@/app/lib/config";
+import axios from "axios";
+import { useEffect, useState } from "react";
+
+interface Equipos {
+  id_equipo: number;
+  id_plataforma: number;
+  id_area_ubicacion: number;
+  nombre_equipo: string;
+  ubicacion: string;
+  activo: boolean;
+  ip: string;
+  areaUbicacion:{area:string}
+  plataforma:{nombre:string}
+}
+
+
+interface Props {
+  onSearch: (id: number) => void;
+}
+
+export default function SelectorEquipo({ onSearch }: Props) {
+  const [sala, setSala] = useState<Equipos[]>();
+  const [selected, setSelected] = useState<number>();
+
+  const handleChangeEquipo = (e: React.ChangeEvent<HTMLSelectElement>) => {
+    setSelected(Number(e.target.value));
+  };
+
+  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+    e.preventDefault();
+    if (!selected) return;
+    onSearch(selected);
+  };
+
+  useEffect(() => {
+    const fetchData = async () => {
+      const response = await axios.get(`${envConfig.apiUrl}/equipo`);
+
+      setSala(response.data);
+    };
+
+    fetchData();
+  }, []);
+
+  return (
+    <form className="form-container" onSubmit={handleSubmit}>
+      <select value={selected} onChange={handleChangeEquipo}>
+        <option value="">-- Selecciona una equipo --</option>
+        {sala &&
+          sala.map((eq) => (
+          <option key={eq.id_equipo} value={eq.id_equipo}>
+            {eq.ubicacion } {eq.nombre_equipo} {eq.plataforma.nombre} {eq.areaUbicacion.area}
+          </option>
+          ))}
+      </select>
+    </form>
+  );
+}

app/Components/InformacionEquipos/SelectorSala.tsx

@@ -1,7 +1,7 @@
 "use client";
 import { envConfig } from "@/app/lib/config";
 import axios from "axios";
-import { use, useEffect, useState } from "react";
+import { useEffect, useState } from "react";
 
 interface Area {
   id_area_ubicacion: number;