100 lines
2.5 KiB
TypeScript
100 lines
2.5 KiB
TypeScript
import React, { useEffect } from "react";
|
|
import { Divider, Modal, Spin } from "antd";
|
|
import { useModalState } from "../../../../zustand/Modal";
|
|
import { useObjectToEdit } from "../../../../zustand/ObjectToEditState";
|
|
import { useTranslation } from "react-i18next";
|
|
import { QueryStatusEnum } from "../../../../enums/QueryStatus";
|
|
import SpinContainer from "../../../../Components/Layout/SpinContainer";
|
|
import { MdCancel } from "react-icons/md";
|
|
import { Form, Formik } from "formik";
|
|
|
|
interface LayoutModalProps {
|
|
isAddModal?: boolean;
|
|
modelTitle: string;
|
|
handleSubmit: (values: any) => void;
|
|
getInitialValues: any;
|
|
getValidationSchema: any;
|
|
children: React.ReactNode;
|
|
status?: QueryStatusEnum;
|
|
ModelEnum: any;
|
|
ModelClassName?: string;
|
|
width?: string;
|
|
isLoading?: boolean;
|
|
buttonTitle?:string;
|
|
initialButtonName?:boolean
|
|
}
|
|
|
|
const LayoutModel = ({
|
|
isAddModal = true,
|
|
children,
|
|
handleSubmit = () => {},
|
|
getInitialValues,
|
|
getValidationSchema,
|
|
status,
|
|
modelTitle,
|
|
ModelEnum,
|
|
ModelClassName,
|
|
width = "800px",
|
|
isLoading = false,
|
|
buttonTitle,
|
|
initialButtonName = true,
|
|
}: LayoutModalProps) => {
|
|
const { isOpen, setIsOpen } = useModalState((state) => state);
|
|
const { setObjectToEdit } = useObjectToEdit();
|
|
useEffect(() => {
|
|
if (isAddModal && status === QueryStatusEnum.SUCCESS) {
|
|
setIsOpen("isSuccess");
|
|
setObjectToEdit({});
|
|
return;
|
|
}
|
|
if (status === QueryStatusEnum.SUCCESS) {
|
|
setIsOpen("");
|
|
setObjectToEdit({});
|
|
}
|
|
}, [setIsOpen, status]);
|
|
|
|
const handleCancel = () => {
|
|
setIsOpen("");
|
|
setObjectToEdit({});
|
|
};
|
|
|
|
const [t] = useTranslation();
|
|
return (
|
|
<>
|
|
<Modal
|
|
className={"ModalForm " + ModelClassName}
|
|
centered
|
|
width={width}
|
|
footer={null}
|
|
open={isOpen === ModelEnum}
|
|
onCancel={handleCancel}
|
|
>
|
|
|
|
<Formik
|
|
enableReinitialize={true}
|
|
initialValues={getInitialValues}
|
|
validationSchema={getValidationSchema}
|
|
onSubmit={handleSubmit}
|
|
>
|
|
{(formik) => {
|
|
useEffect(() => {
|
|
if (isOpen === "" || isOpen === "isSuccess") {
|
|
formik.setErrors({});
|
|
formik.resetForm();
|
|
}
|
|
}, [isOpen]);
|
|
|
|
return <Form className="w-100 reseller_modal_form">
|
|
<main className="main_modal">
|
|
{isLoading ? <SpinContainer /> : children}
|
|
</main>
|
|
</Form>
|
|
}}
|
|
</Formik>
|
|
</Modal>
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default LayoutModel;
|