'use client';

import React, { useEffect, useMemo, useState } from 'react';
import { Alert, Button, Descriptions, Modal, Typography } from 'antd';
import { message } from '@/lib/feedback/message';
import { RefreshCw } from 'lucide-react';
import { ICON_SIZE_MD } from '@/components/icons';
import { useMutation, useQueryClient } from '@tanstack/react-query';
import apiClient from '@/lib/api/client';
import { API_ENDPOINTS } from '@/lib/api/endpoints';
import { queryKeys } from '@/lib/cache/queryKeys';
import { formatDateTimePt } from '@/lib/format/formatDateTimePt';
import {
    CHAMADO_EMAIL_STATUS_LABELS,
    type ChamadoEmailThreadRow,
} from '../utils/chamadoEmailThread';

export type ChamadoEmailDiagnosticoData = {
    id: number;
    status: string;
    to_email?: string | null;
    subject?: string | null;
    erro_envio?: string | null;
    enviado_em?: string | null;
    created_at?: string | null;
};

export type ChamadoEmailDiagnosticoModalProps = {
    open: boolean;
    onClose: () => void;
    chamadoId: string;
    email: ChamadoEmailDiagnosticoData | null;
    canRetry?: boolean;
    onRetrySuccess?: () => void;
};

const DICAS_DIAGNOSTICO = [
    'Confirme que o worker de filas está ativo (`php artisan queue:work`).',
    'Revise credenciais SMTP em Configurações > Suporte > Contas de e-mail.',
    'Valide o endereço do destinatário e bloqueios SPF/DKIM no servidor de saída.',
    'Consulte os logs da API (`business.chamado.email_saida_*`) para detalhes técnicos.',
];

export function ChamadoEmailDiagnosticoModal({
    open,
    onClose,
    chamadoId,
    email,
    canRetry = false,
    onRetrySuccess,
}: ChamadoEmailDiagnosticoModalProps) {
    const queryClient = useQueryClient();
    const [detalhe, setDetalhe] = useState<ChamadoEmailThreadRow | null>(null);
    const [loadingDetalhe, setLoadingDetalhe] = useState(false);

    useEffect(() => {
        if (!open || !email?.id) {
            setDetalhe(null);
            return;
        }

        let cancelled = false;
        setLoadingDetalhe(true);
        void apiClient
            .get<{ data: ChamadoEmailThreadRow }>(
                API_ENDPOINTS.suporte.chamados.emails.show(chamadoId, email.id),
            )
            .then((response) => {
                if (!cancelled) {
                    setDetalhe(response.data.data);
                }
            })
            .catch(() => {
                if (!cancelled) {
                    setDetalhe(null);
                }
            })
            .finally(() => {
                if (!cancelled) {
                    setLoadingDetalhe(false);
                }
            });

        return () => {
            cancelled = true;
        };
    }, [open, chamadoId, email?.id]);

    const registro = useMemo(() => {
        if (!email) {
            return null;
        }
        return {
            ...email,
            subject: detalhe?.subject ?? email.subject,
            erro_envio: detalhe?.erro_envio ?? email.erro_envio,
            to_email: detalhe?.to_email ?? email.to_email,
            status: detalhe?.status ?? email.status,
        };
    }, [detalhe, email]);

    const retryMutation = useMutation({
        mutationFn: async () => {
            if (!email?.id) {
                throw new Error('Registro de e-mail inválido.');
            }
            await apiClient.post(
                API_ENDPOINTS.suporte.chamados.emails.retry(chamadoId, email.id),
            );
        },
        onSuccess: async () => {
            message.success('Reenvio agendado na fila do servidor.');
            await Promise.all([
                queryClient.invalidateQueries({
                    queryKey: queryKeys.suporte.chamados.detail(chamadoId),
                }),
                queryClient.invalidateQueries({
                    queryKey: queryKeys.suporte.chamados.emails(chamadoId),
                }),
            ]);
            onRetrySuccess?.();
            onClose();
        },
        onError: (error: unknown) => {
            const msg =
                (error as { response?: { data?: { message?: string } } })?.response?.data
                    ?.message ?? 'Não foi possível reagendar o envio.';
            message.error(msg);
        },
    });

    const statusCfg = registro
        ? (CHAMADO_EMAIL_STATUS_LABELS[registro.status] ?? {
              color: 'default',
              label: registro.status,
          })
        : null;

    return (
        <Modal
            title="Diagnóstico de falha no e-mail"
            open={open}
            onCancel={onClose}
            destroyOnClose
            width={640}
            footer={[
                <Button key="fechar" onClick={onClose}>
                    Fechar
                </Button>,
                canRetry && registro?.status === 'falha' ? (
                    <Button
                        key="retry"
                        type="primary"
                        icon={<RefreshCw size={ICON_SIZE_MD} aria-hidden />}
                        loading={retryMutation.isPending}
                        onClick={() => retryMutation.mutate()}
                    >
                        Reenviar e-mail
                    </Button>
                ) : null,
            ].filter(Boolean)}
        >
            {!registro ? (
                <Typography.Text type="secondary">Nenhum registro selecionado.</Typography.Text>
            ) : (
                <>
                    <Alert
                        type="error"
                        showIcon
                        message="O envio SMTP desta notificação falhou"
                        description={
                            registro.erro_envio?.trim() ||
                            'A API não registrou mensagem de erro detalhada.'
                        }
                        style={{ marginBottom: 16 }}
                    />

                    <Descriptions bordered size="small" column={1} loading={loadingDetalhe}>
                        <Descriptions.Item label="Estado">
                            {statusCfg?.label ?? registro.status}
                        </Descriptions.Item>
                        <Descriptions.Item label="Destinatário">
                            {registro.to_email || '—'}
                        </Descriptions.Item>
                        <Descriptions.Item label="Assunto">
                            {registro.subject?.trim() || '—'}
                        </Descriptions.Item>
                        <Descriptions.Item label="Registrado em">
                            {formatDateTimePt(registro.created_at ?? null)}
                        </Descriptions.Item>
                        {registro.enviado_em ? (
                            <Descriptions.Item label="Enviado em">
                                {formatDateTimePt(registro.enviado_em)}
                            </Descriptions.Item>
                        ) : null}
                    </Descriptions>

                    <Typography.Title level={5} style={{ marginTop: 20, marginBottom: 8 }}>
                        O que verificar
                    </Typography.Title>
                    <ul style={{ margin: 0, paddingLeft: 20 }}>
                        {DICAS_DIAGNOSTICO.map((dica) => (
                            <li key={dica}>
                                <Typography.Text>{dica}</Typography.Text>
                            </li>
                        ))}
                    </ul>
                </>
            )}
        </Modal>
    );
}