'use client';

/**
 * Fila Cursor (ERP) — operação Sanctum no painel de desenvolvimento.
 * Ações: POST `/v1/desenvolvimento/fila-cursor/{id}/{acao}`.
 *
 * TASK-CID-025 — export da vista filtrada (`LazyExportButton` / CSV BOM UTF-8).
 * TASK-CID-028 — erros HTTP específicos (fetch + ações).
 */

import { AlertCircle, Bot, CheckCircle2, CirclePause, CirclePlay, Clock, Filter, RefreshCw } from 'lucide-react';
import { ICON_SIZE_MD } from '@/components/icons';
import React, { useCallback, useEffect, useMemo, useState } from 'react';
import { Alert, Badge, Button, Select, Input, Row, Col, Space, Tooltip, Modal } from 'antd';
import { message } from '@/lib/feedback/message';
import { useRouter, useParams } from 'next/navigation';
import { useQueryCache } from '@/hooks/useQueryCache';
import { useMutationCache } from '@/hooks/useMutationCache';
import { useResponsiveModalProps } from '@/hooks/useResponsiveModalProps';
import { API_ENDPOINTS } from '@/lib/api/endpoints';
import { getLaravelApiErrorMessage } from '@/lib/api/laravelApiErrorMessage';
import {
    presentFilaCursorFetchError,
    resolveFilaCursorActionErrorMessage,
    resolveFilaCursorFetchErrorMessage,
} from './filaCursorApiErrors';
import ProjetoLayout from '@/components/layouts/ProjetoLayout';
import MetricsGrid from '@/components/layouts/MetricsGrid';
import MetricCard from '@/components/layouts/MetricCard';
import { FormGroup } from '@/components/form';
import { OperativeRouteHint } from '@/components/layouts/OperativeRouteHint/OperativeRouteHint';
import { ButtonHeaderIcon } from '@/components/ui';
import { FiltrosModalFooterPadrao } from '@/components/listings';
import { LazyDataTable, LazyExportButton } from '@/components/lazy';
import btnHeaderStyles from '@/components/ui/buttons/ButtonHeaderIcon/ButtonHeaderIcon.module.scss';
import type { FilaCursorData, FilaCursorFiltros, TarefaFilaCursor } from './types';
import { buildFilaCursorColumns, type FilaCursorAcao } from './filaCursorDisplay';
import {
    buildFilaCursorExportRows,
    FILA_CURSOR_EXPORT_COLUMNS,
    FILA_CURSOR_EXPORT_HELP,
} from './filaCursorExport';
import {
    formatStatusExecucaoCursorLabel,
    STATUS_EXECUCAO_CURSOR_LABELS,
    type StatusExecucaoCursor,
} from './filaCursorStatus';
import { minhasTarefasTarefaDetalhePath } from '@/lib/routes/desenvolvimentoTarefasNav';
import { queryKeys } from '@/lib/cache/queryKeys';

const PRIORIDADE_FILTRO_LABELS: Record<string, string> = {
    baixa: 'Baixa',
    media: 'Média',
    alta: 'Alta',
    critica: 'Crítica',
};

const emptyFila: FilaCursorData = {
    estatisticas: {
        total: 0,
        pendentes: 0,
        em_execucao: 0,
        pausadas: 0,
        concluidas: 0,
        com_erro: 0,
    },
    tarefas: [],
};

export function FilaCursorScreen() {
    const router = useRouter();
    const params = useParams();
    const routeProjetoId =
        typeof params?.id === 'string' ? params.id : Array.isArray(params?.id) ? params?.id[0] : '';
    const [filters, setFilters] = useState<FilaCursorFiltros>({
        status: '',
        prioridade: '',
        projeto_id: routeProjetoId || '',
        busca: '',
    });
    const [filtrosModalOpen, setFiltrosModalOpen] = useState(false);
    const [draftFilters, setDraftFilters] = useState<FilaCursorFiltros>({
        status: '',
        prioridade: '',
        projeto_id: '',
        busca: '',
    });
    const [acaoPendingTarefaId, setAcaoPendingTarefaId] = useState<number | null>(null);
    const filtrosModalLayout = useResponsiveModalProps();

    useEffect(() => {
        if (!routeProjetoId) return;
        setFilters((prev) => (prev.projeto_id === routeProjetoId ? prev : { ...prev, projeto_id: routeProjetoId }));
    }, [routeProjetoId]);

    /** GET filtra `status` por `status_execucao_cursor` (enum Cursor). */
    const {
        data: filaData,
        isLoading,
        isError,
        error,
        refetch,
    } = useQueryCache<FilaCursorData>({
        queryKey: queryKeys.desenvolvimento.filaCursor(filters),
        endpoint: API_ENDPOINTS.desenvolvimento.filaCursor,
        params: filters,
        staleTime: 30 * 1000,
        gcTime: 2 * 60 * 1000,
        refetchInterval: 10 * 1000,
    });

    const { estatisticas, tarefas } = filaData ?? emptyFila;

    const fetchErrorPresentation = isError
        ? presentFilaCursorFetchError(error, 'Não foi possível carregar a fila Cursor (ERP)')
        : null;
    const fetchErrorMessage = isError
        ? resolveFilaCursorFetchErrorMessage(
              error,
              getLaravelApiErrorMessage(
                  error,
                  'Verifique a ligação à API e tente atualizar. Se persistir, contate o suporte.',
              ),
          )
        : '';

    const controlarTarefaMutation = useMutationCache<
        { message?: string; tarefa?: TarefaFilaCursor },
        { tarefaId: number; acao: FilaCursorAcao }
    >({
        endpoint: (variables) =>
            `${API_ENDPOINTS.desenvolvimento.filaCursor}/${variables.tarefaId}/${variables.acao}`,
        method: 'POST',
        invalidateQueries: [['desenvolvimento', 'fila-cursor']],
        onMutate: (variables) => {
            setAcaoPendingTarefaId(variables.tarefaId);
        },
        onSettled: () => {
            setAcaoPendingTarefaId(null);
        },
        onSuccess: (data) => {
            const msg =
                typeof data?.message === 'string' && data.message.trim()
                    ? data.message.trim()
                    : 'Ação executada com sucesso.';
            message.success(msg);
            void refetch();
        },
        onError: (err) => {
            const userMessage = getLaravelApiErrorMessage(
                err,
                'Não foi possível executar a ação. Tente novamente.',
            );
            const resolved = resolveFilaCursorActionErrorMessage(err, userMessage);
            if (resolved.level === 'warning') {
                message.warning(resolved.text);
                return;
            }
            message.error(resolved.text);
        },
    });

    const handleAcao = useCallback(
        (tarefa: TarefaFilaCursor, acao: FilaCursorAcao) => {
            controlarTarefaMutation.mutate({ tarefaId: tarefa.id, acao });
        },
        [controlarTarefaMutation],
    );

    const onVerDetalhes = useCallback(
        (tarefaId: number) => {
            router.push(minhasTarefasTarefaDetalhePath(tarefaId));
        },
        [router],
    );

    const columns = useMemo(
        () =>
            buildFilaCursorColumns({
                onAcao: handleAcao,
                onVerDetalhes,
                acaoPendingTarefaId,
            }),
        [handleAcao, onVerDetalhes, acaoPendingTarefaId],
    );

    const filtrosAtivosCount = useMemo(() => {
        let n = 0;
        if (filters.status) n += 1;
        if (filters.prioridade) n += 1;
        if (filters.busca.trim()) n += 1;
        if (routeProjetoId && filters.projeto_id && filters.projeto_id !== routeProjetoId) n += 1;
        if (!routeProjetoId && filters.projeto_id) n += 1;
        return n;
    }, [filters.status, filters.prioridade, filters.busca, filters.projeto_id, routeProjetoId]);
    const filtrosComAlgumAtivo = filtrosAtivosCount > 0;

    const resumoFiltrosAplicados = useMemo(() => {
        const partes: string[] = [];
        if (filters.status) {
            const label =
                STATUS_EXECUCAO_CURSOR_LABELS[filters.status as StatusExecucaoCursor] ??
                formatStatusExecucaoCursorLabel(filters.status as StatusExecucaoCursor);
            partes.push(`Status execução: ${label}`);
        }
        if (filters.prioridade) {
            partes.push(
                `Prioridade: ${PRIORIDADE_FILTRO_LABELS[filters.prioridade] ?? filters.prioridade}`,
            );
        }
        const projetoContaComoFiltroExtra =
            (routeProjetoId &&
                Boolean(filters.projeto_id) &&
                filters.projeto_id !== routeProjetoId) ||
            (!routeProjetoId && Boolean(filters.projeto_id));
        if (projetoContaComoFiltroExtra) {
            partes.push(`Projeto (id): ${filters.projeto_id}`);
        }
        const q = filters.busca.trim();
        if (q) partes.push(`Busca: "${q}"`);
        return partes.length ? partes.join(' · ') : '';
    }, [filters.status, filters.prioridade, filters.projeto_id, filters.busca, routeProjetoId]);

    const limparTodosFiltros = useCallback(() => {
        const cleared: FilaCursorFiltros = {
            status: '',
            prioridade: '',
            projeto_id: routeProjetoId || '',
            busca: '',
        };
        setFilters(cleared);
        setDraftFilters(cleared);
        setFiltrosModalOpen(false);
    }, [routeProjetoId]);

    const abrirModalFiltros = useCallback(() => {
        setDraftFilters({ ...filters });
        setFiltrosModalOpen(true);
    }, [filters]);

    const reporRascunhoFiltros = useCallback(() => {
        setDraftFilters({
            status: '',
            prioridade: '',
            projeto_id: routeProjetoId || '',
            busca: '',
        });
    }, [routeProjetoId]);

    const aplicarFiltrosModal = useCallback(() => {
        setFilters({
            ...draftFilters,
            busca: draftFilters.busca.trim(),
        });
        setFiltrosModalOpen(false);
    }, [draftFilters]);

    const filaCursorExportRows = useMemo(() => buildFilaCursorExportRows(tarefas), [tarefas]);

    const filaCursorExportFilename = routeProjetoId
        ? `projetos-fila-cursor-erp-${routeProjetoId}`
        : 'projetos-fila-cursor-erp';

    const tableEmptyText =
        filtrosComAlgumAtivo && !isLoading
            ? 'Nenhuma tarefa corresponde aos filtros aplicados.'
            : 'Nenhuma tarefa Cursor nesta fila. Delegue tarefas com execução via agente ou volte mais tarde.';

    return (
        <ProjetoLayout
            projetoId={routeProjetoId}
            pageTitle="Fila Cursor"
            showPageTitleIcon={false}
            titleSection="Fila Cursor"
            headerAction={
                    <Space wrap size={8} align="center">
                        <Tooltip
                            title={
                                filtrosAtivosCount > 0
                                    ? `Filtros ativos (${filtrosAtivosCount}) — status de execução, prioridade, projeto ou busca`
                                    : 'Definir status de execução, prioridade, projeto e texto de busca'
                            }
                        >
                            <span style={{ display: 'inline-block' }}>
                                <Badge dot={filtrosComAlgumAtivo} color="geekblue">
                                    <ButtonHeaderIcon
                                        data-testid="fila-cursor-abrir-filtros"
                                        icon={<Filter size={ICON_SIZE_MD} aria-hidden />}
                                        title={
                                            filtrosAtivosCount > 0
                                                ? `Filtros (${filtrosAtivosCount})`
                                                : 'Filtros'
                                        }
                                        aria-label="Abrir filtros da fila Cursor (ERP)"
                                        aria-expanded={filtrosModalOpen}
                                        aria-haspopup="dialog"
                                        onClick={abrirModalFiltros}
                                        className={btnHeaderStyles.btnHeaderIcon}
                                    />
                                </Badge>
                            </span>
                        </Tooltip>
                        <Tooltip title={FILA_CURSOR_EXPORT_HELP}>
                            <span style={{ display: 'inline-block' }} data-testid="fila-cursor-export">
                                <LazyExportButton
                                    data={filaCursorExportRows as unknown as Record<string, unknown>[]}
                                    columns={FILA_CURSOR_EXPORT_COLUMNS}
                                    filename={filaCursorExportFilename}
                                    title="Exportar fila Cursor (ERP)"
                                    helpTooltip={FILA_CURSOR_EXPORT_HELP}
                                    iconOnly
                                    size="large"
                                    exportMenuMode="modal"
                                    className={btnHeaderStyles.btnHeaderIcon}
                                />
                            </span>
                        </Tooltip>
                        <Tooltip title="Recarregar a fila">
                            <span style={{ display: 'inline-block' }}>
                                <Button
                                    icon={<RefreshCw size={ICON_SIZE_MD} aria-hidden />}
                                    onClick={() => void refetch()}
                                    loading={isLoading}
                                >
                                    Atualizar
                                </Button>
                            </span>
                        </Tooltip>
                    </Space>
            }
        >
            {routeProjetoId ? (
                <OperativeRouteHint
                    message="Prioridade neste projeto"
                    description="A fila Cursor (ERP) mostra tarefas com execução via agente. Use Filtros para refinar status de execução, prioridade ou busca."
                >
                    <Space wrap>
                        <Button type="primary" onClick={() => router.push(`/projetos/${routeProjetoId}/kanban`)}>
                            Ir ao Kanban
                        </Button>
                        <Button onClick={() => router.push(`/projetos/${routeProjetoId}/planejamento/backlog`)}>
                            Backlog técnico
                        </Button>
                    </Space>
                </OperativeRouteHint>
            ) : null}

            {fetchErrorPresentation ? (
                <Alert
                    type={fetchErrorPresentation.alertType}
                    showIcon
                    style={{ marginBottom: 16 }}
                    message={fetchErrorPresentation.title}
                    description={
                        <>
                            {fetchErrorMessage}
                            <Button type="link" onClick={() => void refetch()} style={{ paddingLeft: 8 }}>
                                Tentar novamente
                            </Button>
                        </>
                    }
                />
            ) : null}

            <MetricsGrid columns={6} style={{ marginBottom: 24 }}>
                <MetricCard
                    icon={<Bot size={ICON_SIZE_MD} aria-hidden />}
                    label="Total"
                    value={estatisticas.total}
                    variant="projetos"
                />
                <MetricCard
                    icon={<Clock size={ICON_SIZE_MD} aria-hidden />}
                    label="Pendentes"
                    value={estatisticas.pendentes}
                    variant="planejamento"
                />
                <MetricCard
                    icon={<CirclePlay size={ICON_SIZE_MD} aria-hidden />}
                    label="Em execução"
                    value={estatisticas.em_execucao}
                    variant="emAndamento"
                />
                <MetricCard
                    icon={<CirclePause size={ICON_SIZE_MD} aria-hidden />}
                    label="Pausadas"
                    value={estatisticas.pausadas}
                    variant="planejamento"
                />
                <MetricCard
                    icon={<CheckCircle2 size={ICON_SIZE_MD} aria-hidden />}
                    label="Concluídas"
                    value={estatisticas.concluidas}
                    variant="concluidos"
                />
                <MetricCard
                    icon={<AlertCircle size={ICON_SIZE_MD} aria-hidden />}
                    label="Com erro"
                    value={estatisticas.com_erro}
                    variant="emAndamento"
                />
            </MetricsGrid>

            <Modal
                title="Filtrar fila Cursor (ERP)"
                data-testid="fila-cursor-filtros-modal"
                open={filtrosModalOpen}
                onCancel={() => setFiltrosModalOpen(false)}
                width={filtrosModalLayout.width ?? 720}
                centered={filtrosModalLayout.centered}
                styles={filtrosModalLayout.styles}
                footer={
                    <FiltrosModalFooterPadrao
                        onLimparTodos={reporRascunhoFiltros}
                        onFechar={() => setFiltrosModalOpen(false)}
                        showFiltrarPrimary
                        onFiltrar={aplicarFiltrosModal}
                        dataTestIdLimparTodos="fila-cursor-filtros-modal-limpar-todos"
                    />
                }
                destroyOnHidden
                keyboard
                focusTriggerAfterClose
            >
                <Row gutter={16}>
                    <Col xs={24} sm={12} md={6}>
                        <FormGroup label="Status de execução">
                            <Select
                                placeholder="Todos"
                                allowClear
                                style={{ width: '100%' }}
                                value={draftFilters.status || undefined}
                                onChange={(value) =>
                                    setDraftFilters((prev) => ({ ...prev, status: value || '' }))
                                }
                            >
                                <Select.Option value="pendente">Pendente</Select.Option>
                                <Select.Option value="em_execucao">Em execução</Select.Option>
                                <Select.Option value="pausada">Pausada</Select.Option>
                                <Select.Option value="concluida">Concluída</Select.Option>
                                <Select.Option value="erro">Erro</Select.Option>
                                <Select.Option value="cancelada">Cancelada</Select.Option>
                            </Select>
                        </FormGroup>
                    </Col>
                    <Col xs={24} sm={12} md={6}>
                        <FormGroup label="Prioridade">
                            <Select
                                placeholder="Todos"
                                allowClear
                                style={{ width: '100%' }}
                                value={draftFilters.prioridade || undefined}
                                onChange={(value) =>
                                    setDraftFilters((prev) => ({ ...prev, prioridade: value || '' }))
                                }
                            >
                                <Select.Option value="baixa">Baixa</Select.Option>
                                <Select.Option value="media">Média</Select.Option>
                                <Select.Option value="alta">Alta</Select.Option>
                                <Select.Option value="critica">Crítica</Select.Option>
                            </Select>
                        </FormGroup>
                    </Col>
                    <Col xs={24} sm={12} md={6}>
                        <FormGroup label="Projeto (id)">
                            <Select
                                placeholder="Todos / contexto da rota"
                                allowClear
                                style={{ width: '100%' }}
                                value={draftFilters.projeto_id || undefined}
                                onChange={(value) =>
                                    setDraftFilters((prev) => ({ ...prev, projeto_id: value || '' }))
                                }
                            >
                                {/* Carregar projetos da API */}
                            </Select>
                        </FormGroup>
                    </Col>
                </Row>
                <Row gutter={16} style={{ marginTop: 16 }}>
                    <Col xs={24}>
                        <FormGroup label="Busca">
                            <Input.Search
                                placeholder={'Buscar tarefa… — confirme com "Filtrar" ou Enter em "Pesquisar"'}
                                allowClear
                                value={draftFilters.busca}
                                onChange={(e) =>
                                    setDraftFilters((prev) => ({ ...prev, busca: e.target.value }))
                                }
                                onSearch={() => aplicarFiltrosModal()}
                                enterButton="Pesquisar"
                                aria-label="Pesquisar tarefas na fila Cursor (ERP)"
                            />
                        </FormGroup>
                    </Col>
                </Row>
            </Modal>

            {filtrosComAlgumAtivo ? (
                <Alert
                    type="info"
                    showIcon
                    style={{ marginBottom: 16 }}
                    message={`Filtros aplicados (${filtrosAtivosCount})`}
                    description={
                        <>
                            {resumoFiltrosAplicados}
                            <Button type="link" onClick={limparTodosFiltros} style={{ paddingLeft: 8 }}>
                                Limpar filtros
                            </Button>
                        </>
                    }
                />
            ) : null}

            <div style={{ marginTop: filtrosComAlgumAtivo ? 0 : undefined }}>
                <LazyDataTable
                    columns={columns}
                    data={isError ? [] : tarefas}
                    loading={isLoading}
                    rowKey="id"
                    pagination={{
                        pageSize: 20,
                        showSizeChanger: true,
                        showTotal: (total) => `Total: ${total} tarefa${total === 1 ? '' : 's'}`,
                    }}
                    locale={{ emptyText: tableEmptyText }}
                    scroll={{ x: 'max-content' }}
                    ariaRegionLabel="Tarefas na fila Cursor"
                    autoMobileFromColumns={{
                        testIdPrefix: 'fila-cursor',
                        listHeading: 'Lista da fila Cursor',
                        getFallbackTitle: (r) =>
                            r.titulo?.trim() || `Tarefa ${r.id}`,
                    }}
                />
            </div>
        </ProjetoLayout>
    );
}