'use client';

/**
 * Jobs / crons / filas — `/projetos/[id]/software/jobs`
 */

import { Plus, Save } from 'lucide-react';
import { ICON_SIZE_MD } from '@/components/icons';
import React, { useMemo, useState } from 'react';
import { useParams } from 'next/navigation';
import { Button, Form, Input, Modal, Select, Space, Tooltip } from 'antd';
import type { ColumnsType } from 'antd/es/table';
import { message } from '@/lib/feedback/message';
import { notifyApiError } from '@/lib/feedback/notifyApiError';
import { confirmDialog } from '@/lib/feedback/confirmDialog';
import { FormTextarea } from '@/components/form';
import {
    useWaygestFormModalProps,
    waygestFormModalFooterClassName,
} from '@/hooks/useWaygestFormModalProps';
import { useQueryCache } from '@/hooks/useQueryCache';
import { useMutationCache } from '@/hooks/useMutationCache';
import { useProjetoWriteGates } from '@/features/projetos/hooks/useProjetoWriteGates';
import { queryKeys } from '@/lib/cache/queryKeys';
import { API_ENDPOINTS } from '@/lib/api/endpoints';
import apiClient from '@/lib/api/client';
import ProjetoLayout from '@/components/layouts/ProjetoLayout';
import { ListPageCreateFloatButton } from '@/components/listings';
import { LazyDataTable } from '@/components/lazy';
import {
    ProjetoTipologicoEmptyState,
} from '@/features/projetos/projeto-tipologico-empty-state';
import type { ProjetoSoftwareAmbiente } from '@/features/projetos/projeto-software-ambientes/types';
import { JOB_TIPO_OPTIONS, type ProjetoSoftwareJob } from './types';

const FORM_ID = 'projeto-software-job-form';

const STATUS_OPTIONS = [
    { label: 'Ativo', value: 'ativo' },
    { label: 'Inativo', value: 'inativo' },
    { label: 'Planejado', value: 'planejado' },
];

export function ProjetoSoftwareJobsScreen() {
    const params = useParams();
    const id = params?.id as string;
    const { canEditar, tooltipSemPermissao } = useProjetoWriteGates();
    const tooltipSemEdicao = !canEditar ? tooltipSemPermissao('editar jobs') : undefined;
    const [modalOpen, setModalOpen] = useState(false);
    const [editing, setEditing] = useState<ProjetoSoftwareJob | null>(null);
    const [form] = Form.useForm();
    const formModalLayout = useWaygestFormModalProps();

    const { data: listData, isLoading, refetch } = useQueryCache<
        { data: ProjetoSoftwareJob[] } | ProjetoSoftwareJob[]
    >({
        queryKey: queryKeys.projetos.jobsSoftware(id),
        endpoint: API_ENDPOINTS.projetos.jobsSoftware.index(id),
        enabled: !!id,
        staleTime: 60_000,
    });

    const { data: ambientesData } = useQueryCache<
        { data: ProjetoSoftwareAmbiente[] } | ProjetoSoftwareAmbiente[]
    >({
        queryKey: queryKeys.projetos.ambientes(id),
        endpoint: API_ENDPOINTS.projetos.ambientes.index(id),
        enabled: !!id,
        staleTime: 60_000,
    });

    const itens = useMemo(() => {
        if (Array.isArray(listData)) return listData;
        return listData?.data ?? [];
    }, [listData]);

    const ambientes = useMemo(() => {
        if (Array.isArray(ambientesData)) return ambientesData;
        return ambientesData?.data ?? [];
    }, [ambientesData]);

    const saveMutation = useMutationCache({
        endpoint: editing
            ? API_ENDPOINTS.projetos.jobsSoftware.update(id, editing.id)
            : API_ENDPOINTS.projetos.jobsSoftware.store(id),
        method: editing ? 'PUT' : 'POST',
        invalidateQueries: [
            queryKeys.projetos.jobsSoftware(id),
            queryKeys.projetos.documentacaoHealth(id),
        ],
        onSuccess: () => {
            message.success(editing ? 'Job atualizado.' : 'Job registrado.');
            setModalOpen(false);
            setEditing(null);
            form.resetFields();
            refetch();
        },
        onError: (error: unknown) => {
            notifyApiError(error, 'Erro ao salvar o job.', 'jobs-software');
        },
    });

    const openCreate = () => {
        setEditing(null);
        form.resetFields();
        form.setFieldsValue({ tipo: 'cron', status: 'ativo' });
        setModalOpen(true);
    };

    const openEdit = (row: ProjetoSoftwareJob) => {
        setEditing(row);
        form.setFieldsValue({
            nome: row.nome,
            tipo: row.tipo,
            ambiente_id: row.ambiente_id ?? undefined,
            comando_handler: row.comando_handler ?? '',
            frequencia: row.frequencia ?? '',
            finalidade: row.finalidade ?? '',
            fila: row.fila ?? '',
            timeout: row.timeout ?? '',
            retry: row.retry ?? '',
            monitoramento: row.monitoramento ?? '',
            alerta: row.alerta ?? '',
            responsavel: row.responsavel ?? '',
            status: row.status ?? 'ativo',
            criticidade: row.criticidade ?? undefined,
            observacoes: row.observacoes ?? '',
        });
        setModalOpen(true);
    };

    const handleDelete = (row: ProjetoSoftwareJob) => {
        confirmDialog({
            title: 'Excluir job?',
            content: `Remover “${row.nome}”?`,
            okText: 'Excluir',
            okType: 'danger',
            onOk: async () => {
                try {
                    await apiClient.delete(API_ENDPOINTS.projetos.jobsSoftware.destroy(id, row.id));
                    message.success('Job excluído.');
                    refetch();
                } catch (error) {
                    notifyApiError(error, 'Erro ao excluir.', 'jobs-software');
                }
            },
        });
    };

    const columns: ColumnsType<ProjetoSoftwareJob> = useMemo(
        () => [
            { title: 'Nome', dataIndex: 'nome', key: 'nome' },
            { title: 'Tipo', dataIndex: 'tipo', key: 'tipo', width: 130 },
            { title: 'Frequência', dataIndex: 'frequencia', key: 'freq', width: 140 },
            { title: 'Fila', dataIndex: 'fila', key: 'fila', width: 120 },
            { title: 'Status', dataIndex: 'status', key: 'status', width: 100 },
            {
                title: 'Ações',
                key: 'acoes',
                width: 160,
                render: (_: unknown, row: ProjetoSoftwareJob) => (
                    <Space>
                        <Button type="link" disabled={!canEditar} onClick={() => openEdit(row)}>
                            Editar
                        </Button>
                        <Button
                            type="link"
                            danger
                            disabled={!canEditar}
                            onClick={() => handleDelete(row)}
                        >
                            Excluir
                        </Button>
                    </Space>
                ),
            },
        ],
        [canEditar],
    );

    return (
        <ProjetoLayout
            projetoId={id}
            pageTitle="Jobs e automações"
            pageIcon="clock"
            titleSection="Especificação"
            breadcrumbItems={[
                { title: 'PROJETO' },
                { title: 'Projeto', path: `/projetos/${id}` },
                { title: 'Jobs e automações' },
            ]}
            data-testid="projeto-jobs"
        >
            
            {itens.length === 0 && !isLoading ? (
                <ProjetoTipologicoEmptyState
                    title="Nenhum job inventariado"
                    domainKey="jobs"
                    projetoId={id}
                    primaryAction={
                        canEditar ? (
                            <Button type="primary" onClick={openCreate}>
                                Adicionar job
                            </Button>
                        ) : undefined
                    }
                />
            ) : (
                <LazyDataTable
                    columns={columns}
                    data={itens}
                    loading={isLoading}
                    rowKey="id"
                    pagination={{ pageSize: 20, hideOnSinglePage: true }}
                    ariaRegionLabel="Jobs e automações do projeto"
                    autoMobileFromColumns={{
                        testIdPrefix: 'software-jobs',
                        listHeading: 'Lista de jobs',
                        getFallbackTitle: (r) => r.nome?.trim() || `Job ${r.id}`,
                    }}
                />
            )}
            {canEditar ? (
                <ListPageCreateFloatButton
                    icon={<Plus size={ICON_SIZE_MD} aria-hidden />}
                    onClick={openCreate}
                    aria-label="Adicionar job"
                />
            ) : null}
            

            <Modal
                {...formModalLayout}
                open={modalOpen}
                title={editing ? 'Editar job' : 'Novo job'}
                onCancel={() => {
                    setModalOpen(false);
                    setEditing(null);
                }}
                footer={
                    <div className={waygestFormModalFooterClassName}>
                        <Button onClick={() => setModalOpen(false)}>Cancelar</Button>
                        <Tooltip title={tooltipSemEdicao}>
                            <Button
                                type="primary"
                                htmlType="submit"
                                form={FORM_ID}
                                icon={<Save size={ICON_SIZE_MD} aria-hidden />}
                                loading={saveMutation.isPending}
                                disabled={!canEditar}
                            >
                                Salvar
                            </Button>
                        </Tooltip>
                    </div>
                }
            >
                <Form id={FORM_ID} form={form} layout="vertical" onFinish={(v) => saveMutation.mutate(v)} scrollToFirstError>
                    <Form.Item name="nome" label="Nome" rules={[{ required: true, message: 'Informe o nome' }]}>
                        <Input />
                    </Form.Item>
                    <Form.Item name="tipo" label="Tipo" rules={[{ required: true }]}>
                        <Select options={JOB_TIPO_OPTIONS} />
                    </Form.Item>
                    <Form.Item name="ambiente_id" label="Ambiente">
                        <Select
                            allowClear
                            options={ambientes.map((a) => ({ label: a.nome, value: a.id }))}
                        />
                    </Form.Item>
                    <Form.Item name="comando_handler" label="Comando / handler">
                        <Input placeholder="App\Jobs\… ou artisan command" />
                    </Form.Item>
                    <Form.Item name="frequencia" label="Frequência">
                        <Input placeholder="Diário 02:00 / a cada 5 min…" />
                    </Form.Item>
                    <Form.Item name="fila" label="Fila">
                        <Input />
                    </Form.Item>
                    <Form.Item name="finalidade" label="Finalidade">
                        <FormTextarea rows={2} />
                    </Form.Item>
                    <Form.Item name="monitoramento" label="Monitoramento">
                        <Input />
                    </Form.Item>
                    <Form.Item name="alerta" label="Alerta">
                        <Input />
                    </Form.Item>
                    <Form.Item name="timeout" label="Timeout">
                        <Input />
                    </Form.Item>
                    <Form.Item name="retry" label="Retry">
                        <Input />
                    </Form.Item>
                    <Form.Item name="status" label="Status">
                        <Select options={STATUS_OPTIONS} />
                    </Form.Item>
                    <Form.Item name="criticidade" label="Criticidade">
                        <Select
                            allowClear
                            options={[
                                { label: 'Baixa', value: 'baixa' },
                                { label: 'Média', value: 'media' },
                                { label: 'Alta', value: 'alta' },
                                { label: 'Crítica', value: 'critica' },
                            ]}
                        />
                    </Form.Item>
                    <Form.Item name="responsavel" label="Responsável">
                        <Input />
                    </Form.Item>
                    <Form.Item name="observacoes" label="Observações">
                        <FormTextarea rows={2} />
                    </Form.Item>
                </Form>
            </Modal>
        </ProjetoLayout>
    );
}