import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { personaEmpresaService } from "../docMockServices";
import { CrudProvider, useCrud } from "../../contexts";
import { Button, Card, Collection, Dialog, Input, Loader } from "../../components";
import { useNavigate } from "react-router-dom";
import { ListCrudDocsContentEmpresaPersonas } from "./ListCrudDocsContentEmpresaPersonas";
import { useEffect, useState, useCallback } from "react";
import { DropdownMenu } from "../../components/layout/DropdownMenu";
import { FormProvider, useForm } from "react-hook-form";
export const ListCrudDocsContentEmpresaSingle = () => {
    const { item, fetchItem, fetchItems, updateItem, deleteItem } = useCrud();
    const methods = useForm({
        defaultValues: item,
    });
    const { buscarPorEmpresa, agregar, editar, eliminar } = personaEmpresaService;
    const navigate = useNavigate();
    const [isEditing, setIsEditing] = useState(false);
    const [isOpenEliminarDialog, setIsOpenEliminarDialog] = useState(false);
    const buscarPersonasPorEmpresa = useCallback(async () => {
        if (!item?.id) {
            return [];
        }
        const personas = await buscarPorEmpresa(item.id);
        return personas;
    }, [item?.id, buscarPorEmpresa]);
    useEffect(() => {
        if (item) {
            methods.reset(item);
        }
        // eslint-disable-next-line react-hooks/exhaustive-deps
    }, [item]);
    const onSubmitEdit = async (empresa) => {
        await updateItem.execute(empresa);
        setIsEditing(false);
        fetchItem.execute();
        fetchItems.execute();
    };
    const onDeleteEmpresaSubmit = async () => {
        await deleteItem.execute(item);
        setIsOpenEliminarDialog(false);
        navigate(-1);
        fetchItems.execute();
    };
    return (_jsxs(_Fragment, { children: [_jsx(Card, { title: fetchItem.isLoading ? "" : item?.nombre, headerActions: !isEditing ? (_jsxs(Collection, { direction: "row", children: [_jsx(DropdownMenu, { options: [
                                { label: "Editar", icon: "fa-edit" },
                                { label: "Eliminar", icon: "fa-trash" },
                            ], onOptionSelected: (item) => {
                                if (item.label === "Editar") {
                                    setIsEditing(true);
                                }
                                if (item.label === "Eliminar") {
                                    setIsOpenEliminarDialog(true);
                                }
                            } }), _jsx(Button, { icon: "fa-undo", variant: "ghost", size: "sm", onClick: () => navigate(-1) })] })) : null, alwaysDisplayHeaderActions: true, footer: isEditing ? (_jsx("div", { className: "flex justify-end", children: _jsxs(Collection, { direction: "row", children: [_jsx(Button, { variant: "outline", onClick: () => setIsEditing(false), disabled: updateItem.isLoading, children: "Cancelar" }), _jsx(Button, { icon: "fa-save", onClick: methods.handleSubmit(onSubmitEdit), disabled: updateItem.isLoading, children: "Guardar" })] }) })) : null, children: !isEditing ? (_jsx(CrudProvider, { getPromise: buscarPersonasPorEmpresa, postPromise: {
                        execute: (persona) => agregar(persona),
                        successMessage: "Persona agregada correctamente",
                    }, putPromise: {
                        execute: (personaEmpresa) => editar(personaEmpresa.idPersona, personaEmpresa.idEmpresa, personaEmpresa),
                        successMessage: "Cambios guardados",
                    }, deletePromise: {
                        execute: (persona) => eliminar(persona),
                        successMessage: "Persona eliminada correctamente",
                    }, extraData: { idEmpresa: item?.id }, children: _jsx(ListCrudDocsContentEmpresaPersonas, {}) })) : (_jsx(FormProvider, { ...methods, children: _jsx("form", { onSubmit: methods.handleSubmit(onSubmitEdit), children: _jsx(Collection, { children: _jsx("div", { className: "w-[300px]", children: _jsx(Input, { label: "Nombre", ...methods.register("nombre", {
                                        required: "Campo obligatorio",
                                    }) }) }) }) }) })) }), isOpenEliminarDialog && (_jsxs(Dialog, { isOpen: isOpenEliminarDialog, title: "Eliminar Empresa", onClose: () => setIsOpenEliminarDialog(false), footer: _jsxs(_Fragment, { children: [_jsx(Button, { variant: "outline", onClick: () => setIsOpenEliminarDialog(false), disabled: deleteItem.isLoading, children: "Cancelar" }), _jsx(Button, { onClick: onDeleteEmpresaSubmit, disabled: deleteItem.isLoading, children: "Eliminar" })] }), children: [_jsx("p", { children: "\u00BFEst\u00E1s seguro de querer eliminar esta empresa?" }), _jsx(Loader, { isLoading: deleteItem.isLoading })] }))] }));
};
