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/11/19 21:25:23 UTC

[incubator-superset] branch hugh/SO-1117-modal updated (4c7364f -> 398bfee)

This is an automated email from the ASF dual-hosted git repository.

hugh pushed a change to branch hugh/SO-1117-modal
in repository https://gitbox.apache.org/repos/asf/incubator-superset.git.


    from 4c7364f  move state to upper component
     new dba206a  add overwrite state
     new 398bfee  hacked overwrite process

The 2 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.


Summary of changes:
 .../src/SqlLab/components/ResultSet.tsx            | 61 ++++++++++++++++++++--
 .../src/SqlLab/components/SaveDatasetModal.tsx     | 42 +++++++++++----
 2 files changed, 89 insertions(+), 14 deletions(-)


[incubator-superset] 01/02: add overwrite state

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-1117-modal
in repository https://gitbox.apache.org/repos/asf/incubator-superset.git

commit dba206a713bd9d55f5c4a4c98ee4ef00e6cae8aa
Author: hughhhh <hu...@gmail.com>
AuthorDate: Wed Nov 18 12:51:27 2020 -0800

    add overwrite state
---
 .../src/SqlLab/components/ResultSet.tsx            | 19 ++++++++++--
 .../src/SqlLab/components/SaveDatasetModal.tsx     | 36 +++++++++++++++++++---
 2 files changed, 47 insertions(+), 8 deletions(-)

diff --git a/superset-frontend/src/SqlLab/components/ResultSet.tsx b/superset-frontend/src/SqlLab/components/ResultSet.tsx
index 71337a6..56acb70 100644
--- a/superset-frontend/src/SqlLab/components/ResultSet.tsx
+++ b/superset-frontend/src/SqlLab/components/ResultSet.tsx
@@ -93,6 +93,7 @@ export default class ResultSet extends React.PureComponent<
       newSaveDatasetName: '',
       userDatasetsOwned: [],
       saveDatasetRadioBtnState: 1,
+      overwriteDataSet: false,
     };
 
     this.changeSearch = this.changeSearch.bind(this);
@@ -106,6 +107,7 @@ export default class ResultSet extends React.PureComponent<
     this.handleHideSaveModal = this.handleHideSaveModal.bind(this);
     this.handleDatasetNameChange = this.handleDatasetNameChange.bind(this);
     this.handleSaveDatasetRadioBtnState = this.handleSaveDatasetRadioBtnState.bind(this);
+    this.handleOverwriteCancel = this.handleOverwriteCancel.bind(this);
   }
 
   componentDidMount() {
@@ -190,6 +192,13 @@ export default class ResultSet extends React.PureComponent<
 
   handleSaveInDataset() {
     console.log('Saving dataset');
+    console.log(this.state.saveDatasetRadioBtnState)
+    if (this.state.saveDatasetRadioBtnState === 2) {
+      this.setState({overwriteDataSet: true})
+      console.log('make sure user is okay with overwriting')
+      return
+    }
+
     console.log(this.props.query);
     console.log(this.props.actions.createDatasource);
     const { schema, sql, dbId, templateParams } = this.props.query;
@@ -231,20 +240,21 @@ export default class ResultSet extends React.PureComponent<
   }
 
   handleDatasetNameChange(e) {
-    console.log(e.target.value)
     this.setState({ newSaveDatasetName: e.target.value })
   }
 
   handleHideSaveModal() {
-    console.log('hiding the modal');
     this.setState({showSaveDatasetModal: false})
   }
 
   handleSaveDatasetRadioBtnState(e) {
-    console.log(e.target.value)
     this.setState({saveDatasetRadioBtnState: e.target.value});
   }
 
+  handleOverwriteCancel() {
+    this.setState({overwriteDataSet: false})
+  }
+
   renderControls() {
     if (this.props.search || this.props.visualize || this.props.csv) {
       let { data } = this.props.query.results;
@@ -253,6 +263,7 @@ export default class ResultSet extends React.PureComponent<
       }
 
       const { showSaveDatasetModal } = this.state;
+      console.log(this.state.overwriteDataSet)
       return (
         <div className="ResultSetControls">
           <SaveDatasetModal
@@ -263,6 +274,8 @@ export default class ResultSet extends React.PureComponent<
             userDatasetsOwned={this.state.userDatasetsOwned}
             handleSaveDatasetRadioBtnState={this.handleSaveDatasetRadioBtnState}
             saveDatasetRadioBtnState={this.state.saveDatasetRadioBtnState}
+            overwriteDataSet={this.state.overwriteDataSet}
+            handleOverwriteCancel={this.handleOverwriteCancel}
           />
           <div className="ResultSetButtons">
             {this.props.visualize &&
diff --git a/superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx b/superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx
index 77016e2..4816cac 100644
--- a/superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx
+++ b/superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx
@@ -33,7 +33,7 @@ interface SaveDatasetModalProps = {
 }
 
 // eslint-disable-next-line no-empty-pattern
-export const SaveDatasetModal: FunctionComponent<> = ({visible, onOk, onCancel, handleDatasetNameChange, userDatasetsOwned, handleSaveDatasetRadioBtnState, saveDatasetRadioBtnState}) => {
+export const SaveDatasetModal: FunctionComponent<> = ({visible, onOk, onCancel, handleDatasetNameChange, userDatasetsOwned, handleSaveDatasetRadioBtnState, saveDatasetRadioBtnState, overwriteDataSet, handleOverwriteCancel}) => {
   const [options, setOptions] = useState([]);
   const [radioOption, setRadioOptions] = useState(1);
 
@@ -63,7 +63,9 @@ export const SaveDatasetModal: FunctionComponent<> = ({visible, onOk, onCancel,
       onHide={() => {}}
       title="Save a new dataset"
       onCancel={onCancel}
-      footer={<>
+      footer={
+      <>
+       {!overwriteDataSet &&
           <Button
             buttonSize="sm"
             buttonStyle="primary"
@@ -71,11 +73,29 @@ export const SaveDatasetModal: FunctionComponent<> = ({visible, onOk, onCancel,
             onClick={onOk}
           >
             Save & Explore
-        </Button>
+          </Button>
+        }
+        {overwriteDataSet && <> <Button
+            buttonSize="sm"
+            buttonStyle="danger"
+            className="m-r-5"
+            onClick={() => {
+              console.log('go back to original screen')
+              handleOverwriteCancel()
+            }}
+          >Cancel</Button>
+          <Button
+            buttonSize="sm"
+            buttonStyle="primary"
+            className="m-r-5"
+            onClick={() => {
+              console.log('overwriting dataset')
+            }}
+          >Ok</Button> </>}
       </>
     }
     >
-      <div>
+      {!overwriteDataSet && <div>
         <div>
           To explore the results of this query, we need to save it as a virtual dataset
         </div>
@@ -98,7 +118,13 @@ export const SaveDatasetModal: FunctionComponent<> = ({visible, onOk, onCancel,
             />
           </Radio>
         </Radio.Group>
-      </div>
+        </div>
+      }
+      {overwriteDataSet &&
+        <div>
+          Are you sure you want to overwrite this dataset?
+        </div>
+      }
     </Modal>
   );
 };


[incubator-superset] 02/02: hacked overwrite process

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-1117-modal
in repository https://gitbox.apache.org/repos/asf/incubator-superset.git

commit 398bfee0cabd5e9a13615cb8d40ec8ba6eca45b5
Author: hughhhh <hu...@gmail.com>
AuthorDate: Thu Nov 19 13:24:33 2020 -0800

    hacked overwrite process
---
 .../src/SqlLab/components/ResultSet.tsx            | 42 ++++++++++++++++++++++
 .../src/SqlLab/components/SaveDatasetModal.tsx     | 16 +++------
 2 files changed, 47 insertions(+), 11 deletions(-)

diff --git a/superset-frontend/src/SqlLab/components/ResultSet.tsx b/superset-frontend/src/SqlLab/components/ResultSet.tsx
index 56acb70..02f0bd7 100644
--- a/superset-frontend/src/SqlLab/components/ResultSet.tsx
+++ b/superset-frontend/src/SqlLab/components/ResultSet.tsx
@@ -94,6 +94,7 @@ export default class ResultSet extends React.PureComponent<
       userDatasetsOwned: [],
       saveDatasetRadioBtnState: 1,
       overwriteDataSet: false,
+      datasetToOverwrite: {}
     };
 
     this.changeSearch = this.changeSearch.bind(this);
@@ -108,6 +109,8 @@ export default class ResultSet extends React.PureComponent<
     this.handleDatasetNameChange = this.handleDatasetNameChange.bind(this);
     this.handleSaveDatasetRadioBtnState = this.handleSaveDatasetRadioBtnState.bind(this);
     this.handleOverwriteCancel = this.handleOverwriteCancel.bind(this);
+    this.handleOverwriteDataset = this.handleOverwriteDataset.bind(this);
+    this.handleOverwriteDatasetOption = this.handleOverwriteDatasetOption.bind(this);
   }
 
   componentDidMount() {
@@ -190,6 +193,43 @@ export default class ResultSet extends React.PureComponent<
     }
   }
 
+  handleOverwriteDatasetOption(data, option) {
+    console.log(option);
+    this.setState({ datasetToOverwrite: option })
+  }
+
+  handleOverwriteDataset() {
+    console.log('handle overwrite dataset')
+    const { sql, results } = this.props.query;
+    const { datasetToOverwrite } = this.state
+    console.log(sql)
+    console.log(results.selected_columns)
+    console.log(datasetToOverwrite)
+
+    // HACK: to clear the columns in the previous dataset and update
+    // it with the new selected columns from the query
+    SupersetClient.put({
+      endpoint: `api/v1/dataset/${datasetToOverwrite.dataSetId}`,
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({
+        columns: []
+      }),
+    }).then(d => {
+      console.log(d)
+    }).catch(err => console.log(err))
+
+    SupersetClient.put({
+      endpoint: `api/v1/dataset/${datasetToOverwrite.dataSetId}`,
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({
+        sql,
+        columns: results.selected_columns.map(d => ({column_name: d.name}))
+      }),
+    }).then(d => {
+      console.log(d)
+    }).catch(err => console.log(err))
+  }
+
   handleSaveInDataset() {
     console.log('Saving dataset');
     console.log(this.state.saveDatasetRadioBtnState)
@@ -276,6 +316,8 @@ export default class ResultSet extends React.PureComponent<
             saveDatasetRadioBtnState={this.state.saveDatasetRadioBtnState}
             overwriteDataSet={this.state.overwriteDataSet}
             handleOverwriteCancel={this.handleOverwriteCancel}
+            handleOverwriteDataset={this.handleOverwriteDataset}
+            handleOverwriteDatasetOption={this.handleOverwriteDatasetOption}
           />
           <div className="ResultSetButtons">
             {this.props.visualize &&
diff --git a/superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx b/superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx
index 4816cac..7f9ce1d 100644
--- a/superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx
+++ b/superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx
@@ -33,13 +33,14 @@ interface SaveDatasetModalProps = {
 }
 
 // eslint-disable-next-line no-empty-pattern
-export const SaveDatasetModal: FunctionComponent<> = ({visible, onOk, onCancel, handleDatasetNameChange, userDatasetsOwned, handleSaveDatasetRadioBtnState, saveDatasetRadioBtnState, overwriteDataSet, handleOverwriteCancel}) => {
+export const SaveDatasetModal: FunctionComponent<> = ({visible, onOk, onCancel, handleDatasetNameChange, userDatasetsOwned, handleSaveDatasetRadioBtnState, saveDatasetRadioBtnState, overwriteDataSet, handleOverwriteCancel, handleOverwriteDataset, handleOverwriteDatasetOption}) => {
   const [options, setOptions] = useState([]);
   const [radioOption, setRadioOptions] = useState(1);
 
   const onSearch = (searchText) => {
+    console.log(userDatasetsOwned)
     setOptions(
-      !searchText ? [] : userDatasetsOwned.map(d => ({value: d.dataSetName})),
+      !searchText ? [] : userDatasetsOwned.map(d => ({value: d.dataSetName, dataSetId: d.dataSetId})),
     );
   };
 
@@ -47,10 +48,6 @@ export const SaveDatasetModal: FunctionComponent<> = ({visible, onOk, onCancel,
     return option.value.includes(inputValue)
   }
 
-  const onSelect = (data) => {
-    console.log('onSelect', data);
-  };
-
   const radioStyle = {
     display: 'block',
     height: '30px',
@@ -80,7 +77,6 @@ export const SaveDatasetModal: FunctionComponent<> = ({visible, onOk, onCancel,
             buttonStyle="danger"
             className="m-r-5"
             onClick={() => {
-              console.log('go back to original screen')
               handleOverwriteCancel()
             }}
           >Cancel</Button>
@@ -88,9 +84,7 @@ export const SaveDatasetModal: FunctionComponent<> = ({visible, onOk, onCancel,
             buttonSize="sm"
             buttonStyle="primary"
             className="m-r-5"
-            onClick={() => {
-              console.log('overwriting dataset')
-            }}
+            onClick={handleOverwriteDataset}
           >Ok</Button> </>}
       </>
     }
@@ -111,7 +105,7 @@ export const SaveDatasetModal: FunctionComponent<> = ({visible, onOk, onCancel,
               style={{
                 width: 200,
               }}
-              onSelect={onSelect}
+              onSelect={handleOverwriteDatasetOption}
               onSearch={onSearch}
               placeholder="input here"
               filterOption={filterAutocompleteOption}