import * as React from 'react';
import { useDispatch, useSelector } from 'react-redux';
import { AdaptableFormComponent } from '../../../../components/AdaptableFormComponent';
import Dialog from '../../../../components/Dialog';
import { getDefaultAdaptableFormData } from '../../../../AdaptableState/Common/AdaptableForm';
import { PopupHideForm } from '../../../../Redux/ActionsReducers/PopupRedux';
import { useAdaptable } from '../../../AdaptableContext';
import { Flex } from '../../../../components/Flex';
export const FormDialog = ({ id, formProps, form, prepareContext, }) => {
    const dispatch = useDispatch();
    const adaptable = useAdaptable();
    const [data, setData] = React.useState(() => {
        return getDefaultAdaptableFormData(form);
    });
    const handleDismiss = () => {
        dispatch(PopupHideForm(id));
    };
    const context = {
        adaptableApi: adaptable.api,
        formData: data,
        ...formProps,
    };
    return (React.createElement(Dialog, { isOpen: true, showCloseButton: false, className: "twa:min-h-auto twa:min-w-[400px] twa:max-h-[80vh]", onDismiss: handleDismiss },
        React.createElement(Flex, { flexDirection: 'column', "data-name": "form-dialog", className: "twa:p-4 twa:h-full" },
            React.createElement(AdaptableFormComponent, { formDef: form, data: data, context: context, onChange: setData, api: adaptable.api, displayTitle: true, onButtonClick: async (button) => {
                    handleDismiss();
                    const preparedContext = typeof prepareContext === 'function' ? await prepareContext(context) : context;
                    button.onClick?.(button, preparedContext);
                } }))));
};
export const FormPopups = () => {
    const forms = useSelector((state) => state.Popup.FormPopup.FormList);
    return (React.createElement(React.Fragment, null, forms.map((form) => {
        return (React.createElement(FormDialog, { key: form.Id, prepareContext: form.prepareContext, id: form.Id, formProps: form.FormProps, form: form.Form }));
    })));
};
