import React from "react";
import { Modal } from "antd";

interface AppModalProps {
  children: React.ReactNode;
  className?: string;
  wrapperClassName?: string;
  modalTitle?: string;
  isModalVisible?: boolean;
  onOk?: () => void;
  footer?: boolean;
  width?: number | string;
  centered?: boolean;
  closeIcon?: boolean;
  getContainer?: string | false | HTMLElement | (() => HTMLElement) | undefined;
  onCancel?: () => void;
  closable?: boolean;
  loading?: boolean;
  afterOpenChange?: (visible: boolean) => void;
}

const AppModal = ({
  children,
  className,
  wrapperClassName,
  modalTitle,
  isModalVisible,
  onOk,
  footer = false,
  width,
  centered,
  onCancel,
  closeIcon,
  getContainer = false,
  closable = true,
  loading = false,
  afterOpenChange,
}: AppModalProps) => {
  return (
    <Modal
      zIndex={9999}
      className={className ? `${className}` : "createApp-Modal"}
      title={modalTitle ? modalTitle : false}
      open={isModalVisible}
      onOk={onOk}
      wrapClassName={wrapperClassName || ""}
      onCancel={onCancel}
      footer={footer}
      width={width}
      centered={centered}
      closeIcon={closeIcon}
      getContainer={getContainer}
      closable={closable}
      loading={loading}
      afterOpenChange={afterOpenChange}
    >
      {children}
    </Modal>
  );
};

export default AppModal;