From 5d0d5c6b16bd5f73157cf3e26b65191cf031ece8 Mon Sep 17 00:00:00 2001 From: reesercollins <10563996+reesercollins@users.noreply.github.com> Date: Mon, 6 Jun 2022 09:09:26 -0400 Subject: [PATCH] Prevent dataset edit modal closing on click-away in edit mode --- .../src/components/Datasource/DatasourceEditor.jsx | 3 +++ .../src/components/Datasource/DatasourceModal.tsx | 3 +++ superset-frontend/src/components/Modal/Modal.tsx | 1 + 3 files changed, 7 insertions(+) diff --git a/superset-frontend/src/components/Datasource/DatasourceEditor.jsx b/superset-frontend/src/components/Datasource/DatasourceEditor.jsx index afa47ea80b984..89ddcbdb81b42 100644 --- a/superset-frontend/src/components/Datasource/DatasourceEditor.jsx +++ b/superset-frontend/src/components/Datasource/DatasourceEditor.jsx @@ -518,10 +518,12 @@ const propTypes = { onChange: PropTypes.func, addSuccessToast: PropTypes.func.isRequired, addDangerToast: PropTypes.func.isRequired, + setIsEditing: PropTypes.func, }; const defaultProps = { onChange: () => {}, + setIsEditing: () => {}, }; function OwnersSelector({ datasource, onChange }) { @@ -629,6 +631,7 @@ class DatasourceEditor extends React.PureComponent { } onChangeEditMode() { + this.props.setIsEditing(!this.state.isEditMode); this.setState(prevState => ({ isEditMode: !prevState.isEditMode })); } diff --git a/superset-frontend/src/components/Datasource/DatasourceModal.tsx b/superset-frontend/src/components/Datasource/DatasourceModal.tsx index 49cb7ae5a4906..98f2e561db83f 100644 --- a/superset-frontend/src/components/Datasource/DatasourceModal.tsx +++ b/superset-frontend/src/components/Datasource/DatasourceModal.tsx @@ -84,6 +84,7 @@ const DatasourceModal: FunctionComponent = ({ const [currentDatasource, setCurrentDatasource] = useState(datasource); const [errors, setErrors] = useState([]); const [isSaving, setIsSaving] = useState(false); + const [isEditing, setIsEditing] = useState(false); const dialog = useRef(null); const [modal, contextHolder] = Modal.useModal(); @@ -193,6 +194,7 @@ const DatasourceModal: FunctionComponent = ({ {currentDatasource.table_name} } + maskClosable={!isEditing} footer={ <> {showLegacyDatasourceEditor && ( @@ -246,6 +248,7 @@ const DatasourceModal: FunctionComponent = ({ height={500} datasource={currentDatasource} onChange={onDatasourceChange} + setIsEditing={setIsEditing} /> {contextHolder} diff --git a/superset-frontend/src/components/Modal/Modal.tsx b/superset-frontend/src/components/Modal/Modal.tsx index c6d5b3ee0aac6..3bd21fef8075f 100644 --- a/superset-frontend/src/components/Modal/Modal.tsx +++ b/superset-frontend/src/components/Modal/Modal.tsx @@ -56,6 +56,7 @@ export interface ModalProps { draggable?: boolean; draggableConfig?: DraggableProps; destroyOnClose?: boolean; + maskClosable?: boolean; } interface StyledModalProps {