You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@superset.apache.org by hu...@apache.org on 2020/12/08 17:40:33 UTC
[incubator-superset] branch hugh/so-1119-virtual-ds-modal created
(now ef7a8d9)
This is an automated email from the ASF dual-hosted git repository.
hugh pushed a change to branch hugh/so-1119-virtual-ds-modal
in repository https://gitbox.apache.org/repos/asf/incubator-superset.git.
at ef7a8d9 add confirm overwrite modal
This branch includes the following new commits:
new ef7a8d9 add confirm overwrite modal
The 1 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails. The revisions
listed as "add" were already present in the repository and have only
been added to this reference.
[incubator-superset] 01/01: add confirm overwrite modal
Posted by hu...@apache.org.
This is an automated email from the ASF dual-hosted git repository.
hugh pushed a commit to branch hugh/so-1119-virtual-ds-modal
in repository https://gitbox.apache.org/repos/asf/incubator-superset.git
commit ef7a8d99d915126959c1f1421a6663e26e196774
Author: hughhhh <hu...@gmail.com>
AuthorDate: Tue Dec 8 09:39:52 2020 -0800
add confirm overwrite modal
---
.../src/datasource/ChangeDatasourceModal.tsx | 115 +++++++++++++--------
1 file changed, 71 insertions(+), 44 deletions(-)
diff --git a/superset-frontend/src/datasource/ChangeDatasourceModal.tsx b/superset-frontend/src/datasource/ChangeDatasourceModal.tsx
index bd3513f..44de34b 100644
--- a/superset-frontend/src/datasource/ChangeDatasourceModal.tsx
+++ b/superset-frontend/src/datasource/ChangeDatasourceModal.tsx
@@ -26,7 +26,8 @@ import React, {
import { Alert, FormControl, FormControlProps } from 'react-bootstrap';
import { SupersetClient, t } from '@superset-ui/core';
import TableView from 'src/components/TableView';
-import Modal from 'src/common/components/Modal';
+import StyledModal from 'src/common/components/Modal';
+import Button from 'src/components/Button';
import getClientErrorObject from '../utils/getClientErrorObject';
import Loading from '../components/Loading';
import withToasts from '../messageToasts/enhancers/withToasts';
@@ -63,6 +64,8 @@ const ChangeDatasourceModal: FunctionComponent<ChangeDatasourceModalProps> = ({
const [datasources, setDatasources] = useState<any>(null);
const [filter, setFilter] = useState<any>(undefined);
const [loading, setLoading] = useState(true);
+ const [confirmChange, setConfirmChange] = useState(false);
+ const [confirmedDataset, setConfirmedDataset] = useState<any>(undefined);
let searchRef = useRef<HTMLInputElement>(null);
useEffect(() => {
@@ -71,24 +74,8 @@ const ChangeDatasourceModal: FunctionComponent<ChangeDatasourceModalProps> = ({
id: number;
uid: string;
}) => {
- SupersetClient.get({
- endpoint: `/datasource/get/${datasource.type}/${datasource.id}`,
- })
- .then(({ json }) => {
- onDatasourceSave(json);
- onChange(`${datasource.id}__table`);
- })
- .catch(response => {
- getClientErrorObject(response).then(
- ({ error, message }: { error: any; message: string }) => {
- const errorMessage = error
- ? error.error || error.statusText || error
- : message;
- addDangerToast(errorMessage);
- },
- );
- });
- onHide();
+ setConfirmChange(true);
+ setConfirmedDataset(datasource);
};
const onEnterModal = () => {
@@ -152,8 +139,33 @@ const ChangeDatasourceModal: FunctionComponent<ChangeDatasourceModalProps> = ({
[datasources, filter],
);
+ const handleChangeConfirm = () => {
+ SupersetClient.get({
+ endpoint: `/datasource/get/${confirmedDataset.type}/${confirmedDataset.id}`,
+ })
+ .then(({ json }) => {
+ onDatasourceSave(json);
+ onChange(`${confirmedDataset.id}__table`);
+ })
+ .catch(response => {
+ getClientErrorObject(response).then(
+ ({ error, message }: { error: any; message: string }) => {
+ const errorMessage = error
+ ? error.error || error.statusText || error
+ : message;
+ addDangerToast(errorMessage);
+ },
+ );
+ });
+ onHide();
+ };
+
+ const handlerCancelConfirm = () => {
+ setConfirmChange(false);
+ };
+
return (
- <Modal
+ <StyledModal
show={show}
onHide={onHide}
responsive
@@ -161,32 +173,47 @@ const ChangeDatasourceModal: FunctionComponent<ChangeDatasourceModalProps> = ({
hideFooter
>
<>
- <Alert bsStyle="warning">
- <strong>{t('Warning!')}</strong> {CHANGE_WARNING_MSG}
- </Alert>
- <div>
- <FormControl
- inputRef={ref => {
- setSearchRef(ref);
- }}
- type="text"
- bsSize="sm"
- value={filter}
- placeholder={t('Search / Filter')}
- onChange={changeSearch}
- />
- </div>
- {loading && <Loading />}
- {datasources && (
- <TableView
- columns={TABLE_COLUMNS}
- data={data}
- pageSize={20}
- className="table-condensed"
- />
+ {!confirmChange && (
+ <>
+ <Alert bsStyle="warning">
+ <strong>{t('Warning!')}</strong> {CHANGE_WARNING_MSG}
+ </Alert>
+ <div>
+ <FormControl
+ inputRef={ref => {
+ setSearchRef(ref);
+ }}
+ type="text"
+ bsSize="sm"
+ value={filter}
+ placeholder={t('Search / Filter')}
+ onChange={changeSearch}
+ />
+ </div>
+
+ {loading && <Loading />}
+ {datasources && (
+ <TableView
+ columns={TABLE_COLUMNS}
+ data={data}
+ pageSize={20}
+ className="table-condensed"
+ />
+ )}
+ </>
+ )}
+ {confirmChange && (
+ <>
+ Warning! Changing the datasource may breakthe chart if metadata that
+ does not exist in the target target target datasource
+ <div>
+ <Button buttonStyle="primary" onClick={handleChangeConfirm}>Proceed</Button>
+ <Button onClick={handlerCancelConfirm}>Cancel</Button>
+ </div>
+ </>
)}
</>
- </Modal>
+ </StyledModal>
);
};