"use client";

import { useState } from "react";
import SearchUser from "./Global/SearchUser/searchUser";
import SearchBoxEquipo from "./SearchEquipo";

export default function CheckBoxEquipo() {
  const [modo, setModo] = useState<"Equipo" | "Cuenta" | null>(null);

  return (
    <>
      <div className="radio-grid">
        <label className="radio-card">
          <input
            type="radio"
            name="modo"
            checked={modo === "Equipo"}
            onChange={() => setModo("Equipo")}
          />
          <span className="radio-ui"></span>
          <span className="radio-text">Equipo</span>
        </label>

        <label className="radio-card">
          <input
            type="radio"
            name="modo"
            checked={modo === "Cuenta"}
            onChange={() => setModo("Cuenta")}
          />
          <span className="radio-ui"></span>
          <span className="radio-text">Cuenta</span>
        </label>
      </div>

      {modo === "Cuenta" && <SearchUser value={"3"} />}
      {modo === "Equipo" && <SearchBoxEquipo />}
    </>
  );
}