"use client";
import { useEffect, useState } from "react";
import SearchUser from "./Global/SearchUser/searchUser";
import SearchEquipo from "./SearchEquipo";
import { envConfig } from "../lib/config";
import axios from "axios";
import Information from "./Global/Information/information";
import toast from "react-hot-toast";

async function getEquipoByCount(idCuenta: number) {
  try {
    const res = await axios.get(
      `${envConfig.apiUrl}/bitacora/cuenta/${idCuenta}`,
    );
    return res.data;
  } catch (error: any) {
    if (axios.isAxiosError(error)) {
      return {
        error: error.response?.data?.message || "Error al consultar equipo",
      };
    }

    return { error: "Error desconocido" };
  }
}

async function getEquipoId(idEquipo: number) {
  try {
    const res = await axios.get(
      `${envConfig.apiUrl}/bitacora/equipo/${idEquipo}`,
    );
    return res.data;
  } catch (error: any) {
    if (axios.isAxiosError(error)) {
      return {
        error: error.response?.data?.message || "Error al consultar equipo",
      };
    }

    return { error: "Error desconocido" };
  }
}

interface Props {
  numAcount?: string | null;
  machine?: string | null;
}

export default function CheckBoxEquipo({ numAcount, machine }: Props) {
  const [modo, setModo] = useState<"Equipo" | "Cuenta" | null>("Cuenta");
  const [bitacora, setBitacora] = useState<any>(null);
  const [tiempoRestante, setTiempoRestante] = useState<string>("");

  useEffect(() => {
    if (!numAcount) return;

    const idCuenta = parseInt(numAcount);
    if (isNaN(idCuenta)) return;

    const fetchData = async () => {
      const result = await getEquipoByCount(idCuenta);

      if (result?.error) {
        toast.error(result.error);
        setBitacora(null);
      } else {
        setBitacora(result);
      }
    };

    fetchData();
  }, [numAcount]);

  useEffect(() => {
    if (!machine) return;

    const idCuenta = parseInt(machine);
    if (isNaN(idCuenta)) return;

    const fetchData = async () => {
      const result = await getEquipoId(idCuenta);

      if (result?.error) {
        toast.error(result.error);
        setBitacora(null);
      } else {
        setBitacora(result);
      }
    };

    fetchData();
  }, [machine]);

  useEffect(() => {
    if (!bitacora) return;

    const entrada = new Date(bitacora.tiempo_entrada).getTime();
    const asignadoMs = bitacora.tiempo_asignado * 60 * 1000;

    const interval = setInterval(() => {
      const ahora = Date.now();
      const restante = entrada + asignadoMs - ahora;

      if (restante <= 0) {
        setTiempoRestante("agotado");
        clearInterval(interval);
      } else {
        const minutos = Math.floor(restante / 60000);
        const segundos = Math.floor((restante % 60000) / 1000);
        setTiempoRestante(`${minutos} minutos con ${segundos} segundos`);
      }
    }, 1000);

    return () => clearInterval(interval);
  }, [bitacora]);

  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={numAcount ?? null} />}
      {modo === "Equipo" && <SearchEquipo value={machine ?? null}/>}

      {bitacora && (
        <Information
          NoCuenta={bitacora.alumno_inscrito.alumno.id_cuenta}
          Nombre={bitacora.alumno_inscrito.alumno.nombre}
          Tiempo={tiempoRestante}
          Equipo={bitacora.equipo.ubicacion}
        />
      )}
    </>
  );
}
