"use client";
import Input from "@/components/Forms/Input";
import InputGroup from "@/components/Forms/InputGroup";
import InputSelectComponent from "@/components/Forms/InputSelect";
import { GetForm } from "@/utils";

const AVISO_TIPO_INDICACAO_BLOQUEADO =
  "Não é possível alterar o Tipo de Indicação pois existem contatos/projetos vinculados a esta origem.";

const FormOrigens = ({
  onSubmitFunction,
  defaultValues,
  disabledFields,
  children,
  ...rest
}: any) => {
  const { handleSubmit, ...form } = GetForm();
  const origemEmUso = defaultValues?.pode_excluir === "0";
  const tipoIndicacaoBloqueado =
    origemEmUso ||
    disabledFields?.some(
      (field: string) => field === "indicacao_origem_cliente",
    );

  return (
    <form onSubmit={handleSubmit(onSubmitFunction)} {...rest}>
      <InputGroup align="center">
        <Input
          name="nome_origem_cliente"
          label="Descrição da Origem"
          width={"xl:w-1/5"}
          formulario={form}
          error={"Preencha o Nome da Origem"}
          required
          defaultValue={defaultValues && defaultValues["nome_origem_cliente"]}
          disabled={disabledFields?.some(
            (field: string) => field == "nome_origem_cliente",
          )}
        />
        <div className="flex flex-col xl:w-1/5">
          <InputSelectComponent
            options={[
              { value: "1", label: "Indicação Controlado pela Empresa" },
              { value: "2", label: "Indicação Controlado pelo Vendedor" },
              { value: "0", label: "Não é Indicação" },
            ]}
            name="indicacao_origem_cliente"
            label="É de Indicação"
            formulario={form}
            error={"Preencha o Tipo da Origem"}
            required
            disabled={tipoIndicacaoBloqueado}
            defaultValue={
              (defaultValues && defaultValues["indicacao_origem_cliente"]) ||
              "0"
            }
          />
          {tipoIndicacaoBloqueado && (
            <p className="mt-1 text-xs text-amber-700 dark:text-amber-400">
              {AVISO_TIPO_INDICACAO_BLOQUEADO}
            </p>
          )}
        </div>
        <InputSelectComponent
          options={[
            { value: "0", label: "Não" },
            { value: "1", label: "Sim" },
          ]}
          name="rede_social_origem_cliente"
          label="É Redes Social?"
          width={"xl:w-1/5"}
          formulario={form}
          error={"Preencha o Tipo da Origem"}
          required
          defaultValue={
            (defaultValues && defaultValues["rede_social_origem_cliente"]) ||
            "0"
          }
        />
      </InputGroup>
      {children}
    </form>
  );
};

export default FormOrigens;