"use client";

import { useCallback, useEffect, useState } from "react";
import { FileText, Plus, ReceiptText } from "lucide-react";

import type { NotaNaTela } from "@/lib/fiscal/servidor/apresentacao";
import { usePermissoes } from "@/lib/permissoes-do-usuario";

import { MarcaDoModelo, moeda, pedirFiscal, SeloDoStatus, SeloSemValorFiscal, dataEHora } from "./comum";
import { DetalheDaNota } from "./detalhe-da-nota";
import { EmitirNotaDoPedido } from "./emitir-nota-do-pedido";

/**
 * Tudo que a tela do pedido precisa das notas fiscais, num lugar só: o botão
 * da barra de ações (que diz em que pé está a nota), a seção da aba Financeiro
 * e as duas janelas (emitir e detalhe).
 */
export function useNotasDoPedido(pedidoId: string | null | undefined) {
  const { pode } = usePermissoes();
  const podeVer = pode("fiscal.ver");
  const [notas, setNotas] = useState<NotaNaTela[]>([]);
  const [carregou, setCarregou] = useState(false);

  const recarregar = useCallback(async () => {
    if (!pedidoId || !podeVer) return;
    try {
      const json = await pedirFiscal<{ notas: NotaNaTela[] }>(`/api/fiscal/pedidos/${pedidoId}?so=notas`);
      setNotas(json.notas.filter((nota) => nota.status !== "removida"));
    } catch {
      setNotas([]);
    } finally {
      setCarregou(true);
    }
  }, [pedidoId, podeVer]);

  useEffect(() => {
    void recarregar();
  }, [recarregar]);

  return { notas, carregou, recarregar, podeVer };
}

function resumoDasNotas(notas: NotaNaTela[]) {
  const vivas = notas.filter((nota) => !["cancelada", "removida"].includes(nota.status));
  if (!vivas.length) return { rotulo: "Emitir nota", tom: null as null | "bom" | "ruim" | "andamento" | "neutro" };
  if (vivas.some((nota) => ["rejeitada", "erro", "denegada"].includes(nota.status))) return { rotulo: "Nota com problema", tom: "ruim" as const };
  if (vivas.some((nota) => nota.emAndamento)) return { rotulo: "Nota processando", tom: "andamento" as const };
  if (vivas.every((nota) => nota.status === "autorizada" || nota.status === "contingencia")) {
    return { rotulo: vivas.length > 1 ? `${vivas.length} notas emitidas` : "Nota emitida", tom: "bom" as const };
  }
  if (vivas.some((nota) => nota.status === "rascunho")) return { rotulo: "Prévia da nota", tom: "neutro" as const };
  return { rotulo: "Nota fiscal", tom: "neutro" as const };
}

const BOLINHA: Record<string, string> = {
  bom: "bg-emerald-500",
  ruim: "bg-rose-500",
  andamento: "bg-violet-500 animate-pulse",
  neutro: "bg-slate-400",
};

export function BotaoDaNotaFiscal({ notas, aoClicar }: { notas: NotaNaTela[]; aoClicar: () => void }) {
  const resumo = resumoDasNotas(notas);
  return (
    <button type="button" onClick={aoClicar} className="ks-button ks-button-soft ks-button-sm shrink-0">
      <ReceiptText size={14} />
      {resumo.rotulo}
      {resumo.tom ? <span className={`ml-0.5 h-1.5 w-1.5 rounded-full ${BOLINHA[resumo.tom]}`} /> : null}
    </button>
  );
}

export function NotasFiscaisDoPedido({
  pedidoId,
  clienteId,
  telefoneDoCliente,
  pedidoCancelado,
  notas,
  aoMudar,
  emissaoAberta,
  setEmissaoAberta,
}: {
  pedidoId: string;
  clienteId?: string | null;
  telefoneDoCliente?: string | null;
  pedidoCancelado?: boolean;
  notas: NotaNaTela[];
  aoMudar: () => void;
  emissaoAberta: boolean;
  setEmissaoAberta: (aberta: boolean) => void;
}) {
  const { pode } = usePermissoes();
  const permissoes = { emitir: pode("fiscal.emitir"), cancelar: pode("fiscal.cancelar"), configurar: pode("fiscal.configurar") };
  const [notaAberta, setNotaAberta] = useState<string | null>(null);

  return (
    <>
      <div className="overflow-hidden rounded-2xl border border-[var(--ks-color-border-subtle)] bg-[var(--ks-color-bg-elevated)]">
        <div className="flex flex-wrap items-center justify-between gap-3 px-6 py-4">
          <div className="flex items-center gap-2">
            <ReceiptText size={18} className="text-[var(--ks-color-primary)]" />
            <h3 className="text-lg font-semibold text-[var(--ks-color-text-primary)]">Notas fiscais</h3>
            {notas.length ? <span className="text-xs text-[var(--ks-color-text-muted)]">{notas.length}</span> : null}
          </div>
          {permissoes.emitir && !pedidoCancelado ? (
            <button type="button" onClick={() => setEmissaoAberta(true)} className="ks-button ks-button-primary ks-button-sm">
              <Plus size={14} />
              {notas.some((nota) => !["cancelada"].includes(nota.status)) ? "Abrir nota fiscal" : "Emitir nota fiscal"}
            </button>
          ) : null}
        </div>
        {notas.length ? (
          <ul>
            {notas.map((nota) => (
              <li
                key={nota.id}
                onClick={() => setNotaAberta(nota.id)}
                className="flex cursor-pointer items-center gap-3 border-t border-slate-100/60 px-6 py-3.5 transition-colors hover:bg-[var(--ks-color-bg-subtle)]/50"
              >
                <MarcaDoModelo modelo={nota.modelo} />
                <div className="min-w-0 flex-1">
                  <p className="flex flex-wrap items-center gap-2 text-sm font-semibold text-[var(--ks-color-text-primary)]">
                    {nota.modeloNome}
                    {nota.numero ? <span className="ks-num">nº {nota.numero}</span> : null}
                    {nota.semValorFiscal ? <SeloSemValorFiscal /> : null}
                  </p>
                  <p className="truncate text-[11px] text-[var(--ks-color-text-soft)]">
                    {nota.autorizadaEm ? `autorizada em ${dataEHora(nota.autorizadaEm)}` : `criada em ${dataEHora(nota.criadaEm)}`}
                    {nota.explicacao && ["rejeitada", "erro", "denegada"].includes(nota.status) ? ` · ${nota.explicacao.titulo}` : ""}
                  </p>
                </div>
                <span className="ks-num text-sm font-semibold text-[var(--ks-color-text-primary)]">{moeda(nota.valor)}</span>
                <SeloDoStatus tom={nota.tom} rotulo={nota.rotulo} titulo={nota.descricaoDoStatus} />
                {nota.temArquivos ? (
                  <button
                    type="button"
                    onClick={(e) => {
                      e.stopPropagation();
                      window.open(`/api/fiscal/notas/${nota.id}/arquivo?tipo=pdf`, "_blank", "noopener,noreferrer");
                    }}
                    className="ks-button ks-button-ghost ks-button-sm"
                    title="Abrir o PDF"
                  >
                    <FileText size={14} />
                  </button>
                ) : null}
              </li>
            ))}
          </ul>
        ) : (
          <p className="border-t border-slate-100/60 px-6 py-5 text-sm text-[var(--ks-color-text-muted)]">
            Nenhuma nota emitida para este pedido.
          </p>
        )}
      </div>

      <EmitirNotaDoPedido
        pedidoId={pedidoId}
        aberta={emissaoAberta}
        aoFechar={() => setEmissaoAberta(false)}
        aoMudar={aoMudar}
        telefoneDoCliente={telefoneDoCliente}
        permissoes={permissoes}
      />
      <DetalheDaNota
        notaId={notaAberta}
        aberta={Boolean(notaAberta)}
        aoFechar={() => setNotaAberta(null)}
        aoMudar={aoMudar}
        telefoneDoCliente={telefoneDoCliente}
        clienteId={clienteId}
        permissoes={permissoes}
      />
    </>
  );
}