Make the modal not closable on outside click (#10748)

Co-authored-by: Chirag Madlani <12962843+chirag-madlani@users.noreply.github.com>
2025-12-24 14:08:45 +00:00 · 2023-03-27 12:57:59 +05:30 · 2023-03-27 12:57:59 +05:30 · c50390da80
commit c50390da80
parent f54efc649b
36 changed files with 36 additions and 2 deletions
--- a/openmetadata-ui/src/main/resources/ui/src/components/AddDataQualityTest/EditTestCaseModal.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/AddDataQualityTest/EditTestCaseModal.tsx
@ -227,6 +227,7 @@ const EditTestCaseModal: React.FC<EditTestCaseModalProps> = ({
      }}
      closable={false}
      confirmLoading={isLoadingOnSave}
+      maskClosable={false}
      okText={t('label.submit')}
      open={visible}
      title={`${t('label.edit')} ${testCase?.name}`}
--- a/openmetadata-ui/src/main/resources/ui/src/components/BotDetails/AuthMechanismForm.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/BotDetails/AuthMechanismForm.tsx
@ -680,6 +680,7 @@ const AuthMechanismForm: FC<Props> = ({
          destroyOnClose
          closable={false}
          confirmLoading={isLoading}
+          maskClosable={false}
          okText={t('label.confirm')}
          title={t('message.are-you-sure')}
          visible={isConfirmationModalOpen}
--- a/openmetadata-ui/src/main/resources/ui/src/components/EntityLineage/AddPipeLineModal.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/EntityLineage/AddPipeLineModal.tsx
@ -66,6 +66,7 @@ const AddPipeLineModal = ({
          {t('label.save')}
        </Button>,
      ]}
+      maskClosable={false}
      title={isUndefined(selectedPipelineId) ? 'Add Pipeline' : 'Edit Pipeline'}
      visible={showAddPipelineModal}
      onCancel={onModalCancel}>
--- a/openmetadata-ui/src/main/resources/ui/src/components/EntityLineage/EntityLineage.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/EntityLineage/EntityLineage.component.tsx
@ -1692,6 +1692,7 @@ const EntityLineageComponent: FunctionComponent<EntityLineageProp> = ({
      <EntityLineageSidebar newAddedNode={newAddedNode} show={isEditMode} />
      {showDeleteModal && (
        <Modal
+          maskClosable={false}
          okText={getLoadingStatusValue(
            t('label.confirm'),
            deletionState.loading,
--- a/openmetadata-ui/src/main/resources/ui/src/components/EntityLineage/LineageConfigModal.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/EntityLineage/LineageConfigModal.tsx
@ -53,6 +53,7 @@ const LineageConfigModal: React.FC<LineageConfigModalProps> = ({

  return (
    <Modal
+      maskClosable={false}
      title={t('label.lineage-config')}
      visible={visible}
      onCancel={onCancel}
--- a/openmetadata-ui/src/main/resources/ui/src/components/Explore/AdvanceSearchModal.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Explore/AdvanceSearchModal.component.tsx
@ -49,6 +49,7 @@ export const AdvancedSearchModal: FunctionComponent<Props> = ({
          </div>
        </Space>
      }
+      maskClosable={false}
      okText={t('label.submit')}
      open={visible}
      title={t('label.advanced-entity', {
--- a/openmetadata-ui/src/main/resources/ui/src/components/GlobalSearchProvider/GlobalSearchProvider.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/GlobalSearchProvider/GlobalSearchProvider.tsx
@ -92,13 +92,13 @@ const GlobalSearchProvider: FC<Props> = ({ children }: Props) => {
      <Modal
        closable
        destroyOnClose
-        maskClosable
        bodyStyle={{
          padding: '20px',
          height: searchValue ? '314px' : '85px',
        }}
        closeIcon={<></>}
        footer={null}
+        maskClosable={false}
        open={visible}
        transitionName=""
        width={650}
--- a/openmetadata-ui/src/main/resources/ui/src/components/Glossary/ExportGlossaryModal/ExportGlossaryModal.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Glossary/ExportGlossaryModal/ExportGlossaryModal.tsx
@ -76,6 +76,7 @@ const ExportGlossaryModal: FC<Props> = ({
      cancelText={t('label.cancel')}
      closable={false}
      data-testid="export-glossary-modal"
+      maskClosable={false}
      okText={t('label.export')}
      open={isModalOpen}
      title={t('label.export-glossary-terms')}
--- a/openmetadata-ui/src/main/resources/ui/src/components/Glossary/GlossaryTermTab/GlossaryTermTab.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Glossary/GlossaryTermTab/GlossaryTermTab.component.tsx
@ -397,6 +397,7 @@ const GlossaryTermTab = ({
          closable={false}
          confirmLoading={isTableLoading}
          data-testid="confirmation-modal"
+          maskClosable={false}
          okText={t('label.confirm')}
          open={isModalOpen}
          title={t('label.move-the-entity', {
--- a/openmetadata-ui/src/main/resources/ui/src/components/Modals/AnnouncementModal/AddAnnouncementModal.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Modals/AnnouncementModal/AddAnnouncementModal.tsx
@ -96,6 +96,7 @@ const AddAnnouncementModal: FC<Props> = ({
      closable={false}
      confirmLoading={isLoading}
      data-testid="add-announcement"
+      maskClosable={false}
      okButtonProps={{
        id: 'announcement-submit',
        form: 'announcement-form',
--- a/openmetadata-ui/src/main/resources/ui/src/components/Modals/AnnouncementModal/EditAnnouncementModal.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Modals/AnnouncementModal/EditAnnouncementModal.tsx
@ -76,6 +76,7 @@ const EditAnnouncementModal: FC<Props> = ({
      className="announcement-modal"
      closable={false}
      data-testid="edit-announcement"
+      maskClosable={false}
      okButtonProps={{
        form: 'announcement-form',
        type: 'primary',
--- a/openmetadata-ui/src/main/resources/ui/src/components/Modals/ConfirmationModal/ConfirmationModal.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Modals/ConfirmationModal/ConfirmationModal.tsx
@ -70,6 +70,7 @@ const ConfirmationModal = ({
          </Button>
        </div>
      }
+      maskClosable={false}
      open={visible}
      title={
        <Typography.Text
--- a/openmetadata-ui/src/main/resources/ui/src/components/Modals/DeployIngestionLoaderModal/DeployIngestionLoaderModal.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Modals/DeployIngestionLoaderModal/DeployIngestionLoaderModal.tsx
@ -40,6 +40,7 @@ const DeployIngestionLoaderModal = ({
      closable={false}
      data-testid="deploy-modal"
      footer={null}
+      maskClosable={false}
      open={visible}>
      <div className="p-y-lg d-flex flex-col" data-testid="body-text">
        <div className={classNames('ingestion-content relative', className)}>
--- a/openmetadata-ui/src/main/resources/ui/src/components/Modals/EntityDeleteModal/EntityDeleteModal.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Modals/EntityDeleteModal/EntityDeleteModal.tsx
@ -70,6 +70,7 @@ const EntityDeleteModal = ({
          </Button>
        </div>
      }
+      maskClosable={false}
      open={visible}
      title={
        <Typography.Text data-testid="modal-header">
--- a/openmetadata-ui/src/main/resources/ui/src/components/Modals/FormModal/index.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Modals/FormModal/index.tsx
@ -65,6 +65,7 @@ const FormModal = ({
          </Button>
        </Space>
      }
+      maskClosable={false}
      open={visible}
      title={
        <Typography.Text strong data-testid="header">
--- a/openmetadata-ui/src/main/resources/ui/src/components/Modals/KillIngestionPipelineModal/KillIngestionPipelineModal.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Modals/KillIngestionPipelineModal/KillIngestionPipelineModal.tsx
@ -60,6 +60,7 @@ const KillIngestionModal: FC<KillIngestionModalProps> = ({
      closable={false}
      confirmLoading={isLoading}
      data-testid="kill-modal"
+      maskClosable={false}
      okText="Confirm"
      title={`${t('label.kill')} ${pipelinName} ?`}
      visible={isModalOpen}
--- a/openmetadata-ui/src/main/resources/ui/src/components/Modals/ModalWithMarkdownEditor/ModalWithMarkdownEditor.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Modals/ModalWithMarkdownEditor/ModalWithMarkdownEditor.tsx
@ -75,6 +75,7 @@ export const ModalWithMarkdownEditor: FunctionComponent<ModalWithMarkdownEditorP
            {isLoading ? <Loader size="small" type="white" /> : t('label.save')}
          </Button>,
        ]}
+        maskClosable={false}
        open={visible}
        title={<Typography.Text data-testid="header">{header}</Typography.Text>}
        width="90%"
--- a/openmetadata-ui/src/main/resources/ui/src/components/Modals/RelatedTermsModal/RelatedTermsModal.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Modals/RelatedTermsModal/RelatedTermsModal.tsx
@ -123,6 +123,7 @@ const RelatedTermsModal = ({
          </Button>
        </div>
      }
+      maskClosable={false}
      open={visible}
      title={
        <Typography.Text strong data-testid="header">
--- a/openmetadata-ui/src/main/resources/ui/src/components/Modals/ReviewerModal/ReviewerModal.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Modals/ReviewerModal/ReviewerModal.component.tsx
@ -148,6 +148,7 @@ const ReviewerModal = ({
          </Button>
        </div>
      }
+      maskClosable={false}
      open={visible}
      title={
        <Typography.Text strong data-testid="header">
--- a/openmetadata-ui/src/main/resources/ui/src/components/Modals/SchemaModal/SchemaModal.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Modals/SchemaModal/SchemaModal.tsx
@ -31,7 +31,6 @@ const SchemaModal: FC<SchemaModalProp> = ({
    <Modal
      centered
      destroyOnClose
-      maskClosable
      className={classNames('schema-modal', className)}
      closeIcon={
        <CloseIcon
@ -41,6 +40,7 @@ const SchemaModal: FC<SchemaModalProp> = ({
      }
      data-testid="schema-modal"
      footer={null}
+      maskClosable={false}
      open={visible}
      title={
        <Typography.Text strong data-testid="schema-modal-header">
--- a/openmetadata-ui/src/main/resources/ui/src/components/Modals/TourEndModal/TourEndModal.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Modals/TourEndModal/TourEndModal.tsx
@ -31,6 +31,7 @@ const TourEndModal = ({ onSave, visible }: TourEndModalProps) => {
          {t('label.explore-now')}
        </Button>
      }
+      maskClosable={false}
      open={visible}>
      <Row className="text-center" gutter={[16, 16]}>
        <Col className="mt-4" span={24}>
--- a/openmetadata-ui/src/main/resources/ui/src/components/Modals/WhatsNewModal/index.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Modals/WhatsNewModal/index.tsx
@ -75,6 +75,7 @@ export const WhatsNewModal: FunctionComponent<WhatsNewModalProps> = ({
      }
      data-testid="whats-new-dialog"
      footer={null}
+      maskClosable={false}
      open={visible}
      title={
        <Typography.Text strong data-testid="whats-new-header">
--- a/openmetadata-ui/src/main/resources/ui/src/components/TeamDetails/TeamDetailsV1.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/TeamDetails/TeamDetailsV1.tsx
@ -1340,6 +1340,7 @@ const TeamDetailsV1 = ({
          centered
          closable={false}
          confirmLoading={isModalLoading}
+          maskClosable={false}
          okText={t('label.confirm')}
          open={!isUndefined(selectedEntity.record)}
          title={`${t('label.remove-entity', {
--- a/openmetadata-ui/src/main/resources/ui/src/components/TeamDetails/TeamHierarchy.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/TeamDetails/TeamHierarchy.tsx
@ -192,6 +192,7 @@ const TeamHierarchy: FC<TeamHierarchyProps> = ({
        closable={false}
        confirmLoading={isTableLoading}
        data-testid="confirmation-modal"
+        maskClosable={false}
        okText={t('label.confirm')}
        open={isModalOpen}
        title={t('label.move-the-entity', { entity: t('label.team') })}
--- a/openmetadata-ui/src/main/resources/ui/src/components/UserList/UserListV1.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/UserList/UserListV1.tsx
@ -309,6 +309,7 @@ const UserListV1: FC<UserListV1Props> = ({
        className="reactive-modal"
        closable={false}
        confirmLoading={isLoading}
+        maskClosable={false}
        okText={t('label.restore')}
        open={showReactiveModal}
        title={t('label.restore-entity', {
--- a/openmetadata-ui/src/main/resources/ui/src/components/Users/ChangePasswordForm.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Users/ChangePasswordForm.tsx
@ -42,6 +42,7 @@ const ChangePasswordForm: React.FC<ChangePasswordForm> = ({
      centered
      closable={false}
      confirmLoading={isLoading}
+      maskClosable={false}
      okButtonProps={{
        form: 'change-password-form',
        type: 'primary',
--- a/openmetadata-ui/src/main/resources/ui/src/components/common/DeleteWidget/DeleteWidgetModal.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/common/DeleteWidget/DeleteWidgetModal.tsx
@ -237,6 +237,7 @@ const DeleteWidgetModal = ({
      confirmLoading={isLoading}
      data-testid="delete-modal"
      footer={Footer()}
+      maskClosable={false}
      okText={t('label.delete')}
      open={visible}
      title={`${t('label.delete')} ${entityName}`}
--- a/openmetadata-ui/src/main/resources/ui/src/components/common/entityPageInfo/FollowersModal.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/common/entityPageInfo/FollowersModal.tsx
@ -61,6 +61,7 @@ const FollowersModal = ({
      centered
      destroyOnClose
      data-testid="modal-container"
+      maskClosable={false}
      open={visible}
      title={
        <Typography.Text strong data-testid="header">
--- a/openmetadata-ui/src/main/resources/ui/src/components/common/entityPageInfo/ManageButton/ManageButton.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/common/entityPageInfo/ManageButton/ManageButton.tsx
@ -255,6 +255,7 @@ const ManageButton: FC<Props> = ({
        }}
        className="reactive-modal"
        closable={false}
+        maskClosable={false}
        okText={t('label.restore')}
        open={showReactiveModal}
        title={t('label.restore-entity', {
--- a/openmetadata-ui/src/main/resources/ui/src/pages/ElasticSearchIndexPage/ElasticSearchReIndexModal.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/ElasticSearchIndexPage/ElasticSearchReIndexModal.component.tsx
@ -42,6 +42,7 @@ const ReIndexAllModal = ({
      centered
      closable={false}
      confirmLoading={confirmLoading}
+      maskClosable={false}
      okButtonProps={{
        form: 're-index-form',
        type: 'primary',
--- a/openmetadata-ui/src/main/resources/ui/src/pages/PoliciesPage/PoliciesDetailPage/PoliciesDetailPage.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/PoliciesPage/PoliciesDetailPage/PoliciesDetailPage.tsx
@ -543,6 +543,7 @@ const PoliciesDetailPage = () => {
          centered
          closable={false}
          confirmLoading={isloadingOnSave}
+          maskClosable={false}
          okText={t('label.confirm')}
          open={!isUndefined(selectedEntity.record)}
          title={`${t('label.remove-entity', {
--- a/openmetadata-ui/src/main/resources/ui/src/pages/RolesPage/AddAttributeModal/AddAttributeModal.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/RolesPage/AddAttributeModal/AddAttributeModal.tsx
@ -130,6 +130,7 @@ const AddAttributeModal: FC<Props> = ({
      closable={false}
      confirmLoading={isModalLoading}
      data-testid="modal-container"
+      maskClosable={false}
      okText="Submit"
      open={isOpen}
      title={
--- a/openmetadata-ui/src/main/resources/ui/src/pages/RolesPage/RolesDetailPage/RolesDetailPage.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/RolesPage/RolesDetailPage/RolesDetailPage.tsx
@ -359,6 +359,7 @@ const RolesDetailPage = () => {
          centered
          closable={false}
          confirmLoading={isLoadingOnSave}
+          maskClosable={false}
          okText={t('label.confirm')}
          open={!isUndefined(selectedEntity.record)}
          title={`${t('label.remove-entity', {
--- a/openmetadata-ui/src/main/resources/ui/src/pages/TasksPage/shared/CommentModal.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/TasksPage/shared/CommentModal.tsx
@ -49,6 +49,7 @@ const CommentModal: FC<CommentModalProps> = ({
      closable={false}
      confirmLoading={isLoading}
      data-testid="comment-modal"
+      maskClosable={false}
      okButtonProps={{
        disabled: !comment,
        className: 'ant-btn-primary-custom',
--- a/openmetadata-ui/src/main/resources/ui/src/pages/teams/AddTeamForm.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/teams/AddTeamForm.tsx
@ -104,6 +104,7 @@ const AddTeamForm: React.FC<AddTeamFormType> = ({
      centered
      closable={false}
      confirmLoading={isLoading}
+      maskClosable={false}
      okButtonProps={{
        form: 'add-team-form',
        type: 'primary',
--- a/openmetadata-ui/src/main/resources/ui/src/pages/teams/AddUsersModalV1.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/teams/AddUsersModalV1.tsx
@ -179,6 +179,7 @@ const AddUsersModalV1 = ({
  return (
    <Modal
      data-testid="modal-container"
+      maskClosable={false}
      okButtonProps={{
        id: 'save-button',
      }}