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/15 01:46:59 UTC

[incubator-superset] branch hugh/SO-1117-modal created (now 6d2a61b)

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.


      at 6d2a61b  flake8

This branch includes the following new commits:

     new fc914fd  create boiler modal component
     new bfac037  hello world modal
     new b2a8d6b  setup modal flow
     new 04e1216  setup savemodal for components
     new 6d2a61b  flake8

The 5 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] 03/05: setup modal flow

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 b2a8d6bf7cc5244ce916fe6a9a1cd8f3b41271e1
Author: hughhhh <hu...@gmail.com>
AuthorDate: Mon Nov 2 09:16:37 2020 -0800

    setup modal flow
---
 superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx b/superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx
index acdb279..b7bd1d3 100644
--- a/superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx
+++ b/superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx
@@ -24,7 +24,7 @@ import Modal from 'src/common/components/Modal';
 export const SaveDatasetModal = ({}) => {
   return (
     <Modal show onHide={() => {}} title="Save a new dataset">
-      <div>hello world</div>
+      <div>To explore the results of this query, we need to save it as a virtual dataset</div>
     </Modal>
   );
 };


[incubator-superset] 05/05: flake8

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 6d2a61b63ac7dd83dd016dc06cf629781612b4e5
Author: hughhhh <hu...@gmail.com>
AuthorDate: Sat Nov 14 17:46:06 2020 -0800

    flake8
---
 .../src/SqlLab/components/ResultSet.tsx            | 23 ++++++-
 .../src/SqlLab/components/SaveDatasetModal.tsx     | 73 +++++++++++++++++-----
 2 files changed, 78 insertions(+), 18 deletions(-)

diff --git a/superset-frontend/src/SqlLab/components/ResultSet.tsx b/superset-frontend/src/SqlLab/components/ResultSet.tsx
index 2c3e7f5..c613a0f 100644
--- a/superset-frontend/src/SqlLab/components/ResultSet.tsx
+++ b/superset-frontend/src/SqlLab/components/ResultSet.tsx
@@ -88,6 +88,7 @@ export default class ResultSet extends React.PureComponent<
       searchText: '',
       showExploreResultsButton: false,
       data: [],
+      showSaveDatasetModal: false
     };
 
     this.changeSearch = this.changeSearch.bind(this);
@@ -97,6 +98,8 @@ export default class ResultSet extends React.PureComponent<
     this.toggleExploreResultsButton = this.toggleExploreResultsButton.bind(
       this,
     );
+    this.handleSaveInDataset = this.handleSaveInDataset.bind(this);
+    this.handleHideSaveModal = this.handleHideSaveModal.bind(this);
   }
 
   componentDidMount() {
@@ -168,15 +171,30 @@ export default class ResultSet extends React.PureComponent<
     }
   }
 
+  handleSaveInDataset() {
+    console.log('Saving dataset');
+  }
+
+  handleHideSaveModal() {
+    console.log('hiding the modal');
+    this.setState({showSaveDatasetModal: false})
+  }
+
   renderControls() {
     if (this.props.search || this.props.visualize || this.props.csv) {
       let { data } = this.props.query.results;
       if (this.props.cache && this.props.query.cached) {
         ({ data } = this.state);
       }
+
+      const { showSaveDatasetModal } = this.state;
       return (
         <div className="ResultSetControls">
-          <SaveDatasetModal />
+          <SaveDatasetModal
+            visible={showSaveDatasetModal}
+            onOk={this.handleSaveInDataset}
+            onCancel={this.handleHideSaveModal}
+          />
           <div className="ResultSetButtons">
             {this.props.visualize &&
               this.props.database &&
@@ -186,6 +204,9 @@ export default class ResultSet extends React.PureComponent<
                   query={this.props.query}
                   database={this.props.database}
                   actions={this.props.actions}
+                  onClick={() => {
+                    this.setState({showSaveDatasetModal: true})
+                  }}
                 />
               )}
             {this.props.csv && (
diff --git a/superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx b/superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx
index 7085991..e052e25 100644
--- a/superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx
+++ b/superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx
@@ -17,9 +17,10 @@
  * under the License.
  */
 
-import React, { useState } from 'react';
+import React, { useState, FunctionComponent} from 'react';
 import { Radio, AutoComplete, Input } from 'src/common/components';
 import Modal from 'src/common/components/Modal';
+import Button from 'src/components/Button';
 
 const mockVal = (str, repeat = 1) => {
   return {
@@ -27,10 +28,14 @@ const mockVal = (str, repeat = 1) => {
   };
 };
 
+interface SaveDatasetModalProps = {
+}
+
 // eslint-disable-next-line no-empty-pattern
-export const SaveDatasetModal = ({}) => {
+export const SaveDatasetModal: FunctionComponent<> = ({visible, onOk, onCancel}) => {
   const [value, setValue] = useState('');
   const [options, setOptions] = useState([]);
+  const [radioOption, setRadioOptions] = useState(1);
 
   const onSearch = (searchText) => {
     setOptions(
@@ -46,23 +51,57 @@ export const SaveDatasetModal = ({}) => {
     setValue(data);
   };
 
+  const onRadioChange = e => {
+    console.log('radio checked', e.target.value);
+    setRadioOptions(e.target.value)
+  };
+
+  const radioStyle = {
+    display: 'block',
+    height: '30px',
+    lineHeight: '30px',
+  };
+
   return (
-    <Modal show onHide={() => {}} title="Save a new dataset">
+    <Modal
+      show={visible}
+      onHide={() => {}}
+      title="Save a new dataset"
+      onCancel={onCancel}
+      footer={<>
+          <Button
+            buttonSize="sm"
+            buttonStyle="primary"
+            className="m-r-5"
+            onClick={onOk}
+          >
+            Save & Explore
+        </Button>
+      </>
+    }
+    >
       <div>
-        To explore the results of this query, we need to save it as a virtual dataset
-        <Radio>Save as new dataset</Radio>
-        <Input style={{ width: 200 }} defaultValue="my_new_dataset_A" />
-        <br/>
-        <Radio>Overwrite existing dataset</Radio>
-        <AutoComplete
-          options={options}
-          style={{
-            width: 200,
-          }}
-          onSelect={onSelect}
-          onSearch={onSearch}
-          placeholder="input here"
-      />
+        <div>
+          To explore the results of this query, we need to save it as a virtual dataset
+        </div>
+        <Radio.Group onChange={onRadioChange} value={radioOption}>
+          <Radio style={radioStyle} value={1}>
+            Save as new dataset
+            <Input style={{ width: 200 }} defaultValue="my_new_dataset_A" />
+          </Radio>
+          <Radio style={radioStyle} value={2}>
+            Overwrite existing dataset
+            <AutoComplete
+              options={options}
+              style={{
+                width: 200,
+              }}
+              onSelect={onSelect}
+              onSearch={onSearch}
+              placeholder="input here"
+            />
+          </Radio>
+        </Radio.Group>
       </div>
     </Modal>
   );


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

commit bfac037e04453d44af372d9ed524fefbc2680d96
Author: hughhhh <hu...@gmail.com>
AuthorDate: Sun Nov 1 18:52:31 2020 -0800

    hello world modal
---
 superset-frontend/src/SqlLab/components/ResultSet.tsx        |  1 -
 superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx | 10 +++++++---
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/superset-frontend/src/SqlLab/components/ResultSet.tsx b/superset-frontend/src/SqlLab/components/ResultSet.tsx
index d1a2c40..2c3e7f5 100644
--- a/superset-frontend/src/SqlLab/components/ResultSet.tsx
+++ b/superset-frontend/src/SqlLab/components/ResultSet.tsx
@@ -388,7 +388,6 @@ export default class ResultSet extends React.PureComponent<
         </div>
         <div>{progressBar}</div>
         <div>{trackingUrl}</div>
-        <SaveDatasetModal />
       </div>
     );
   }
diff --git a/superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx b/superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx
index 2b27841..acdb279 100644
--- a/superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx
+++ b/superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx
@@ -20,7 +20,11 @@
 import React, { FunctionComponent } from 'react';
 import Modal from 'src/common/components/Modal';
 
-
+// eslint-disable-next-line no-empty-pattern
 export const SaveDatasetModal = ({}) => {
-    return (<div>SaveDatasetModal</div>)
-}
+  return (
+    <Modal show onHide={() => {}} title="Save a new dataset">
+      <div>hello world</div>
+    </Modal>
+  );
+};


[incubator-superset] 04/05: setup savemodal for components

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 04e12163ec2bfee8f7ca272bcffdb67ab9070edb
Author: hughhhh <hu...@gmail.com>
AuthorDate: Mon Nov 9 18:37:20 2020 -0800

    setup savemodal for components
---
 .../src/SqlLab/components/SaveDatasetModal.tsx     | 43 +++++++++++++++++++++-
 .../components/controls/preset.code-workspace      | 10 +++++
 2 files changed, 51 insertions(+), 2 deletions(-)

diff --git a/superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx b/superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx
index b7bd1d3..7085991 100644
--- a/superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx
+++ b/superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx
@@ -17,14 +17,53 @@
  * under the License.
  */
 
-import React, { FunctionComponent } from 'react';
+import React, { useState } from 'react';
+import { Radio, AutoComplete, Input } from 'src/common/components';
 import Modal from 'src/common/components/Modal';
 
+const mockVal = (str, repeat = 1) => {
+  return {
+    value: str.repeat(repeat),
+  };
+};
+
 // eslint-disable-next-line no-empty-pattern
 export const SaveDatasetModal = ({}) => {
+  const [value, setValue] = useState('');
+  const [options, setOptions] = useState([]);
+
+  const onSearch = (searchText) => {
+    setOptions(
+      !searchText ? [] : [mockVal(searchText), mockVal(searchText, 2), mockVal(searchText, 3)],
+    );
+  };
+
+  const onSelect = (data) => {
+    console.log('onSelect', data);
+  };
+
+  const onChange = (data) => {
+    setValue(data);
+  };
+
   return (
     <Modal show onHide={() => {}} title="Save a new dataset">
-      <div>To explore the results of this query, we need to save it as a virtual dataset</div>
+      <div>
+        To explore the results of this query, we need to save it as a virtual dataset
+        <Radio>Save as new dataset</Radio>
+        <Input style={{ width: 200 }} defaultValue="my_new_dataset_A" />
+        <br/>
+        <Radio>Overwrite existing dataset</Radio>
+        <AutoComplete
+          options={options}
+          style={{
+            width: 200,
+          }}
+          onSelect={onSelect}
+          onSearch={onSearch}
+          placeholder="input here"
+      />
+      </div>
     </Modal>
   );
 };
diff --git a/superset-frontend/src/explore/components/controls/preset.code-workspace b/superset-frontend/src/explore/components/controls/preset.code-workspace
new file mode 100644
index 0000000..419b3b4
--- /dev/null
+++ b/superset-frontend/src/explore/components/controls/preset.code-workspace
@@ -0,0 +1,10 @@
+{
+    "folders": [
+        {
+            "path": "../../../../.."
+        },
+        {
+            "path": "../../../../../../superset-shell"
+        }
+    ]
+}


[incubator-superset] 01/05: create boiler modal component

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 fc914fd347c77cfb3e97e7f5569cd7514d58db0b
Author: hughhhh <hu...@gmail.com>
AuthorDate: Sat Oct 31 13:33:39 2020 -0700

    create boiler modal component
---
 .../src/SqlLab/components/ResultSet.tsx            |  4 ++++
 .../src/SqlLab/components/SaveDatasetModal.tsx     | 26 ++++++++++++++++++++++
 2 files changed, 30 insertions(+)

diff --git a/superset-frontend/src/SqlLab/components/ResultSet.tsx b/superset-frontend/src/SqlLab/components/ResultSet.tsx
index f83aebb..d1a2c40 100644
--- a/superset-frontend/src/SqlLab/components/ResultSet.tsx
+++ b/superset-frontend/src/SqlLab/components/ResultSet.tsx
@@ -34,6 +34,8 @@ import { prepareCopyToClipboardTabularData } from '../../utils/common';
 import { CtasEnum } from '../actions/sqlLab';
 import { Query } from '../types';
 
+import { SaveDatasetModal } from 'src/SqlLab/components/SaveDatasetModal'
+
 const SEARCH_HEIGHT = 46;
 
 const LOADING_STYLES: CSSProperties = { position: 'relative', minHeight: 100 };
@@ -174,6 +176,7 @@ export default class ResultSet extends React.PureComponent<
       }
       return (
         <div className="ResultSetControls">
+          <SaveDatasetModal />
           <div className="ResultSetButtons">
             {this.props.visualize &&
               this.props.database &&
@@ -385,6 +388,7 @@ export default class ResultSet extends React.PureComponent<
         </div>
         <div>{progressBar}</div>
         <div>{trackingUrl}</div>
+        <SaveDatasetModal />
       </div>
     );
   }
diff --git a/superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx b/superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx
new file mode 100644
index 0000000..2b27841
--- /dev/null
+++ b/superset-frontend/src/SqlLab/components/SaveDatasetModal.tsx
@@ -0,0 +1,26 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import React, { FunctionComponent } from 'react';
+import Modal from 'src/common/components/Modal';
+
+
+export const SaveDatasetModal = ({}) => {
+    return (<div>SaveDatasetModal</div>)
+}