import Container from "@/components/Forms/Container";
import ReactTable from "@/components/ReactTable/ReactTable";
import { cadastrarKit } from "@/requests/CRUD/KitManual/cadastroKitManual";
import { editarKitManual } from "@/requests/CRUD/KitManual/editarKitManual";
import { listarKitsManual } from "@/requests/CRUD/KitManual/listarKitManual";
import { listarModulos } from "@/requests/CRUD/Modulos/listarModulos";
import _ from "lodash";
import { useEffect, useState } from "react";
import { FieldValues } from "react-hook-form";
import FormKitManual from "./FormKitManual";

const ConsultaKitManual = () => {
  const [modules, setModules] = useState<any[]>([]);
  const [lojas, setLojas] = useState<any[]>([]);

  useEffect(() => {
    const fetchData = async () => {
      try {
        const modulosData = await listarModulos();
        setModules(modulosData);
      } catch (error) {
        console.error("Erro ao carregar dados iniciais:", error);
      } finally {
      }
    };

    fetchData();
  }, []);

  const dados = [
    "id_kit",
    "status_kit",
    "descricao_kit",
    "preco_kit",
    "potencia_kit",
    "ultimaAtualizacao_kit",
  ];

  const columns = dados.map((e) => {
    let header = _.capitalize(e).replaceAll("_kit", "").replaceAll("_", " ");
    header = header === "Preco" ? "Preço" : header;
    header = header === "Potencia modulo" ? "Potencia Módulo" : header;
    header = header === "Ultima atualizacao" ? "Última Atualização" : header;
    return { header: header, accessorKey: e };
  });

  const formatKitsList = async (arr: any) => {
    const kitsFormatados = await Promise.all(
      arr.map(async (kit: any) => {
        kit["potencia_kit"] = `${kit["potencia_kit"]} Wp`;
        kit["preco_kit"] = Number(kit["preco_kit"]).toLocaleString("pt-BR", {
          style: "currency",
          currency: "BRL",
          minimumFractionDigits: 2,
          maximumFractionDigits: 2,
        });
        kit["ultimaAtualizacao_kit"] = new Date(
          kit["ultimaAtualizacao_kit"]
        ).toLocaleDateString("pt-BR");

        try {
          const moduloSelecionado = modules.find(
            (modulo: any) => modulo.codItem_modulo === kit["codModulo_kit"]
          );

          if (moduloSelecionado) {
            kit["codModulo_kit"] = moduloSelecionado.descricao_modulo;
          }
        } catch (error) {
          console.error("Erro ao listar módulos:", error);
        }

        return kit;
      })
    );
    return kitsFormatados;
  };

  const fetchKits = async () => {
    const kits = await listarKitsManual();
    return formatKitsList(kits); // 🟢 Agora a função retorna os dados já processados
  };

  const sendCadastrarKit = async (data: FieldValues) => {
    return cadastrarKit(data);
  };

  return (
    <Container>
      <ReactTable
        columns={columns}
        listFunction={fetchKits}
        idCol="id_kit"
        isActiveCol="status_kit"
        canEdit
        canDesactive
        createFunction={sendCadastrarKit}
        editFunction={editarKitManual}
        Form={FormKitManual}
        pageName="Kits Próprios"
      />
    </Container>
  );
};

export default ConsultaKitManual;