You are viewing a plain text version of this content. The canonical link for it is here.
Posted to notifications@superset.apache.org by GitBox <gi...@apache.org> on 2020/06/18 22:47:22 UTC

[GitHub] [incubator-superset] lilykuang opened a new pull request #10104: implemented dataset save modal

lilykuang opened a new pull request #10104:
URL: https://github.com/apache/incubator-superset/pull/10104


   ### SUMMARY
   <!--- Describe the change below, including rationale and design decisions -->
   
   ### BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF
   <!--- Skip this if not applicable -->
   
   ### TEST PLAN
   <!--- What steps should be taken to verify the changes -->
   
   ### ADDITIONAL INFORMATION
   <!--- Check any relevant boxes with "x" -->
   <!--- HINT: Include "Fixes #nnn" if you are fixing an existing issue -->
   - [ ] Has associated issue:
   - [ ] Changes UI
   - [ ] Requires DB Migration.
   - [ ] Confirm DB Migration upgrade and downgrade tested.
   - [ ] Introduces new feature or API
   - [ ] Removes existing feature or API
   


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org


[GitHub] [incubator-superset] etr2460 commented on a change in pull request #10104: style: dataset modal view

Posted by GitBox <gi...@apache.org>.
etr2460 commented on a change in pull request #10104:
URL: https://github.com/apache/incubator-superset/pull/10104#discussion_r444039095



##########
File path: superset-frontend/src/views/datasetList/DatasetModal.tsx
##########
@@ -0,0 +1,318 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { SupersetClient } from '@superset-ui/connection';
+import { t } from '@superset-ui/translation';
+import Icon from 'src/components/Icon';
+import Select from 'src/components/Select';
+import Modal from './Modal';
+
+import withToasts from '../../messageToasts/enhancers/withToasts';
+
+type option = {
+  label: string;
+  value: string;
+};
+
+interface Props {
+  addDangerToast: (msg: string) => void;
+  addSuccessToast: (msg: string) => void;
+  onChange: any;
+  onDatasourceSave: any;
+  onHide: any;
+  show: boolean;
+}
+
+interface State {
+  datasource: option;
+  datasources: Array<option>;
+  disableSave: boolean;
+  disableSelectSchema: boolean;
+  disableSelectTable: boolean;
+  schema: option;
+  schemaLoading: boolean;
+  schemas: Array<option>;
+  table: option;
+  tableLoading: boolean;
+  tables: Array<option>;
+}
+
+const FieldTitle = styled.p`
+  color: ${({ theme }) => theme.colors.secondary.light2};
+  font-size: ${({ theme }) => theme.typography.sizes.s};
+  margin: 20px 0 10px 0;
+  text-transform: uppercase;
+`;
+
+const StyledIcon = styled(Icon)`
+  margin: auto 10px auto 0;
+`;
+
+class DatasetModal extends React.PureComponent<Props, State> {
+  constructor(props: Props) {
+    super(props);
+
+    this.onDatabaseChange = this.onDatabaseChange.bind(this);
+    this.onSave = this.onSave.bind(this);
+    this.onSchemaChange = this.onSchemaChange.bind(this);
+    this.onTableChange = this.onTableChange.bind(this);
+    this.renderFields = this.renderFields.bind(this);
+    this.renderTitle = this.renderTitle.bind(this);
+  }
+
+  state: State = {
+    datasource: { label: 'Select Datasource', value: 'Select Datasource' },
+    datasources: [],
+    disableSave: true,
+    disableSelectSchema: true,
+    disableSelectTable: true,
+    schema: { label: 'Select Schema', value: 'Select Schema' },
+    schemaLoading: false,
+    schemas: [],
+    table: { label: 'Select Table', value: 'Select Table' },
+    tableLoading: false,
+    tables: [],
+  };
+
+  componentDidMount() {
+    this.fetchDatabase();
+  }
+
+  onDatabaseChange(datasource: option) {
+    this.setState({
+      disableSave: true,
+      disableSelectSchema: true,
+      disableSelectTable: true,
+      schemas: [],
+      tables: [],
+    });
+    this.fetchSchemas(`${datasource.value}`);
+    this.setState({
+      datasource,
+      schema: { label: 'Select Schema', value: 'Select Schema' },
+      table: { label: 'Select Table', value: 'Select Table' },
+    });
+  }
+
+  onSchemaChange(schema: option) {
+    this.setState({ tables: [], disableSelectTable: true, disableSave: true });
+    this.fetchTables(`${schema.value}`);
+    this.setState({ schema });
+  }
+
+  onTableChange(table: option) {
+    const { disableSelectSchema, disableSelectTable } = this.state;
+    const disableSave = disableSelectSchema || disableSelectTable;
+    this.setState({ table, disableSave });
+  }
+
+  onSave() {
+    const { datasource, schema, table } = this.state;
+    const { onHide, addSuccessToast, addDangerToast } = this.props;
+    const data = {
+      database: datasource.value,
+      schema: schema.value,
+      table_name: table.label,
+    };
+
+    SupersetClient.post({
+      endpoint: '/api/v1/dataset/',
+      body: JSON.stringify(data),
+      headers: { 'Content-Type': 'application/json' },
+      parseMethod: 'text',
+    })
+      .then(() => {
+        addSuccessToast(t('The dataset has been saved'));
+        onHide();
+      })
+      .catch(e => {
+        addDangerToast(t('Error while saving dataset'));
+        if (e) {
+          console.error(e);
+        }
+      });
+  }
+
+  fetchDatabase() {
+    SupersetClient.get({
+      endpoint: `/api/v1/dataset/related/database`,
+    })
+      .then(({ json: datasourcesJson = {} }) => {
+        const datasources = datasourcesJson.result.map(
+          ({ text, value }: { text: string; value: number }) => ({
+            label: text,
+            value: `${value}`,
+          }),
+        );
+        this.setState({ datasources });
+      })
+      .catch(e => {
+        this.props.addDangerToast(
+          t('An error occurred while fetching datasources'),
+        );
+        if (e) {
+          console.error(e);
+        }
+      });
+  }
+
+  fetchSchemas(datasourceId: string) {
+    if (datasourceId) {
+      this.setState({ schemaLoading: true });
+      const endpoint = `/superset/schemas/${datasourceId}/false/`;
+      SupersetClient.get({ endpoint })
+        .then(({ json: schemaJson = {} }) => {
+          const schemas = schemaJson.schemas.map((s: string) => ({
+            value: s,
+            label: s,
+          }));
+          this.setState({
+            disableSelectSchema: false,
+            schemaLoading: false,
+            schemas,
+          });
+        })
+        .catch(e => {
+          this.setState({ schemaLoading: false, schemas: [] });
+          this.props.addDangerToast(t('Error while fetching schema list'));
+          if (e) {
+            console.error(e);
+          }
+        });
+    }
+  }
+
+  fetchTables(schema: string) {
+    const { datasource } = this.state;
+
+    if (datasource && schema) {
+      this.setState(() => ({ tableLoading: true, tables: [] }));
+      const endpoint = encodeURI(
+        `/superset/tables/${datasource.value}/` +
+          `${encodeURIComponent(schema)}/undefined/false/`,
+      );
+      SupersetClient.get({ endpoint })
+        .then(({ json: tableJson = {} }) => {
+          const options = tableJson.options.map((o: option) => ({
+            value: o.value,
+            label: o.label,
+          }));
+          this.setState(() => ({
+            disableSelectTable: false,
+            tableLoading: false,
+            tables: options,
+          }));
+        })
+        .catch(e => {
+          this.setState(() => ({ tableLoading: false, tables: [] }));
+          this.props.addDangerToast(t('Error while fetching table list'));
+          if (e) {
+            console.error(e);
+          }
+        });
+    }
+  }
+
+  renderFields() {
+    const {
+      datasource,
+      datasources,
+      disableSelectSchema,
+      disableSelectTable,
+      schema,
+      schemaLoading,
+      schemas,
+      table,
+      tableLoading,
+      tables,
+    } = this.state;
+    const { onDatabaseChange, onSchemaChange, onTableChange } = this;

Review comment:
       I'm sorry, I don't think I was completely clear here. I was referring to object destructuring `this` specifically. I think it's preferred for `props` and `state`, but I've never seen it for `this` before.




----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org


[GitHub] [incubator-superset] mistercrunch commented on pull request #10104: style: dataset modal view

Posted by GitBox <gi...@apache.org>.
mistercrunch commented on pull request #10104:
URL: https://github.com/apache/incubator-superset/pull/10104#issuecomment-647695586


   The `formMode` prop is a bit funky, but a way to keeps things DRY.


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org


[GitHub] [incubator-superset] ktmud commented on a change in pull request #10104: style: dataset modal view

Posted by GitBox <gi...@apache.org>.
ktmud commented on a change in pull request #10104:
URL: https://github.com/apache/incubator-superset/pull/10104#discussion_r443037320



##########
File path: superset-frontend/src/views/datasetList/DatasetModal.tsx
##########
@@ -0,0 +1,318 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { SupersetClient } from '@superset-ui/connection';
+import { t } from '@superset-ui/translation';
+import Icon from 'src/components/Icon';
+import Select from 'src/components/Select';
+import Modal from './Modal';
+import withToasts from '../../messageToasts/enhancers/withToasts';
+
+type Option = {
+  label: string;
+  value: string;
+};
+
+type SelectOptions = {

Review comment:
       `interface SelectOptionsProps {`




----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org


[GitHub] [incubator-superset] ktmud commented on a change in pull request #10104: style: dataset modal view

Posted by GitBox <gi...@apache.org>.
ktmud commented on a change in pull request #10104:
URL: https://github.com/apache/incubator-superset/pull/10104#discussion_r443037320



##########
File path: superset-frontend/src/views/datasetList/DatasetModal.tsx
##########
@@ -0,0 +1,318 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { SupersetClient } from '@superset-ui/connection';
+import { t } from '@superset-ui/translation';
+import Icon from 'src/components/Icon';
+import Select from 'src/components/Select';
+import Modal from './Modal';
+import withToasts from '../../messageToasts/enhancers/withToasts';
+
+type Option = {
+  label: string;
+  value: string;
+};
+
+type SelectOptions = {

Review comment:
       `interface SelectOptionsProps {`
   
   or 
   
   ```ts
   import Select, { SupersetStyledSelectProps } from 'src/components/Select';
   
   
   type SelectOptionsProps = SupersetStyledSelectProps<Option> & { title: string }
   ```




----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org


[GitHub] [incubator-superset] lilykuang commented on a change in pull request #10104: style: dataset modal view

Posted by GitBox <gi...@apache.org>.
lilykuang commented on a change in pull request #10104:
URL: https://github.com/apache/incubator-superset/pull/10104#discussion_r444334998



##########
File path: superset-frontend/src/views/datasetList/Modal.tsx
##########
@@ -0,0 +1,97 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { Modal as BaseModal } from 'react-bootstrap';
+import { t } from '@superset-ui/translation';
+import Button from './Button';
+
+interface ModalProps {
+  children: React.ReactNode;
+  disableSave: boolean;
+  onHide: () => void;
+  onSave: () => void;
+  show: boolean;
+  title: React.ReactNode;
+}
+
+const StyledModal = styled(BaseModal)`
+  .modal-content {
+    border-radius: ${({ theme }) => theme.borderRadius}px;
+  }
+`;

Review comment:
       I have moved all css to `Modal` component




----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org


[GitHub] [incubator-superset] lilykuang commented on pull request #10104: style: dataset modal view

Posted by GitBox <gi...@apache.org>.
lilykuang commented on pull request #10104:
URL: https://github.com/apache/incubator-superset/pull/10104#issuecomment-647689760


   @mistercrunch I updated datasetModal to reuse `<TableSelector>`. `formMode` flag was added to keep both cartel modal style and datasource sidebar style. 


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org


[GitHub] [incubator-superset] mistercrunch commented on a change in pull request #10104: style: dataset modal view

Posted by GitBox <gi...@apache.org>.
mistercrunch commented on a change in pull request #10104:
URL: https://github.com/apache/incubator-superset/pull/10104#discussion_r443931780



##########
File path: superset-frontend/src/views/datasetList/Modal.tsx
##########
@@ -0,0 +1,124 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { Modal as BaseModal } from 'react-bootstrap';
+import { t } from '@superset-ui/translation';
+import Button from 'src/components/Button';
+
+interface ModalProps {
+  children: React.ReactNode;
+  disableSave: boolean;
+  onHide: () => void;
+  onSave: () => void;
+  show: boolean;
+  title: React.ReactNode;
+}
+
+const StyledButton = styled(Button)`

Review comment:
       That doesn't seem right. It seems like the style for a button should not be defined in the Modal that contains it. Can't we just use a `<Button/>`?




----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org


[GitHub] [incubator-superset] codecov-commenter edited a comment on pull request #10104: style: dataset modal view

Posted by GitBox <gi...@apache.org>.
codecov-commenter edited a comment on pull request #10104:
URL: https://github.com/apache/incubator-superset/pull/10104#issuecomment-648258819


   # [Codecov](https://codecov.io/gh/apache/incubator-superset/pull/10104?src=pr&el=h1) Report
   > Merging [#10104](https://codecov.io/gh/apache/incubator-superset/pull/10104?src=pr&el=desc) into [master](https://codecov.io/gh/apache/incubator-superset/commit/a6390afb8972f315a0e5c87e618e21708e596f36&el=desc) will **increase** coverage by `4.41%`.
   > The diff coverage is `n/a`.
   
   [![Impacted file tree graph](https://codecov.io/gh/apache/incubator-superset/pull/10104/graphs/tree.svg?width=650&height=150&src=pr&token=KsB0fHcx6l)](https://codecov.io/gh/apache/incubator-superset/pull/10104?src=pr&el=tree)
   
   ```diff
   @@            Coverage Diff             @@
   ##           master   #10104      +/-   ##
   ==========================================
   + Coverage   65.79%   70.21%   +4.41%     
   ==========================================
     Files         590      190     -400     
     Lines       31152    18255   -12897     
     Branches     3169        0    -3169     
   ==========================================
   - Hits        20497    12818    -7679     
   + Misses      10477     5437    -5040     
   + Partials      178        0     -178     
   ```
   
   | Flag | Coverage Δ | |
   |---|---|---|
   | #javascript | `?` | |
   | #python | `70.21% <ø> (+0.01%)` | :arrow_up: |
   
   | [Impacted Files](https://codecov.io/gh/apache/incubator-superset/pull/10104?src=pr&el=tree) | Coverage Δ | |
   |---|---|---|
   | [superset/db\_engine\_specs/postgres.py](https://codecov.io/gh/apache/incubator-superset/pull/10104/diff?src=pr&el=tree#diff-c3VwZXJzZXQvZGJfZW5naW5lX3NwZWNzL3Bvc3RncmVzLnB5) | `97.29% <0.00%> (-2.71%)` | :arrow_down: |
   | [superset/security/manager.py](https://codecov.io/gh/apache/incubator-superset/pull/10104/diff?src=pr&el=tree#diff-c3VwZXJzZXQvc2VjdXJpdHkvbWFuYWdlci5weQ==) | `88.77% <0.00%> (-0.27%)` | :arrow_down: |
   | [superset/sql\_parse.py](https://codecov.io/gh/apache/incubator-superset/pull/10104/diff?src=pr&el=tree#diff-c3VwZXJzZXQvc3FsX3BhcnNlLnB5) | `99.28% <0.00%> (-0.01%)` | :arrow_down: |
   | [superset/errors.py](https://codecov.io/gh/apache/incubator-superset/pull/10104/diff?src=pr&el=tree#diff-c3VwZXJzZXQvZXJyb3JzLnB5) | `100.00% <0.00%> (ø)` | |
   | [superset/viz\_sip38.py](https://codecov.io/gh/apache/incubator-superset/pull/10104/diff?src=pr&el=tree#diff-c3VwZXJzZXQvdml6X3NpcDM4LnB5) | `0.00% <0.00%> (ø)` | |
   | [superset/datasets/api.py](https://codecov.io/gh/apache/incubator-superset/pull/10104/diff?src=pr&el=tree#diff-c3VwZXJzZXQvZGF0YXNldHMvYXBpLnB5) | `92.56% <0.00%> (ø)` | |
   | [superset/connectors/sqla/models.py](https://codecov.io/gh/apache/incubator-superset/pull/10104/diff?src=pr&el=tree#diff-c3VwZXJzZXQvY29ubmVjdG9ycy9zcWxhL21vZGVscy5weQ==) | `88.97% <0.00%> (ø)` | |
   | [...nd/src/dashboard/containers/DashboardComponent.jsx](https://codecov.io/gh/apache/incubator-superset/pull/10104/diff?src=pr&el=tree#diff-c3VwZXJzZXQtZnJvbnRlbmQvc3JjL2Rhc2hib2FyZC9jb250YWluZXJzL0Rhc2hib2FyZENvbXBvbmVudC5qc3g=) | | |
   | [...set-frontend/src/dashboard/util/injectCustomCss.js](https://codecov.io/gh/apache/incubator-superset/pull/10104/diff?src=pr&el=tree#diff-c3VwZXJzZXQtZnJvbnRlbmQvc3JjL2Rhc2hib2FyZC91dGlsL2luamVjdEN1c3RvbUNzcy5qcw==) | | |
   | [...src/dashboard/components/filterscope/treeIcons.jsx](https://codecov.io/gh/apache/incubator-superset/pull/10104/diff?src=pr&el=tree#diff-c3VwZXJzZXQtZnJvbnRlbmQvc3JjL2Rhc2hib2FyZC9jb21wb25lbnRzL2ZpbHRlcnNjb3BlL3RyZWVJY29ucy5qc3g=) | | |
   | ... and [394 more](https://codecov.io/gh/apache/incubator-superset/pull/10104/diff?src=pr&el=tree-more) | |
   
   ------
   
   [Continue to review full report at Codecov](https://codecov.io/gh/apache/incubator-superset/pull/10104?src=pr&el=continue).
   > **Legend** - [Click here to learn more](https://docs.codecov.io/docs/codecov-delta)
   > `Δ = absolute <relative> (impact)`, `ø = not affected`, `? = missing data`
   > Powered by [Codecov](https://codecov.io/gh/apache/incubator-superset/pull/10104?src=pr&el=footer). Last update [a6390af...aca9a8e](https://codecov.io/gh/apache/incubator-superset/pull/10104?src=pr&el=lastupdated). Read the [comment docs](https://docs.codecov.io/docs/pull-request-comments).
   


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org


[GitHub] [incubator-superset] ktmud commented on a change in pull request #10104: style: dataset modal view

Posted by GitBox <gi...@apache.org>.
ktmud commented on a change in pull request #10104:
URL: https://github.com/apache/incubator-superset/pull/10104#discussion_r442657777



##########
File path: superset-frontend/src/views/datasetList/Button.tsx
##########
@@ -0,0 +1,64 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import BaseButton from 'src/components/Button';
+
+type Button = 'default' | 'primary' | 'secondary';
+
+interface Props {
+  bsStyle: Button;
+  disabled?: boolean;
+  onClick: (...args: any[]) => any;
+  title: string | React.ReactNode;
+}
+
+const StyledButton = styled(BaseButton)`
+  border: none;
+  border-radius: ${({ theme }) => theme.borderRadius}px;
+  padding: 8px;
+  text-transform: uppercase;
+  width: 160px;
+  &.btn[disabled],
+  &.btn[disabled]:hover {
+    background-color: ${({ theme }) => theme.colors.grayscale.light2};
+    color: ${({ theme }) => theme.colors.grayscale.light1};
+  }
+  &.btn-primary,
+  &.btn-primary:hover {
+    background-color: ${({ theme }) => theme.colors.primary.base};
+  }
+  &.btn-secondary {
+    background-color: ${({ theme }) => theme.colors.primary.light4};
+    color: ${({ theme }) => theme.colors.primary.base};
+  }
+`;

Review comment:
       At this point I don't think we consider `BaseButton` from Bootstrap a reusable candidate for SIP-34. It's more like a foundation we have to build upon which may or may not be replaced in the future.




----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org


[GitHub] [incubator-superset] nytai merged pull request #10104: feat: dataset add modal

Posted by GitBox <gi...@apache.org>.
nytai merged pull request #10104:
URL: https://github.com/apache/incubator-superset/pull/10104


   


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org


[GitHub] [incubator-superset] etr2460 commented on a change in pull request #10104: style: dataset modal view

Posted by GitBox <gi...@apache.org>.
etr2460 commented on a change in pull request #10104:
URL: https://github.com/apache/incubator-superset/pull/10104#discussion_r442655898



##########
File path: superset-frontend/src/views/datasetList/Button.tsx
##########
@@ -0,0 +1,64 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import BaseButton from 'src/components/Button';
+
+type Button = 'default' | 'primary' | 'secondary';
+
+interface Props {
+  bsStyle: Button;
+  disabled?: boolean;
+  onClick: (...args: any[]) => any;
+  title: string | React.ReactNode;
+}
+
+const StyledButton = styled(BaseButton)`
+  border: none;
+  border-radius: ${({ theme }) => theme.borderRadius}px;
+  padding: 8px;
+  text-transform: uppercase;
+  width: 160px;
+  &.btn[disabled],
+  &.btn[disabled]:hover {
+    background-color: ${({ theme }) => theme.colors.grayscale.light2};
+    color: ${({ theme }) => theme.colors.grayscale.light1};
+  }
+  &.btn-primary,
+  &.btn-primary:hover {
+    background-color: ${({ theme }) => theme.colors.primary.base};
+  }
+  &.btn-secondary {
+    background-color: ${({ theme }) => theme.colors.primary.light4};
+    color: ${({ theme }) => theme.colors.primary.base};
+  }
+`;

Review comment:
       I was considering commenting on this myself, but looking closer, it seemed like some widths and such were hard coded here, so i'm not sure it's a good candidate for a generalized button. Also it does wrap the BaseButton from the components directory, so i'm not sure if it's needed to pull out more broadly. That said, if it makes sense, i totally agree in pulling it out to be reused in other places




----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org


[GitHub] [incubator-superset] mistercrunch commented on pull request #10104: style: dataset modal view

Posted by GitBox <gi...@apache.org>.
mistercrunch commented on pull request #10104:
URL: https://github.com/apache/incubator-superset/pull/10104#issuecomment-647048156


   I wanted to point to the similarity with `<TableSelector/>` that is used in SQL Lab left pane and in the current Datasource editor. Eventually I think we'll want a single components for all 3 contexts.
   
   <img width="530" alt="Screen Shot 2020-06-20 at 2 33 52 PM" src="https://user-images.githubusercontent.com/487433/85211980-1792ec80-b303-11ea-89a7-6dc0c4a8a952.png">
   <img width="427" alt="Screen Shot 2020-06-20 at 2 33 16 PM" src="https://user-images.githubusercontent.com/487433/85211982-195cb000-b303-11ea-8fc5-c57e87c7c816.png">
   
   Let's make sure we don't end up with twice the components and twice the endpoints as we rebuild things.
   
   We should talk about how to approach the `<TableEditor/>`. It's fairly complex and quite a bit of work went in the current one. Also note that we haven't fully deprecated the FAB CRUD there too, let's not add a 3rd implementation of the same thing.


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org


[GitHub] [incubator-superset] ktmud commented on a change in pull request #10104: style: dataset modal view

Posted by GitBox <gi...@apache.org>.
ktmud commented on a change in pull request #10104:
URL: https://github.com/apache/incubator-superset/pull/10104#discussion_r444056177



##########
File path: superset-frontend/src/views/datasetList/Modal.tsx
##########
@@ -0,0 +1,97 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { Modal as BaseModal } from 'react-bootstrap';
+import { t } from '@superset-ui/translation';
+import Button from './Button';
+
+interface ModalProps {
+  children: React.ReactNode;
+  disableSave: boolean;
+  onHide: () => void;
+  onSave: () => void;
+  show: boolean;
+  title: React.ReactNode;
+}
+
+const StyledModal = styled(BaseModal)`
+  .modal-content {
+    border-radius: ${({ theme }) => theme.borderRadius}px;
+  }
+`;

Review comment:
       Can we use cascading styles in one root component instead of multiple styled modules? You are referencing bootstrap class names anyway. I made an argument about this earlier: https://github.com/apache-superset/superset-ui/pull/556#discussion_r434262576
   
   This seems like another reason to not use custom components from `react-boostrap` (which is just fancy css class name builders).
   
   @mistercrunch @rusackas @kristw in regard to the future of `react-boostrap`, if we really want to migrate away from it, I propose we start limiting its use to interaction-rich components only (modal, tooltip, etc); for pure CSS components, it's probably better to just use plain bootstrap classnames or create new self-contained styled components.




----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org


[GitHub] [incubator-superset] ktmud commented on a change in pull request #10104: style: dataset modal view

Posted by GitBox <gi...@apache.org>.
ktmud commented on a change in pull request #10104:
URL: https://github.com/apache/incubator-superset/pull/10104#discussion_r442646425



##########
File path: superset-frontend/src/views/datasetList/Button.tsx
##########
@@ -0,0 +1,64 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import BaseButton from 'src/components/Button';
+
+type Button = 'default' | 'primary' | 'secondary';
+
+interface Props {

Review comment:
       nit: name this `ButtonProps`.
   
   Related: https://github.com/apache-superset/superset-ui/pull/586

##########
File path: superset-frontend/src/views/datasetList/DatasetModal.tsx
##########
@@ -0,0 +1,318 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { SupersetClient } from '@superset-ui/connection';
+import { t } from '@superset-ui/translation';
+import Icon from 'src/components/Icon';
+import Select from 'src/components/Select';
+import Modal from './Modal';
+
+import withToasts from '../../messageToasts/enhancers/withToasts';
+
+type option = {
+  label: string;
+  value: string;
+};
+
+interface Props {
+  addDangerToast: (msg: string) => void;
+  addSuccessToast: (msg: string) => void;
+  onChange: any;
+  onDatasourceSave: any;
+  onHide: any;
+  show: boolean;
+}
+
+interface State {

Review comment:
       `DatasetModalProps` and `DatasetModalState`

##########
File path: superset-frontend/src/views/datasetList/DatasetModal.tsx
##########
@@ -0,0 +1,318 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { SupersetClient } from '@superset-ui/connection';
+import { t } from '@superset-ui/translation';
+import Icon from 'src/components/Icon';
+import Select from 'src/components/Select';
+import Modal from './Modal';
+
+import withToasts from '../../messageToasts/enhancers/withToasts';
+
+type option = {
+  label: string;
+  value: string;
+};
+
+interface Props {
+  addDangerToast: (msg: string) => void;
+  addSuccessToast: (msg: string) => void;
+  onChange: any;
+  onDatasourceSave: any;
+  onHide: any;

Review comment:
       ++ to what @etr2460 said. TypeScript will actually start complaining about explicit anys at some point. They already emit warnings in `superset-ui`.

##########
File path: superset-frontend/src/views/datasetList/Button.tsx
##########
@@ -0,0 +1,64 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import BaseButton from 'src/components/Button';
+
+type Button = 'default' | 'primary' | 'secondary';
+
+interface Props {
+  bsStyle: Button;
+  disabled?: boolean;
+  onClick: (...args: any[]) => any;
+  title: string | React.ReactNode;
+}
+
+const StyledButton = styled(BaseButton)`
+  border: none;
+  border-radius: ${({ theme }) => theme.borderRadius}px;
+  padding: 8px;
+  text-transform: uppercase;
+  width: 160px;
+  &.btn[disabled],
+  &.btn[disabled]:hover {
+    background-color: ${({ theme }) => theme.colors.grayscale.light2};
+    color: ${({ theme }) => theme.colors.grayscale.light1};
+  }
+  &.btn-primary,
+  &.btn-primary:hover {
+    background-color: ${({ theme }) => theme.colors.primary.base};
+  }
+  &.btn-secondary {
+    background-color: ${({ theme }) => theme.colors.primary.light4};
+    color: ${({ theme }) => theme.colors.primary.base};
+  }
+`;

Review comment:
       Maybe move this whole file to something like `src/components/SIP-34/Button.tsx` so we can slowly build a shared library of all SIP-34 related UI components.
   
   @rusackas @mistercrunch  thoughts?

##########
File path: superset-frontend/src/views/datasetList/Modal.tsx
##########
@@ -0,0 +1,102 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { Modal as BaseModal } from 'react-bootstrap';
+import { t } from '@superset-ui/translation';
+import Button from './Button';
+
+type Callback = (...args: any[]) => void;

Review comment:
       I'd say maybe make each callback more explicit instead... For example, here it could be 
   
   ```ts
   interface ModalProps {
     ...
     onHide: BaseModal['onHide'] | Button['onClick'];
     onSave: Button['onClick'];
     ...
   }
   ```
   
   or if we don't actually want to pass any arguments to the callback, name it
   
   ```ts
   type EmptyCallback = () => void;
   ```
   
   and update component accordingly
   
   ```ts
   export default function Modal({
     children,
     disableSave,
     onHide,
     onSave,
     show,
     title,
   }: Props) {
     const onHideHandler = useCallback(() => if (onHide) onHide(), [onHide]);
     const onSaveHandler = useCallback(() => if (onSave) onSave(), [onSave]);
     return (
       <StyledModal show={show} onHide={onHideHandler} bsSize="lg">
         <StyledModalHeader closeButton>
           <BaseModal.Title>
             <Title>{title}</Title>
           </BaseModal.Title>
         </StyledModalHeader>
         <StyledModalBody>{children}</StyledModalBody>
         <StyledModalFooter>
           <span className="float-right">
             <Button title={t('Cancel')} bsStyle="secondary" onClick={onHideHandler} />
             <Button
               bsStyle="primary"
               disabled={disableSave}
               onClick={onSaveHandler}
               title={t('Add')}
             />
           </span>
         </StyledModalFooter>
       </StyledModal>
     );
   }
   ```
   




----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org


[GitHub] [incubator-superset] etr2460 commented on a change in pull request #10104: style: dataset modal view

Posted by GitBox <gi...@apache.org>.
etr2460 commented on a change in pull request #10104:
URL: https://github.com/apache/incubator-superset/pull/10104#discussion_r442638490



##########
File path: superset-frontend/src/components/Icon.tsx
##########
@@ -18,19 +18,20 @@
  */
 import React, { SVGProps } from 'react';
 import styled from '@superset-ui/style';
-import { ReactComponent as CheckboxOnIcon } from 'images/icons/checkbox-on.svg';
-import { ReactComponent as CheckboxOffIcon } from 'images/icons/checkbox-off.svg';
+import { ReactComponent as CancelXIcon } from 'images/icons/cancel-x.svg';
 import { ReactComponent as CheckboxHalfIcon } from 'images/icons/checkbox-half.svg';
-import { ReactComponent as SortIcon } from 'images/icons/sort.svg';
-import { ReactComponent as SortDescIcon } from 'images/icons/sort-desc.svg';
-import { ReactComponent as SortAscIcon } from 'images/icons/sort-asc.svg';
-import { ReactComponent as TrashIcon } from 'images/icons/trash.svg';
-import { ReactComponent as PencilIcon } from 'images/icons/pencil.svg';
+import { ReactComponent as CheckboxOffIcon } from 'images/icons/checkbox-off.svg';
+import { ReactComponent as CheckboxOnIcon } from 'images/icons/checkbox-on.svg';
 import { ReactComponent as CompassIcon } from 'images/icons/compass.svg';
 import { ReactComponent as DatasetPhysicalIcon } from 'images/icons/dataset_physical.svg';
 import { ReactComponent as DatasetVirtualIcon } from 'images/icons/dataset_virtual.svg';
-import { ReactComponent as CancelXIcon } from 'images/icons/cancel-x.svg';
+import { ReactComponent as PencilIcon } from 'images/icons/pencil.svg';
 import { ReactComponent as SearchIcon } from 'images/icons/search.svg';
+import { ReactComponent as SortAscIcon } from 'images/icons/sort-asc.svg';
+import { ReactComponent as SortDescIcon } from 'images/icons/sort-desc.svg';
+import { ReactComponent as SortIcon } from 'images/icons/sort.svg';
+import { ReactComponent as TrashIcon } from 'images/icons/trash.svg';
+import { ReactComponent as warningIcon } from 'images/icons/warning.svg';

Review comment:
       nit: `WarningIcon`

##########
File path: superset-frontend/src/views/datasetList/DatasetModal.tsx
##########
@@ -0,0 +1,318 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { SupersetClient } from '@superset-ui/connection';
+import { t } from '@superset-ui/translation';
+import Icon from 'src/components/Icon';
+import Select from 'src/components/Select';
+import Modal from './Modal';
+
+import withToasts from '../../messageToasts/enhancers/withToasts';
+
+type option = {

Review comment:
       types are normally capitalized, so I'd prefer `Option` here. note to self that we should find a way to enforce this with eslint

##########
File path: superset-frontend/src/views/datasetList/DatasetModal.tsx
##########
@@ -0,0 +1,318 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { SupersetClient } from '@superset-ui/connection';
+import { t } from '@superset-ui/translation';
+import Icon from 'src/components/Icon';
+import Select from 'src/components/Select';
+import Modal from './Modal';
+

Review comment:
       nit, remove newline

##########
File path: superset-frontend/src/views/datasetList/Button.tsx
##########
@@ -0,0 +1,64 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import BaseButton from 'src/components/Button';
+
+type Button = 'default' | 'primary' | 'secondary';

Review comment:
       nit: name `ButtonStyle` or simply `Style`

##########
File path: superset-frontend/src/components/Menu/SubMenu.tsx
##########
@@ -72,43 +73,56 @@ interface Props {
 
 interface State {
   selectedMenu: string;
+  isModalOpen: boolean;
 }
 
 class SubMenu extends React.PureComponent<Props, State> {
   state: State = {
     selectedMenu: this.props.childs[0] && this.props.childs[0].label,
+    isModalOpen: false,
   };
 
   handleClick = (item: string) => () => {
     this.setState({ selectedMenu: item });
   };
 
+  openModal = () => {
+    this.setState({ isModalOpen: true });
+  };
+
+  closeModal = () => {

Review comment:
       should we call this `hideModal` to be consistent with the `onHide` attribute? or rename the modal's prop to `onClose`. Either one seems fine, although i slightly prefer updating the prop to `onClose` and keeping this as is

##########
File path: superset-frontend/images/icons/warning.svg
##########
@@ -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.
+-->
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="Icon / Warning (Solid)">

Review comment:
       Could you remove the ids from these fields since they're not really needed? Also, I think you can get rid of at least the outer g tag, and maybe even both of them

##########
File path: superset-frontend/src/views/datasetList/DatasetModal.tsx
##########
@@ -0,0 +1,318 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { SupersetClient } from '@superset-ui/connection';
+import { t } from '@superset-ui/translation';
+import Icon from 'src/components/Icon';
+import Select from 'src/components/Select';
+import Modal from './Modal';
+
+import withToasts from '../../messageToasts/enhancers/withToasts';
+
+type option = {
+  label: string;
+  value: string;
+};
+
+interface Props {
+  addDangerToast: (msg: string) => void;
+  addSuccessToast: (msg: string) => void;
+  onChange: any;
+  onDatasourceSave: any;
+  onHide: any;

Review comment:
       can we do better than `any` here? It looks like they're functions, so we should at least be able to say `() => unknown` i'd think. or maybe define actual arguments too.
   
   A final note, in general it's better to use `unknown` vs. `any` when you're unsure of a type, because `any` completely removes any type safety from code that uses the prop.

##########
File path: superset-frontend/src/views/datasetList/DatasetModal.tsx
##########
@@ -0,0 +1,318 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { SupersetClient } from '@superset-ui/connection';
+import { t } from '@superset-ui/translation';
+import Icon from 'src/components/Icon';
+import Select from 'src/components/Select';
+import Modal from './Modal';
+
+import withToasts from '../../messageToasts/enhancers/withToasts';
+
+type option = {
+  label: string;
+  value: string;
+};
+
+interface Props {
+  addDangerToast: (msg: string) => void;
+  addSuccessToast: (msg: string) => void;
+  onChange: any;
+  onDatasourceSave: any;
+  onHide: any;
+  show: boolean;
+}
+
+interface State {
+  datasource: option;
+  datasources: Array<option>;
+  disableSave: boolean;
+  disableSelectSchema: boolean;
+  disableSelectTable: boolean;
+  schema: option;
+  schemaLoading: boolean;

Review comment:
       naming nit: prefer `isSchemaLoading`

##########
File path: superset-frontend/src/views/datasetList/DatasetModal.tsx
##########
@@ -0,0 +1,318 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { SupersetClient } from '@superset-ui/connection';
+import { t } from '@superset-ui/translation';
+import Icon from 'src/components/Icon';
+import Select from 'src/components/Select';
+import Modal from './Modal';
+
+import withToasts from '../../messageToasts/enhancers/withToasts';
+
+type option = {
+  label: string;
+  value: string;
+};
+
+interface Props {
+  addDangerToast: (msg: string) => void;
+  addSuccessToast: (msg: string) => void;
+  onChange: any;
+  onDatasourceSave: any;
+  onHide: any;
+  show: boolean;
+}
+
+interface State {
+  datasource: option;
+  datasources: Array<option>;
+  disableSave: boolean;
+  disableSelectSchema: boolean;
+  disableSelectTable: boolean;
+  schema: option;
+  schemaLoading: boolean;
+  schemas: Array<option>;
+  table: option;
+  tableLoading: boolean;
+  tables: Array<option>;
+}
+
+const FieldTitle = styled.p`
+  color: ${({ theme }) => theme.colors.secondary.light2};
+  font-size: ${({ theme }) => theme.typography.sizes.s};
+  margin: 20px 0 10px 0;
+  text-transform: uppercase;
+`;
+
+const StyledIcon = styled(Icon)`
+  margin: auto 10px auto 0;
+`;
+
+class DatasetModal extends React.PureComponent<Props, State> {
+  constructor(props: Props) {
+    super(props);
+
+    this.onDatabaseChange = this.onDatabaseChange.bind(this);
+    this.onSave = this.onSave.bind(this);
+    this.onSchemaChange = this.onSchemaChange.bind(this);
+    this.onTableChange = this.onTableChange.bind(this);
+    this.renderFields = this.renderFields.bind(this);
+    this.renderTitle = this.renderTitle.bind(this);
+  }
+
+  state: State = {
+    datasource: { label: 'Select Datasource', value: 'Select Datasource' },
+    datasources: [],
+    disableSave: true,
+    disableSelectSchema: true,
+    disableSelectTable: true,
+    schema: { label: 'Select Schema', value: 'Select Schema' },
+    schemaLoading: false,
+    schemas: [],
+    table: { label: 'Select Table', value: 'Select Table' },
+    tableLoading: false,
+    tables: [],
+  };
+
+  componentDidMount() {
+    this.fetchDatabase();
+  }
+
+  onDatabaseChange(datasource: option) {
+    this.setState({
+      disableSave: true,
+      disableSelectSchema: true,
+      disableSelectTable: true,
+      schemas: [],
+      tables: [],
+    });
+    this.fetchSchemas(`${datasource.value}`);
+    this.setState({
+      datasource,
+      schema: { label: 'Select Schema', value: 'Select Schema' },
+      table: { label: 'Select Table', value: 'Select Table' },
+    });
+  }
+
+  onSchemaChange(schema: option) {
+    this.setState({ tables: [], disableSelectTable: true, disableSave: true });
+    this.fetchTables(`${schema.value}`);
+    this.setState({ schema });
+  }
+
+  onTableChange(table: option) {
+    const { disableSelectSchema, disableSelectTable } = this.state;
+    const disableSave = disableSelectSchema || disableSelectTable;
+    this.setState({ table, disableSave });
+  }
+
+  onSave() {
+    const { datasource, schema, table } = this.state;
+    const { onHide, addSuccessToast, addDangerToast } = this.props;
+    const data = {
+      database: datasource.value,
+      schema: schema.value,
+      table_name: table.label,
+    };
+
+    SupersetClient.post({
+      endpoint: '/api/v1/dataset/',
+      body: JSON.stringify(data),
+      headers: { 'Content-Type': 'application/json' },
+      parseMethod: 'text',
+    })
+      .then(() => {
+        addSuccessToast(t('The dataset has been saved'));
+        onHide();
+      })
+      .catch(e => {
+        addDangerToast(t('Error while saving dataset'));
+        if (e) {
+          console.error(e);
+        }
+      });
+  }
+
+  fetchDatabase() {
+    SupersetClient.get({
+      endpoint: `/api/v1/dataset/related/database`,
+    })
+      .then(({ json: datasourcesJson = {} }) => {
+        const datasources = datasourcesJson.result.map(
+          ({ text, value }: { text: string; value: number }) => ({
+            label: text,
+            value: `${value}`,
+          }),
+        );
+        this.setState({ datasources });
+      })
+      .catch(e => {
+        this.props.addDangerToast(
+          t('An error occurred while fetching datasources'),
+        );
+        if (e) {
+          console.error(e);
+        }
+      });
+  }
+
+  fetchSchemas(datasourceId: string) {
+    if (datasourceId) {
+      this.setState({ schemaLoading: true });
+      const endpoint = `/superset/schemas/${datasourceId}/false/`;
+      SupersetClient.get({ endpoint })
+        .then(({ json: schemaJson = {} }) => {
+          const schemas = schemaJson.schemas.map((s: string) => ({

Review comment:
       maybe `schema` instead of `s`?

##########
File path: superset-frontend/src/views/datasetList/DatasetModal.tsx
##########
@@ -0,0 +1,318 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { SupersetClient } from '@superset-ui/connection';
+import { t } from '@superset-ui/translation';
+import Icon from 'src/components/Icon';
+import Select from 'src/components/Select';
+import Modal from './Modal';
+
+import withToasts from '../../messageToasts/enhancers/withToasts';
+
+type option = {
+  label: string;
+  value: string;
+};
+
+interface Props {
+  addDangerToast: (msg: string) => void;
+  addSuccessToast: (msg: string) => void;
+  onChange: any;
+  onDatasourceSave: any;
+  onHide: any;
+  show: boolean;
+}
+
+interface State {
+  datasource: option;
+  datasources: Array<option>;
+  disableSave: boolean;
+  disableSelectSchema: boolean;
+  disableSelectTable: boolean;
+  schema: option;
+  schemaLoading: boolean;
+  schemas: Array<option>;
+  table: option;
+  tableLoading: boolean;
+  tables: Array<option>;
+}
+
+const FieldTitle = styled.p`
+  color: ${({ theme }) => theme.colors.secondary.light2};
+  font-size: ${({ theme }) => theme.typography.sizes.s};
+  margin: 20px 0 10px 0;
+  text-transform: uppercase;
+`;
+
+const StyledIcon = styled(Icon)`
+  margin: auto 10px auto 0;
+`;
+
+class DatasetModal extends React.PureComponent<Props, State> {
+  constructor(props: Props) {
+    super(props);
+
+    this.onDatabaseChange = this.onDatabaseChange.bind(this);
+    this.onSave = this.onSave.bind(this);
+    this.onSchemaChange = this.onSchemaChange.bind(this);
+    this.onTableChange = this.onTableChange.bind(this);
+    this.renderFields = this.renderFields.bind(this);
+    this.renderTitle = this.renderTitle.bind(this);
+  }
+
+  state: State = {
+    datasource: { label: 'Select Datasource', value: 'Select Datasource' },
+    datasources: [],
+    disableSave: true,
+    disableSelectSchema: true,
+    disableSelectTable: true,
+    schema: { label: 'Select Schema', value: 'Select Schema' },
+    schemaLoading: false,
+    schemas: [],
+    table: { label: 'Select Table', value: 'Select Table' },
+    tableLoading: false,
+    tables: [],
+  };
+
+  componentDidMount() {
+    this.fetchDatabase();
+  }
+
+  onDatabaseChange(datasource: option) {
+    this.setState({
+      disableSave: true,
+      disableSelectSchema: true,
+      disableSelectTable: true,
+      schemas: [],
+      tables: [],
+    });
+    this.fetchSchemas(`${datasource.value}`);
+    this.setState({
+      datasource,
+      schema: { label: 'Select Schema', value: 'Select Schema' },
+      table: { label: 'Select Table', value: 'Select Table' },
+    });
+  }
+
+  onSchemaChange(schema: option) {
+    this.setState({ tables: [], disableSelectTable: true, disableSave: true });
+    this.fetchTables(`${schema.value}`);
+    this.setState({ schema });
+  }
+
+  onTableChange(table: option) {
+    const { disableSelectSchema, disableSelectTable } = this.state;
+    const disableSave = disableSelectSchema || disableSelectTable;
+    this.setState({ table, disableSave });
+  }
+
+  onSave() {
+    const { datasource, schema, table } = this.state;
+    const { onHide, addSuccessToast, addDangerToast } = this.props;
+    const data = {
+      database: datasource.value,
+      schema: schema.value,
+      table_name: table.label,
+    };
+
+    SupersetClient.post({
+      endpoint: '/api/v1/dataset/',
+      body: JSON.stringify(data),
+      headers: { 'Content-Type': 'application/json' },
+      parseMethod: 'text',
+    })
+      .then(() => {
+        addSuccessToast(t('The dataset has been saved'));
+        onHide();
+      })
+      .catch(e => {
+        addDangerToast(t('Error while saving dataset'));
+        if (e) {
+          console.error(e);
+        }
+      });
+  }
+
+  fetchDatabase() {
+    SupersetClient.get({
+      endpoint: `/api/v1/dataset/related/database`,
+    })
+      .then(({ json: datasourcesJson = {} }) => {
+        const datasources = datasourcesJson.result.map(
+          ({ text, value }: { text: string; value: number }) => ({
+            label: text,
+            value: `${value}`,
+          }),
+        );
+        this.setState({ datasources });
+      })
+      .catch(e => {
+        this.props.addDangerToast(
+          t('An error occurred while fetching datasources'),
+        );
+        if (e) {
+          console.error(e);
+        }
+      });
+  }
+
+  fetchSchemas(datasourceId: string) {
+    if (datasourceId) {
+      this.setState({ schemaLoading: true });
+      const endpoint = `/superset/schemas/${datasourceId}/false/`;
+      SupersetClient.get({ endpoint })
+        .then(({ json: schemaJson = {} }) => {
+          const schemas = schemaJson.schemas.map((s: string) => ({
+            value: s,
+            label: s,
+          }));
+          this.setState({
+            disableSelectSchema: false,
+            schemaLoading: false,
+            schemas,
+          });
+        })
+        .catch(e => {
+          this.setState({ schemaLoading: false, schemas: [] });
+          this.props.addDangerToast(t('Error while fetching schema list'));
+          if (e) {
+            console.error(e);
+          }
+        });
+    }
+  }
+
+  fetchTables(schema: string) {
+    const { datasource } = this.state;
+
+    if (datasource && schema) {
+      this.setState(() => ({ tableLoading: true, tables: [] }));
+      const endpoint = encodeURI(
+        `/superset/tables/${datasource.value}/` +
+          `${encodeURIComponent(schema)}/undefined/false/`,
+      );
+      SupersetClient.get({ endpoint })
+        .then(({ json: tableJson = {} }) => {
+          const options = tableJson.options.map((o: option) => ({

Review comment:
       you can replace `o` with `option` once you update the type name to `Option`

##########
File path: superset-frontend/src/views/datasetList/DatasetModal.tsx
##########
@@ -0,0 +1,318 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { SupersetClient } from '@superset-ui/connection';
+import { t } from '@superset-ui/translation';
+import Icon from 'src/components/Icon';
+import Select from 'src/components/Select';
+import Modal from './Modal';
+
+import withToasts from '../../messageToasts/enhancers/withToasts';
+
+type option = {
+  label: string;
+  value: string;
+};
+
+interface Props {
+  addDangerToast: (msg: string) => void;
+  addSuccessToast: (msg: string) => void;
+  onChange: any;
+  onDatasourceSave: any;
+  onHide: any;
+  show: boolean;
+}
+
+interface State {
+  datasource: option;
+  datasources: Array<option>;
+  disableSave: boolean;
+  disableSelectSchema: boolean;
+  disableSelectTable: boolean;
+  schema: option;
+  schemaLoading: boolean;
+  schemas: Array<option>;
+  table: option;
+  tableLoading: boolean;
+  tables: Array<option>;
+}
+
+const FieldTitle = styled.p`
+  color: ${({ theme }) => theme.colors.secondary.light2};
+  font-size: ${({ theme }) => theme.typography.sizes.s};
+  margin: 20px 0 10px 0;
+  text-transform: uppercase;
+`;
+
+const StyledIcon = styled(Icon)`
+  margin: auto 10px auto 0;
+`;
+
+class DatasetModal extends React.PureComponent<Props, State> {
+  constructor(props: Props) {
+    super(props);
+
+    this.onDatabaseChange = this.onDatabaseChange.bind(this);
+    this.onSave = this.onSave.bind(this);
+    this.onSchemaChange = this.onSchemaChange.bind(this);
+    this.onTableChange = this.onTableChange.bind(this);
+    this.renderFields = this.renderFields.bind(this);
+    this.renderTitle = this.renderTitle.bind(this);
+  }
+
+  state: State = {
+    datasource: { label: 'Select Datasource', value: 'Select Datasource' },
+    datasources: [],
+    disableSave: true,
+    disableSelectSchema: true,
+    disableSelectTable: true,
+    schema: { label: 'Select Schema', value: 'Select Schema' },
+    schemaLoading: false,
+    schemas: [],
+    table: { label: 'Select Table', value: 'Select Table' },
+    tableLoading: false,
+    tables: [],
+  };
+
+  componentDidMount() {
+    this.fetchDatabase();
+  }
+
+  onDatabaseChange(datasource: option) {
+    this.setState({
+      disableSave: true,
+      disableSelectSchema: true,
+      disableSelectTable: true,
+      schemas: [],
+      tables: [],
+    });
+    this.fetchSchemas(`${datasource.value}`);
+    this.setState({
+      datasource,
+      schema: { label: 'Select Schema', value: 'Select Schema' },
+      table: { label: 'Select Table', value: 'Select Table' },
+    });
+  }
+
+  onSchemaChange(schema: option) {
+    this.setState({ tables: [], disableSelectTable: true, disableSave: true });
+    this.fetchTables(`${schema.value}`);
+    this.setState({ schema });
+  }
+
+  onTableChange(table: option) {
+    const { disableSelectSchema, disableSelectTable } = this.state;
+    const disableSave = disableSelectSchema || disableSelectTable;
+    this.setState({ table, disableSave });
+  }
+
+  onSave() {
+    const { datasource, schema, table } = this.state;
+    const { onHide, addSuccessToast, addDangerToast } = this.props;
+    const data = {
+      database: datasource.value,
+      schema: schema.value,
+      table_name: table.label,
+    };
+
+    SupersetClient.post({
+      endpoint: '/api/v1/dataset/',
+      body: JSON.stringify(data),
+      headers: { 'Content-Type': 'application/json' },
+      parseMethod: 'text',
+    })
+      .then(() => {
+        addSuccessToast(t('The dataset has been saved'));
+        onHide();
+      })
+      .catch(e => {
+        addDangerToast(t('Error while saving dataset'));
+        if (e) {
+          console.error(e);
+        }
+      });
+  }
+
+  fetchDatabase() {
+    SupersetClient.get({
+      endpoint: `/api/v1/dataset/related/database`,
+    })
+      .then(({ json: datasourcesJson = {} }) => {
+        const datasources = datasourcesJson.result.map(
+          ({ text, value }: { text: string; value: number }) => ({
+            label: text,
+            value: `${value}`,
+          }),
+        );
+        this.setState({ datasources });
+      })
+      .catch(e => {
+        this.props.addDangerToast(
+          t('An error occurred while fetching datasources'),
+        );
+        if (e) {
+          console.error(e);
+        }
+      });
+  }
+
+  fetchSchemas(datasourceId: string) {
+    if (datasourceId) {
+      this.setState({ schemaLoading: true });
+      const endpoint = `/superset/schemas/${datasourceId}/false/`;
+      SupersetClient.get({ endpoint })
+        .then(({ json: schemaJson = {} }) => {
+          const schemas = schemaJson.schemas.map((s: string) => ({
+            value: s,
+            label: s,
+          }));
+          this.setState({
+            disableSelectSchema: false,
+            schemaLoading: false,
+            schemas,
+          });
+        })
+        .catch(e => {
+          this.setState({ schemaLoading: false, schemas: [] });
+          this.props.addDangerToast(t('Error while fetching schema list'));
+          if (e) {
+            console.error(e);
+          }
+        });
+    }
+  }
+
+  fetchTables(schema: string) {
+    const { datasource } = this.state;
+
+    if (datasource && schema) {
+      this.setState(() => ({ tableLoading: true, tables: [] }));
+      const endpoint = encodeURI(
+        `/superset/tables/${datasource.value}/` +
+          `${encodeURIComponent(schema)}/undefined/false/`,
+      );
+      SupersetClient.get({ endpoint })
+        .then(({ json: tableJson = {} }) => {
+          const options = tableJson.options.map((o: option) => ({
+            value: o.value,
+            label: o.label,
+          }));
+          this.setState(() => ({
+            disableSelectTable: false,
+            tableLoading: false,
+            tables: options,
+          }));
+        })
+        .catch(e => {
+          this.setState(() => ({ tableLoading: false, tables: [] }));
+          this.props.addDangerToast(t('Error while fetching table list'));
+          if (e) {
+            console.error(e);
+          }
+        });
+    }
+  }
+
+  renderFields() {
+    const {
+      datasource,
+      datasources,
+      disableSelectSchema,
+      disableSelectTable,
+      schema,
+      schemaLoading,
+      schemas,
+      table,
+      tableLoading,
+      tables,
+    } = this.state;
+    const { onDatabaseChange, onSchemaChange, onTableChange } = this;
+
+    return (
+      <>
+        <FieldTitle>{t('datasource')}</FieldTitle>
+        <Select
+          clearable={false}
+          ignoreAccents={false}
+          name="select-datasource"
+          onChange={onDatabaseChange}
+          options={datasources}
+          placeholder={t('Select Datasource')}
+          value={datasource}
+          width={500}

Review comment:
       can you pull this out into a reusable constant for all the Select components here?
   
   or possibly even better, create a const at the top of the file for all the shared select params (`clearable`, `ignoreAccents`, `width`) and then object spread it for all the components here

##########
File path: superset-frontend/src/views/datasetList/DatasetModal.tsx
##########
@@ -0,0 +1,318 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { SupersetClient } from '@superset-ui/connection';
+import { t } from '@superset-ui/translation';
+import Icon from 'src/components/Icon';
+import Select from 'src/components/Select';
+import Modal from './Modal';
+
+import withToasts from '../../messageToasts/enhancers/withToasts';
+
+type option = {
+  label: string;
+  value: string;
+};
+
+interface Props {
+  addDangerToast: (msg: string) => void;
+  addSuccessToast: (msg: string) => void;
+  onChange: any;
+  onDatasourceSave: any;
+  onHide: any;
+  show: boolean;
+}
+
+interface State {
+  datasource: option;
+  datasources: Array<option>;
+  disableSave: boolean;
+  disableSelectSchema: boolean;
+  disableSelectTable: boolean;
+  schema: option;
+  schemaLoading: boolean;
+  schemas: Array<option>;
+  table: option;
+  tableLoading: boolean;

Review comment:
       naming nit: prefer `isTableLoading`

##########
File path: superset-frontend/src/views/datasetList/Modal.tsx
##########
@@ -0,0 +1,102 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { Modal as BaseModal } from 'react-bootstrap';
+import { t } from '@superset-ui/translation';
+import Button from './Button';
+
+type Callback = (...args: any[]) => void;
+
+interface Props {
+  children: React.ReactNode;
+  disableSave: boolean;
+  onHide: Callback;
+  onSave: Callback;
+  show: boolean;
+  title: string | React.ReactNode;

Review comment:
       I believe a ReactNode already includes the `string` type, so i think you can remove that here

##########
File path: superset-frontend/src/views/datasetList/DatasetModal.tsx
##########
@@ -0,0 +1,318 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { SupersetClient } from '@superset-ui/connection';
+import { t } from '@superset-ui/translation';
+import Icon from 'src/components/Icon';
+import Select from 'src/components/Select';
+import Modal from './Modal';
+
+import withToasts from '../../messageToasts/enhancers/withToasts';
+
+type option = {
+  label: string;
+  value: string;
+};
+
+interface Props {
+  addDangerToast: (msg: string) => void;
+  addSuccessToast: (msg: string) => void;
+  onChange: any;
+  onDatasourceSave: any;
+  onHide: any;
+  show: boolean;
+}
+
+interface State {
+  datasource: option;
+  datasources: Array<option>;
+  disableSave: boolean;
+  disableSelectSchema: boolean;
+  disableSelectTable: boolean;
+  schema: option;
+  schemaLoading: boolean;
+  schemas: Array<option>;
+  table: option;
+  tableLoading: boolean;
+  tables: Array<option>;
+}
+
+const FieldTitle = styled.p`
+  color: ${({ theme }) => theme.colors.secondary.light2};
+  font-size: ${({ theme }) => theme.typography.sizes.s};
+  margin: 20px 0 10px 0;
+  text-transform: uppercase;
+`;
+
+const StyledIcon = styled(Icon)`
+  margin: auto 10px auto 0;
+`;
+
+class DatasetModal extends React.PureComponent<Props, State> {
+  constructor(props: Props) {
+    super(props);
+
+    this.onDatabaseChange = this.onDatabaseChange.bind(this);
+    this.onSave = this.onSave.bind(this);
+    this.onSchemaChange = this.onSchemaChange.bind(this);
+    this.onTableChange = this.onTableChange.bind(this);
+    this.renderFields = this.renderFields.bind(this);
+    this.renderTitle = this.renderTitle.bind(this);
+  }
+
+  state: State = {
+    datasource: { label: 'Select Datasource', value: 'Select Datasource' },
+    datasources: [],
+    disableSave: true,
+    disableSelectSchema: true,
+    disableSelectTable: true,
+    schema: { label: 'Select Schema', value: 'Select Schema' },
+    schemaLoading: false,
+    schemas: [],
+    table: { label: 'Select Table', value: 'Select Table' },
+    tableLoading: false,
+    tables: [],
+  };
+
+  componentDidMount() {
+    this.fetchDatabase();
+  }
+
+  onDatabaseChange(datasource: option) {
+    this.setState({
+      disableSave: true,
+      disableSelectSchema: true,
+      disableSelectTable: true,
+      schemas: [],
+      tables: [],
+    });
+    this.fetchSchemas(`${datasource.value}`);
+    this.setState({
+      datasource,
+      schema: { label: 'Select Schema', value: 'Select Schema' },
+      table: { label: 'Select Table', value: 'Select Table' },
+    });
+  }
+
+  onSchemaChange(schema: option) {
+    this.setState({ tables: [], disableSelectTable: true, disableSave: true });
+    this.fetchTables(`${schema.value}`);
+    this.setState({ schema });
+  }
+
+  onTableChange(table: option) {
+    const { disableSelectSchema, disableSelectTable } = this.state;
+    const disableSave = disableSelectSchema || disableSelectTable;
+    this.setState({ table, disableSave });
+  }
+
+  onSave() {
+    const { datasource, schema, table } = this.state;
+    const { onHide, addSuccessToast, addDangerToast } = this.props;
+    const data = {
+      database: datasource.value,
+      schema: schema.value,
+      table_name: table.label,
+    };
+
+    SupersetClient.post({
+      endpoint: '/api/v1/dataset/',
+      body: JSON.stringify(data),
+      headers: { 'Content-Type': 'application/json' },
+      parseMethod: 'text',
+    })
+      .then(() => {
+        addSuccessToast(t('The dataset has been saved'));
+        onHide();
+      })
+      .catch(e => {
+        addDangerToast(t('Error while saving dataset'));
+        if (e) {
+          console.error(e);
+        }
+      });
+  }
+
+  fetchDatabase() {
+    SupersetClient.get({
+      endpoint: `/api/v1/dataset/related/database`,
+    })
+      .then(({ json: datasourcesJson = {} }) => {
+        const datasources = datasourcesJson.result.map(
+          ({ text, value }: { text: string; value: number }) => ({
+            label: text,
+            value: `${value}`,
+          }),
+        );
+        this.setState({ datasources });
+      })
+      .catch(e => {
+        this.props.addDangerToast(
+          t('An error occurred while fetching datasources'),
+        );
+        if (e) {

Review comment:
       same comment about the if statement here

##########
File path: superset-frontend/src/views/datasetList/DatasetModal.tsx
##########
@@ -0,0 +1,318 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { SupersetClient } from '@superset-ui/connection';
+import { t } from '@superset-ui/translation';
+import Icon from 'src/components/Icon';
+import Select from 'src/components/Select';
+import Modal from './Modal';
+
+import withToasts from '../../messageToasts/enhancers/withToasts';
+
+type option = {
+  label: string;
+  value: string;
+};
+
+interface Props {
+  addDangerToast: (msg: string) => void;
+  addSuccessToast: (msg: string) => void;
+  onChange: any;
+  onDatasourceSave: any;
+  onHide: any;
+  show: boolean;
+}
+
+interface State {
+  datasource: option;
+  datasources: Array<option>;
+  disableSave: boolean;
+  disableSelectSchema: boolean;
+  disableSelectTable: boolean;
+  schema: option;
+  schemaLoading: boolean;
+  schemas: Array<option>;
+  table: option;
+  tableLoading: boolean;
+  tables: Array<option>;
+}
+
+const FieldTitle = styled.p`
+  color: ${({ theme }) => theme.colors.secondary.light2};
+  font-size: ${({ theme }) => theme.typography.sizes.s};
+  margin: 20px 0 10px 0;
+  text-transform: uppercase;
+`;
+
+const StyledIcon = styled(Icon)`
+  margin: auto 10px auto 0;
+`;
+
+class DatasetModal extends React.PureComponent<Props, State> {
+  constructor(props: Props) {
+    super(props);
+
+    this.onDatabaseChange = this.onDatabaseChange.bind(this);
+    this.onSave = this.onSave.bind(this);
+    this.onSchemaChange = this.onSchemaChange.bind(this);
+    this.onTableChange = this.onTableChange.bind(this);
+    this.renderFields = this.renderFields.bind(this);
+    this.renderTitle = this.renderTitle.bind(this);
+  }
+
+  state: State = {
+    datasource: { label: 'Select Datasource', value: 'Select Datasource' },
+    datasources: [],
+    disableSave: true,
+    disableSelectSchema: true,
+    disableSelectTable: true,
+    schema: { label: 'Select Schema', value: 'Select Schema' },
+    schemaLoading: false,
+    schemas: [],
+    table: { label: 'Select Table', value: 'Select Table' },
+    tableLoading: false,
+    tables: [],
+  };
+
+  componentDidMount() {
+    this.fetchDatabase();
+  }
+
+  onDatabaseChange(datasource: option) {
+    this.setState({
+      disableSave: true,
+      disableSelectSchema: true,
+      disableSelectTable: true,
+      schemas: [],
+      tables: [],
+    });
+    this.fetchSchemas(`${datasource.value}`);
+    this.setState({
+      datasource,
+      schema: { label: 'Select Schema', value: 'Select Schema' },
+      table: { label: 'Select Table', value: 'Select Table' },

Review comment:
       these labels should use `t` strings

##########
File path: superset-frontend/src/views/datasetList/DatasetModal.tsx
##########
@@ -0,0 +1,318 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { SupersetClient } from '@superset-ui/connection';
+import { t } from '@superset-ui/translation';
+import Icon from 'src/components/Icon';
+import Select from 'src/components/Select';
+import Modal from './Modal';
+
+import withToasts from '../../messageToasts/enhancers/withToasts';
+
+type option = {
+  label: string;
+  value: string;
+};
+
+interface Props {
+  addDangerToast: (msg: string) => void;
+  addSuccessToast: (msg: string) => void;
+  onChange: any;
+  onDatasourceSave: any;
+  onHide: any;
+  show: boolean;
+}
+
+interface State {
+  datasource: option;
+  datasources: Array<option>;
+  disableSave: boolean;
+  disableSelectSchema: boolean;
+  disableSelectTable: boolean;
+  schema: option;
+  schemaLoading: boolean;
+  schemas: Array<option>;
+  table: option;
+  tableLoading: boolean;
+  tables: Array<option>;
+}
+
+const FieldTitle = styled.p`
+  color: ${({ theme }) => theme.colors.secondary.light2};
+  font-size: ${({ theme }) => theme.typography.sizes.s};
+  margin: 20px 0 10px 0;
+  text-transform: uppercase;
+`;
+
+const StyledIcon = styled(Icon)`
+  margin: auto 10px auto 0;
+`;
+
+class DatasetModal extends React.PureComponent<Props, State> {
+  constructor(props: Props) {
+    super(props);
+
+    this.onDatabaseChange = this.onDatabaseChange.bind(this);
+    this.onSave = this.onSave.bind(this);
+    this.onSchemaChange = this.onSchemaChange.bind(this);
+    this.onTableChange = this.onTableChange.bind(this);
+    this.renderFields = this.renderFields.bind(this);
+    this.renderTitle = this.renderTitle.bind(this);
+  }
+
+  state: State = {
+    datasource: { label: 'Select Datasource', value: 'Select Datasource' },
+    datasources: [],
+    disableSave: true,
+    disableSelectSchema: true,
+    disableSelectTable: true,
+    schema: { label: 'Select Schema', value: 'Select Schema' },
+    schemaLoading: false,
+    schemas: [],
+    table: { label: 'Select Table', value: 'Select Table' },

Review comment:
       all these labels should use `t` strings i think

##########
File path: superset-frontend/src/views/datasetList/DatasetModal.tsx
##########
@@ -0,0 +1,318 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { SupersetClient } from '@superset-ui/connection';
+import { t } from '@superset-ui/translation';
+import Icon from 'src/components/Icon';
+import Select from 'src/components/Select';
+import Modal from './Modal';
+
+import withToasts from '../../messageToasts/enhancers/withToasts';
+
+type option = {
+  label: string;
+  value: string;
+};
+
+interface Props {
+  addDangerToast: (msg: string) => void;
+  addSuccessToast: (msg: string) => void;
+  onChange: any;
+  onDatasourceSave: any;
+  onHide: any;
+  show: boolean;
+}
+
+interface State {
+  datasource: option;
+  datasources: Array<option>;
+  disableSave: boolean;
+  disableSelectSchema: boolean;
+  disableSelectTable: boolean;
+  schema: option;
+  schemaLoading: boolean;
+  schemas: Array<option>;
+  table: option;
+  tableLoading: boolean;
+  tables: Array<option>;
+}
+
+const FieldTitle = styled.p`
+  color: ${({ theme }) => theme.colors.secondary.light2};
+  font-size: ${({ theme }) => theme.typography.sizes.s};
+  margin: 20px 0 10px 0;
+  text-transform: uppercase;
+`;
+
+const StyledIcon = styled(Icon)`
+  margin: auto 10px auto 0;
+`;
+
+class DatasetModal extends React.PureComponent<Props, State> {
+  constructor(props: Props) {
+    super(props);
+
+    this.onDatabaseChange = this.onDatabaseChange.bind(this);
+    this.onSave = this.onSave.bind(this);
+    this.onSchemaChange = this.onSchemaChange.bind(this);
+    this.onTableChange = this.onTableChange.bind(this);
+    this.renderFields = this.renderFields.bind(this);
+    this.renderTitle = this.renderTitle.bind(this);
+  }
+
+  state: State = {
+    datasource: { label: 'Select Datasource', value: 'Select Datasource' },
+    datasources: [],
+    disableSave: true,
+    disableSelectSchema: true,
+    disableSelectTable: true,
+    schema: { label: 'Select Schema', value: 'Select Schema' },
+    schemaLoading: false,
+    schemas: [],
+    table: { label: 'Select Table', value: 'Select Table' },
+    tableLoading: false,
+    tables: [],
+  };
+
+  componentDidMount() {
+    this.fetchDatabase();
+  }
+
+  onDatabaseChange(datasource: option) {
+    this.setState({
+      disableSave: true,
+      disableSelectSchema: true,
+      disableSelectTable: true,
+      schemas: [],
+      tables: [],
+    });
+    this.fetchSchemas(`${datasource.value}`);
+    this.setState({
+      datasource,
+      schema: { label: 'Select Schema', value: 'Select Schema' },
+      table: { label: 'Select Table', value: 'Select Table' },
+    });
+  }
+
+  onSchemaChange(schema: option) {
+    this.setState({ tables: [], disableSelectTable: true, disableSave: true });
+    this.fetchTables(`${schema.value}`);
+    this.setState({ schema });
+  }
+
+  onTableChange(table: option) {
+    const { disableSelectSchema, disableSelectTable } = this.state;
+    const disableSave = disableSelectSchema || disableSelectTable;
+    this.setState({ table, disableSave });
+  }
+
+  onSave() {
+    const { datasource, schema, table } = this.state;
+    const { onHide, addSuccessToast, addDangerToast } = this.props;
+    const data = {
+      database: datasource.value,
+      schema: schema.value,
+      table_name: table.label,
+    };
+
+    SupersetClient.post({
+      endpoint: '/api/v1/dataset/',
+      body: JSON.stringify(data),
+      headers: { 'Content-Type': 'application/json' },
+      parseMethod: 'text',
+    })
+      .then(() => {
+        addSuccessToast(t('The dataset has been saved'));
+        onHide();
+      })
+      .catch(e => {
+        addDangerToast(t('Error while saving dataset'));
+        if (e) {
+          console.error(e);
+        }
+      });
+  }
+
+  fetchDatabase() {
+    SupersetClient.get({
+      endpoint: `/api/v1/dataset/related/database`,
+    })
+      .then(({ json: datasourcesJson = {} }) => {
+        const datasources = datasourcesJson.result.map(
+          ({ text, value }: { text: string; value: number }) => ({
+            label: text,
+            value: `${value}`,
+          }),
+        );
+        this.setState({ datasources });
+      })
+      .catch(e => {
+        this.props.addDangerToast(
+          t('An error occurred while fetching datasources'),
+        );
+        if (e) {
+          console.error(e);
+        }
+      });
+  }
+
+  fetchSchemas(datasourceId: string) {
+    if (datasourceId) {
+      this.setState({ schemaLoading: true });
+      const endpoint = `/superset/schemas/${datasourceId}/false/`;
+      SupersetClient.get({ endpoint })
+        .then(({ json: schemaJson = {} }) => {
+          const schemas = schemaJson.schemas.map((s: string) => ({
+            value: s,
+            label: s,
+          }));
+          this.setState({
+            disableSelectSchema: false,
+            schemaLoading: false,
+            schemas,
+          });
+        })
+        .catch(e => {
+          this.setState({ schemaLoading: false, schemas: [] });
+          this.props.addDangerToast(t('Error while fetching schema list'));
+          if (e) {
+            console.error(e);
+          }
+        });
+    }
+  }
+
+  fetchTables(schema: string) {
+    const { datasource } = this.state;
+
+    if (datasource && schema) {
+      this.setState(() => ({ tableLoading: true, tables: [] }));
+      const endpoint = encodeURI(
+        `/superset/tables/${datasource.value}/` +
+          `${encodeURIComponent(schema)}/undefined/false/`,

Review comment:
       why `undefined` and `false` here? That seems kinda odd

##########
File path: superset-frontend/src/views/datasetList/DatasetModal.tsx
##########
@@ -0,0 +1,318 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { SupersetClient } from '@superset-ui/connection';
+import { t } from '@superset-ui/translation';
+import Icon from 'src/components/Icon';
+import Select from 'src/components/Select';
+import Modal from './Modal';
+
+import withToasts from '../../messageToasts/enhancers/withToasts';
+
+type option = {
+  label: string;
+  value: string;
+};
+
+interface Props {
+  addDangerToast: (msg: string) => void;
+  addSuccessToast: (msg: string) => void;
+  onChange: any;
+  onDatasourceSave: any;
+  onHide: any;
+  show: boolean;
+}
+
+interface State {
+  datasource: option;
+  datasources: Array<option>;
+  disableSave: boolean;
+  disableSelectSchema: boolean;
+  disableSelectTable: boolean;
+  schema: option;
+  schemaLoading: boolean;
+  schemas: Array<option>;
+  table: option;
+  tableLoading: boolean;
+  tables: Array<option>;
+}
+
+const FieldTitle = styled.p`
+  color: ${({ theme }) => theme.colors.secondary.light2};
+  font-size: ${({ theme }) => theme.typography.sizes.s};
+  margin: 20px 0 10px 0;
+  text-transform: uppercase;
+`;
+
+const StyledIcon = styled(Icon)`
+  margin: auto 10px auto 0;
+`;
+
+class DatasetModal extends React.PureComponent<Props, State> {
+  constructor(props: Props) {
+    super(props);
+
+    this.onDatabaseChange = this.onDatabaseChange.bind(this);
+    this.onSave = this.onSave.bind(this);
+    this.onSchemaChange = this.onSchemaChange.bind(this);
+    this.onTableChange = this.onTableChange.bind(this);
+    this.renderFields = this.renderFields.bind(this);
+    this.renderTitle = this.renderTitle.bind(this);
+  }
+
+  state: State = {
+    datasource: { label: 'Select Datasource', value: 'Select Datasource' },
+    datasources: [],
+    disableSave: true,
+    disableSelectSchema: true,
+    disableSelectTable: true,
+    schema: { label: 'Select Schema', value: 'Select Schema' },
+    schemaLoading: false,
+    schemas: [],
+    table: { label: 'Select Table', value: 'Select Table' },
+    tableLoading: false,
+    tables: [],
+  };
+
+  componentDidMount() {
+    this.fetchDatabase();
+  }
+
+  onDatabaseChange(datasource: option) {
+    this.setState({
+      disableSave: true,
+      disableSelectSchema: true,
+      disableSelectTable: true,
+      schemas: [],
+      tables: [],
+    });
+    this.fetchSchemas(`${datasource.value}`);
+    this.setState({
+      datasource,
+      schema: { label: 'Select Schema', value: 'Select Schema' },
+      table: { label: 'Select Table', value: 'Select Table' },
+    });
+  }
+
+  onSchemaChange(schema: option) {
+    this.setState({ tables: [], disableSelectTable: true, disableSave: true });
+    this.fetchTables(`${schema.value}`);
+    this.setState({ schema });
+  }
+
+  onTableChange(table: option) {
+    const { disableSelectSchema, disableSelectTable } = this.state;
+    const disableSave = disableSelectSchema || disableSelectTable;
+    this.setState({ table, disableSave });
+  }
+
+  onSave() {
+    const { datasource, schema, table } = this.state;
+    const { onHide, addSuccessToast, addDangerToast } = this.props;
+    const data = {
+      database: datasource.value,
+      schema: schema.value,
+      table_name: table.label,
+    };
+
+    SupersetClient.post({
+      endpoint: '/api/v1/dataset/',
+      body: JSON.stringify(data),
+      headers: { 'Content-Type': 'application/json' },

Review comment:
       i'm shocked you need to define this header here, i'd think there'd be a param or flag to set this content type. Maybe take a look into the SupersetClient code and make sure. you might not even need to set it at all!

##########
File path: superset-frontend/src/views/datasetList/DatasetModal.tsx
##########
@@ -0,0 +1,318 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { SupersetClient } from '@superset-ui/connection';
+import { t } from '@superset-ui/translation';
+import Icon from 'src/components/Icon';
+import Select from 'src/components/Select';
+import Modal from './Modal';
+
+import withToasts from '../../messageToasts/enhancers/withToasts';
+
+type option = {
+  label: string;
+  value: string;
+};
+
+interface Props {
+  addDangerToast: (msg: string) => void;
+  addSuccessToast: (msg: string) => void;
+  onChange: any;
+  onDatasourceSave: any;
+  onHide: any;
+  show: boolean;
+}
+
+interface State {
+  datasource: option;
+  datasources: Array<option>;
+  disableSave: boolean;
+  disableSelectSchema: boolean;
+  disableSelectTable: boolean;
+  schema: option;
+  schemaLoading: boolean;
+  schemas: Array<option>;
+  table: option;
+  tableLoading: boolean;
+  tables: Array<option>;
+}
+
+const FieldTitle = styled.p`
+  color: ${({ theme }) => theme.colors.secondary.light2};
+  font-size: ${({ theme }) => theme.typography.sizes.s};
+  margin: 20px 0 10px 0;
+  text-transform: uppercase;
+`;
+
+const StyledIcon = styled(Icon)`
+  margin: auto 10px auto 0;
+`;
+
+class DatasetModal extends React.PureComponent<Props, State> {
+  constructor(props: Props) {
+    super(props);
+
+    this.onDatabaseChange = this.onDatabaseChange.bind(this);
+    this.onSave = this.onSave.bind(this);
+    this.onSchemaChange = this.onSchemaChange.bind(this);
+    this.onTableChange = this.onTableChange.bind(this);
+    this.renderFields = this.renderFields.bind(this);
+    this.renderTitle = this.renderTitle.bind(this);
+  }
+
+  state: State = {
+    datasource: { label: 'Select Datasource', value: 'Select Datasource' },
+    datasources: [],
+    disableSave: true,
+    disableSelectSchema: true,
+    disableSelectTable: true,
+    schema: { label: 'Select Schema', value: 'Select Schema' },
+    schemaLoading: false,
+    schemas: [],
+    table: { label: 'Select Table', value: 'Select Table' },
+    tableLoading: false,
+    tables: [],
+  };
+
+  componentDidMount() {
+    this.fetchDatabase();
+  }
+
+  onDatabaseChange(datasource: option) {
+    this.setState({
+      disableSave: true,
+      disableSelectSchema: true,
+      disableSelectTable: true,
+      schemas: [],
+      tables: [],
+    });
+    this.fetchSchemas(`${datasource.value}`);
+    this.setState({
+      datasource,
+      schema: { label: 'Select Schema', value: 'Select Schema' },
+      table: { label: 'Select Table', value: 'Select Table' },
+    });
+  }
+
+  onSchemaChange(schema: option) {
+    this.setState({ tables: [], disableSelectTable: true, disableSave: true });
+    this.fetchTables(`${schema.value}`);
+    this.setState({ schema });
+  }
+
+  onTableChange(table: option) {
+    const { disableSelectSchema, disableSelectTable } = this.state;
+    const disableSave = disableSelectSchema || disableSelectTable;
+    this.setState({ table, disableSave });
+  }
+
+  onSave() {
+    const { datasource, schema, table } = this.state;
+    const { onHide, addSuccessToast, addDangerToast } = this.props;
+    const data = {
+      database: datasource.value,
+      schema: schema.value,
+      table_name: table.label,
+    };
+
+    SupersetClient.post({
+      endpoint: '/api/v1/dataset/',
+      body: JSON.stringify(data),
+      headers: { 'Content-Type': 'application/json' },
+      parseMethod: 'text',
+    })
+      .then(() => {
+        addSuccessToast(t('The dataset has been saved'));
+        onHide();
+      })
+      .catch(e => {
+        addDangerToast(t('Error while saving dataset'));
+        if (e) {

Review comment:
       shouldn't `e` always be defined here? do you need this check?

##########
File path: superset-frontend/src/views/datasetList/Modal.tsx
##########
@@ -0,0 +1,102 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { Modal as BaseModal } from 'react-bootstrap';
+import { t } from '@superset-ui/translation';
+import Button from './Button';
+
+type Callback = (...args: any[]) => void;

Review comment:
       This is probably reused in a bunch of different files, should we pull it out into a global types file?

##########
File path: superset-frontend/src/views/datasetList/DatasetModal.tsx
##########
@@ -0,0 +1,318 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { SupersetClient } from '@superset-ui/connection';
+import { t } from '@superset-ui/translation';
+import Icon from 'src/components/Icon';
+import Select from 'src/components/Select';
+import Modal from './Modal';
+
+import withToasts from '../../messageToasts/enhancers/withToasts';
+
+type option = {
+  label: string;
+  value: string;
+};
+
+interface Props {
+  addDangerToast: (msg: string) => void;
+  addSuccessToast: (msg: string) => void;
+  onChange: any;
+  onDatasourceSave: any;
+  onHide: any;
+  show: boolean;
+}
+
+interface State {
+  datasource: option;
+  datasources: Array<option>;
+  disableSave: boolean;
+  disableSelectSchema: boolean;
+  disableSelectTable: boolean;
+  schema: option;
+  schemaLoading: boolean;
+  schemas: Array<option>;
+  table: option;
+  tableLoading: boolean;
+  tables: Array<option>;
+}
+
+const FieldTitle = styled.p`
+  color: ${({ theme }) => theme.colors.secondary.light2};
+  font-size: ${({ theme }) => theme.typography.sizes.s};
+  margin: 20px 0 10px 0;
+  text-transform: uppercase;
+`;
+
+const StyledIcon = styled(Icon)`
+  margin: auto 10px auto 0;
+`;
+
+class DatasetModal extends React.PureComponent<Props, State> {
+  constructor(props: Props) {
+    super(props);
+
+    this.onDatabaseChange = this.onDatabaseChange.bind(this);
+    this.onSave = this.onSave.bind(this);
+    this.onSchemaChange = this.onSchemaChange.bind(this);
+    this.onTableChange = this.onTableChange.bind(this);
+    this.renderFields = this.renderFields.bind(this);
+    this.renderTitle = this.renderTitle.bind(this);
+  }
+
+  state: State = {
+    datasource: { label: 'Select Datasource', value: 'Select Datasource' },
+    datasources: [],
+    disableSave: true,
+    disableSelectSchema: true,
+    disableSelectTable: true,
+    schema: { label: 'Select Schema', value: 'Select Schema' },
+    schemaLoading: false,
+    schemas: [],
+    table: { label: 'Select Table', value: 'Select Table' },
+    tableLoading: false,
+    tables: [],
+  };
+
+  componentDidMount() {
+    this.fetchDatabase();
+  }
+
+  onDatabaseChange(datasource: option) {
+    this.setState({
+      disableSave: true,
+      disableSelectSchema: true,
+      disableSelectTable: true,
+      schemas: [],
+      tables: [],
+    });
+    this.fetchSchemas(`${datasource.value}`);
+    this.setState({
+      datasource,
+      schema: { label: 'Select Schema', value: 'Select Schema' },
+      table: { label: 'Select Table', value: 'Select Table' },
+    });
+  }
+
+  onSchemaChange(schema: option) {
+    this.setState({ tables: [], disableSelectTable: true, disableSave: true });
+    this.fetchTables(`${schema.value}`);
+    this.setState({ schema });
+  }
+
+  onTableChange(table: option) {
+    const { disableSelectSchema, disableSelectTable } = this.state;
+    const disableSave = disableSelectSchema || disableSelectTable;
+    this.setState({ table, disableSave });
+  }
+
+  onSave() {
+    const { datasource, schema, table } = this.state;
+    const { onHide, addSuccessToast, addDangerToast } = this.props;
+    const data = {
+      database: datasource.value,
+      schema: schema.value,
+      table_name: table.label,
+    };
+
+    SupersetClient.post({
+      endpoint: '/api/v1/dataset/',
+      body: JSON.stringify(data),
+      headers: { 'Content-Type': 'application/json' },
+      parseMethod: 'text',
+    })
+      .then(() => {
+        addSuccessToast(t('The dataset has been saved'));
+        onHide();
+      })
+      .catch(e => {
+        addDangerToast(t('Error while saving dataset'));
+        if (e) {
+          console.error(e);
+        }
+      });
+  }
+
+  fetchDatabase() {
+    SupersetClient.get({
+      endpoint: `/api/v1/dataset/related/database`,
+    })
+      .then(({ json: datasourcesJson = {} }) => {
+        const datasources = datasourcesJson.result.map(
+          ({ text, value }: { text: string; value: number }) => ({
+            label: text,
+            value: `${value}`,
+          }),
+        );
+        this.setState({ datasources });
+      })
+      .catch(e => {
+        this.props.addDangerToast(
+          t('An error occurred while fetching datasources'),
+        );
+        if (e) {
+          console.error(e);
+        }
+      });
+  }
+
+  fetchSchemas(datasourceId: string) {
+    if (datasourceId) {
+      this.setState({ schemaLoading: true });
+      const endpoint = `/superset/schemas/${datasourceId}/false/`;
+      SupersetClient.get({ endpoint })
+        .then(({ json: schemaJson = {} }) => {
+          const schemas = schemaJson.schemas.map((s: string) => ({
+            value: s,
+            label: s,
+          }));
+          this.setState({
+            disableSelectSchema: false,
+            schemaLoading: false,
+            schemas,
+          });
+        })
+        .catch(e => {
+          this.setState({ schemaLoading: false, schemas: [] });
+          this.props.addDangerToast(t('Error while fetching schema list'));
+          if (e) {
+            console.error(e);
+          }
+        });
+    }
+  }
+
+  fetchTables(schema: string) {
+    const { datasource } = this.state;
+
+    if (datasource && schema) {
+      this.setState(() => ({ tableLoading: true, tables: [] }));
+      const endpoint = encodeURI(
+        `/superset/tables/${datasource.value}/` +
+          `${encodeURIComponent(schema)}/undefined/false/`,
+      );
+      SupersetClient.get({ endpoint })
+        .then(({ json: tableJson = {} }) => {
+          const options = tableJson.options.map((o: option) => ({
+            value: o.value,
+            label: o.label,
+          }));
+          this.setState(() => ({
+            disableSelectTable: false,
+            tableLoading: false,
+            tables: options,
+          }));
+        })
+        .catch(e => {
+          this.setState(() => ({ tableLoading: false, tables: [] }));
+          this.props.addDangerToast(t('Error while fetching table list'));
+          if (e) {
+            console.error(e);
+          }
+        });
+    }
+  }
+
+  renderFields() {
+    const {
+      datasource,
+      datasources,
+      disableSelectSchema,
+      disableSelectTable,
+      schema,
+      schemaLoading,
+      schemas,
+      table,
+      tableLoading,
+      tables,
+    } = this.state;
+    const { onDatabaseChange, onSchemaChange, onTableChange } = this;

Review comment:
       is this a standard pattern in Superset? I've never seen it before, and am not necessarily opposed to it, but it does read a little weird

##########
File path: superset-frontend/src/views/datasetList/DatasetModal.tsx
##########
@@ -0,0 +1,318 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { SupersetClient } from '@superset-ui/connection';
+import { t } from '@superset-ui/translation';
+import Icon from 'src/components/Icon';
+import Select from 'src/components/Select';
+import Modal from './Modal';
+
+import withToasts from '../../messageToasts/enhancers/withToasts';
+
+type option = {
+  label: string;
+  value: string;
+};
+
+interface Props {
+  addDangerToast: (msg: string) => void;
+  addSuccessToast: (msg: string) => void;
+  onChange: any;
+  onDatasourceSave: any;
+  onHide: any;
+  show: boolean;
+}
+
+interface State {
+  datasource: option;
+  datasources: Array<option>;
+  disableSave: boolean;
+  disableSelectSchema: boolean;
+  disableSelectTable: boolean;
+  schema: option;
+  schemaLoading: boolean;
+  schemas: Array<option>;
+  table: option;
+  tableLoading: boolean;
+  tables: Array<option>;
+}
+
+const FieldTitle = styled.p`
+  color: ${({ theme }) => theme.colors.secondary.light2};
+  font-size: ${({ theme }) => theme.typography.sizes.s};
+  margin: 20px 0 10px 0;
+  text-transform: uppercase;
+`;
+
+const StyledIcon = styled(Icon)`
+  margin: auto 10px auto 0;
+`;
+
+class DatasetModal extends React.PureComponent<Props, State> {
+  constructor(props: Props) {
+    super(props);
+
+    this.onDatabaseChange = this.onDatabaseChange.bind(this);
+    this.onSave = this.onSave.bind(this);
+    this.onSchemaChange = this.onSchemaChange.bind(this);
+    this.onTableChange = this.onTableChange.bind(this);
+    this.renderFields = this.renderFields.bind(this);
+    this.renderTitle = this.renderTitle.bind(this);
+  }
+
+  state: State = {
+    datasource: { label: 'Select Datasource', value: 'Select Datasource' },
+    datasources: [],
+    disableSave: true,
+    disableSelectSchema: true,
+    disableSelectTable: true,
+    schema: { label: 'Select Schema', value: 'Select Schema' },
+    schemaLoading: false,
+    schemas: [],
+    table: { label: 'Select Table', value: 'Select Table' },
+    tableLoading: false,
+    tables: [],
+  };
+
+  componentDidMount() {
+    this.fetchDatabase();
+  }
+
+  onDatabaseChange(datasource: option) {
+    this.setState({
+      disableSave: true,
+      disableSelectSchema: true,
+      disableSelectTable: true,
+      schemas: [],
+      tables: [],
+    });
+    this.fetchSchemas(`${datasource.value}`);
+    this.setState({
+      datasource,
+      schema: { label: 'Select Schema', value: 'Select Schema' },
+      table: { label: 'Select Table', value: 'Select Table' },
+    });
+  }
+
+  onSchemaChange(schema: option) {
+    this.setState({ tables: [], disableSelectTable: true, disableSave: true });
+    this.fetchTables(`${schema.value}`);
+    this.setState({ schema });
+  }
+
+  onTableChange(table: option) {
+    const { disableSelectSchema, disableSelectTable } = this.state;
+    const disableSave = disableSelectSchema || disableSelectTable;
+    this.setState({ table, disableSave });
+  }
+
+  onSave() {
+    const { datasource, schema, table } = this.state;
+    const { onHide, addSuccessToast, addDangerToast } = this.props;
+    const data = {
+      database: datasource.value,
+      schema: schema.value,
+      table_name: table.label,
+    };
+
+    SupersetClient.post({
+      endpoint: '/api/v1/dataset/',
+      body: JSON.stringify(data),
+      headers: { 'Content-Type': 'application/json' },
+      parseMethod: 'text',
+    })
+      .then(() => {
+        addSuccessToast(t('The dataset has been saved'));
+        onHide();
+      })
+      .catch(e => {
+        addDangerToast(t('Error while saving dataset'));
+        if (e) {
+          console.error(e);
+        }
+      });
+  }
+
+  fetchDatabase() {
+    SupersetClient.get({
+      endpoint: `/api/v1/dataset/related/database`,
+    })
+      .then(({ json: datasourcesJson = {} }) => {
+        const datasources = datasourcesJson.result.map(
+          ({ text, value }: { text: string; value: number }) => ({
+            label: text,
+            value: `${value}`,

Review comment:
       this can just be `value`

##########
File path: superset-frontend/src/views/datasetList/DatasetModal.tsx
##########
@@ -0,0 +1,318 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { SupersetClient } from '@superset-ui/connection';
+import { t } from '@superset-ui/translation';
+import Icon from 'src/components/Icon';
+import Select from 'src/components/Select';
+import Modal from './Modal';
+
+import withToasts from '../../messageToasts/enhancers/withToasts';
+
+type option = {
+  label: string;
+  value: string;
+};
+
+interface Props {
+  addDangerToast: (msg: string) => void;
+  addSuccessToast: (msg: string) => void;
+  onChange: any;
+  onDatasourceSave: any;
+  onHide: any;
+  show: boolean;
+}
+
+interface State {
+  datasource: option;
+  datasources: Array<option>;
+  disableSave: boolean;
+  disableSelectSchema: boolean;
+  disableSelectTable: boolean;
+  schema: option;
+  schemaLoading: boolean;
+  schemas: Array<option>;
+  table: option;
+  tableLoading: boolean;
+  tables: Array<option>;
+}
+
+const FieldTitle = styled.p`
+  color: ${({ theme }) => theme.colors.secondary.light2};
+  font-size: ${({ theme }) => theme.typography.sizes.s};
+  margin: 20px 0 10px 0;
+  text-transform: uppercase;
+`;
+
+const StyledIcon = styled(Icon)`
+  margin: auto 10px auto 0;
+`;
+
+class DatasetModal extends React.PureComponent<Props, State> {
+  constructor(props: Props) {
+    super(props);
+
+    this.onDatabaseChange = this.onDatabaseChange.bind(this);
+    this.onSave = this.onSave.bind(this);
+    this.onSchemaChange = this.onSchemaChange.bind(this);
+    this.onTableChange = this.onTableChange.bind(this);
+    this.renderFields = this.renderFields.bind(this);
+    this.renderTitle = this.renderTitle.bind(this);
+  }
+
+  state: State = {
+    datasource: { label: 'Select Datasource', value: 'Select Datasource' },
+    datasources: [],
+    disableSave: true,
+    disableSelectSchema: true,
+    disableSelectTable: true,
+    schema: { label: 'Select Schema', value: 'Select Schema' },
+    schemaLoading: false,
+    schemas: [],
+    table: { label: 'Select Table', value: 'Select Table' },
+    tableLoading: false,
+    tables: [],
+  };
+
+  componentDidMount() {
+    this.fetchDatabase();
+  }
+
+  onDatabaseChange(datasource: option) {
+    this.setState({
+      disableSave: true,
+      disableSelectSchema: true,
+      disableSelectTable: true,
+      schemas: [],
+      tables: [],
+    });
+    this.fetchSchemas(`${datasource.value}`);
+    this.setState({
+      datasource,
+      schema: { label: 'Select Schema', value: 'Select Schema' },
+      table: { label: 'Select Table', value: 'Select Table' },
+    });
+  }
+
+  onSchemaChange(schema: option) {
+    this.setState({ tables: [], disableSelectTable: true, disableSave: true });
+    this.fetchTables(`${schema.value}`);
+    this.setState({ schema });
+  }
+
+  onTableChange(table: option) {
+    const { disableSelectSchema, disableSelectTable } = this.state;
+    const disableSave = disableSelectSchema || disableSelectTable;
+    this.setState({ table, disableSave });
+  }
+
+  onSave() {
+    const { datasource, schema, table } = this.state;
+    const { onHide, addSuccessToast, addDangerToast } = this.props;
+    const data = {
+      database: datasource.value,
+      schema: schema.value,
+      table_name: table.label,
+    };
+
+    SupersetClient.post({
+      endpoint: '/api/v1/dataset/',
+      body: JSON.stringify(data),
+      headers: { 'Content-Type': 'application/json' },
+      parseMethod: 'text',
+    })
+      .then(() => {
+        addSuccessToast(t('The dataset has been saved'));
+        onHide();
+      })
+      .catch(e => {
+        addDangerToast(t('Error while saving dataset'));
+        if (e) {
+          console.error(e);
+        }
+      });
+  }
+
+  fetchDatabase() {
+    SupersetClient.get({
+      endpoint: `/api/v1/dataset/related/database`,
+    })
+      .then(({ json: datasourcesJson = {} }) => {
+        const datasources = datasourcesJson.result.map(
+          ({ text, value }: { text: string; value: number }) => ({
+            label: text,
+            value: `${value}`,
+          }),
+        );
+        this.setState({ datasources });
+      })
+      .catch(e => {
+        this.props.addDangerToast(
+          t('An error occurred while fetching datasources'),
+        );
+        if (e) {
+          console.error(e);
+        }
+      });
+  }
+
+  fetchSchemas(datasourceId: string) {
+    if (datasourceId) {
+      this.setState({ schemaLoading: true });
+      const endpoint = `/superset/schemas/${datasourceId}/false/`;
+      SupersetClient.get({ endpoint })
+        .then(({ json: schemaJson = {} }) => {
+          const schemas = schemaJson.schemas.map((s: string) => ({
+            value: s,
+            label: s,
+          }));
+          this.setState({
+            disableSelectSchema: false,
+            schemaLoading: false,
+            schemas,
+          });
+        })
+        .catch(e => {
+          this.setState({ schemaLoading: false, schemas: [] });
+          this.props.addDangerToast(t('Error while fetching schema list'));
+          if (e) {
+            console.error(e);
+          }
+        });
+    }
+  }
+
+  fetchTables(schema: string) {
+    const { datasource } = this.state;
+
+    if (datasource && schema) {
+      this.setState(() => ({ tableLoading: true, tables: [] }));
+      const endpoint = encodeURI(
+        `/superset/tables/${datasource.value}/` +
+          `${encodeURIComponent(schema)}/undefined/false/`,
+      );
+      SupersetClient.get({ endpoint })
+        .then(({ json: tableJson = {} }) => {
+          const options = tableJson.options.map((o: option) => ({
+            value: o.value,
+            label: o.label,
+          }));
+          this.setState(() => ({
+            disableSelectTable: false,
+            tableLoading: false,
+            tables: options,
+          }));
+        })
+        .catch(e => {
+          this.setState(() => ({ tableLoading: false, tables: [] }));
+          this.props.addDangerToast(t('Error while fetching table list'));
+          if (e) {
+            console.error(e);
+          }
+        });
+    }
+  }
+
+  renderFields() {
+    const {
+      datasource,
+      datasources,
+      disableSelectSchema,
+      disableSelectTable,
+      schema,
+      schemaLoading,
+      schemas,
+      table,
+      tableLoading,
+      tables,
+    } = this.state;
+    const { onDatabaseChange, onSchemaChange, onTableChange } = this;
+
+    return (
+      <>
+        <FieldTitle>{t('datasource')}</FieldTitle>
+        <Select
+          clearable={false}
+          ignoreAccents={false}
+          name="select-datasource"
+          onChange={onDatabaseChange}
+          options={datasources}
+          placeholder={t('Select Datasource')}
+          value={datasource}
+          width={500}
+        />
+        <FieldTitle>{t('schema')}</FieldTitle>
+        <Select
+          clearable={false}
+          ignoreAccents={false}
+          isDisabled={disableSelectSchema}
+          isLoading={schemaLoading}
+          name="select-schema"
+          onChange={onSchemaChange}
+          options={schemas}
+          placeholder={t('Select Schema')}
+          value={schema}
+          width={500}
+        />
+        <FieldTitle>{t('table')}</FieldTitle>
+        <Select
+          clearable={false}
+          ignoreAccents={false}
+          isDisabled={disableSelectTable}
+          isLoading={tableLoading}
+          name="select-table"
+          onChange={onTableChange}
+          options={tables}
+          placeholder={t('Select Table')}
+          value={table}
+          width={500}
+        />
+      </>
+    );
+  }
+
+  renderTitle() {

Review comment:
       this seems a little unnecessary, maybe it's better to inline it on line 310 instead?




----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org


[GitHub] [incubator-superset] lilykuang commented on a change in pull request #10104: style: dataset modal view

Posted by GitBox <gi...@apache.org>.
lilykuang commented on a change in pull request #10104:
URL: https://github.com/apache/incubator-superset/pull/10104#discussion_r442988960



##########
File path: superset-frontend/src/views/datasetList/DatasetModal.tsx
##########
@@ -0,0 +1,318 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { SupersetClient } from '@superset-ui/connection';
+import { t } from '@superset-ui/translation';
+import Icon from 'src/components/Icon';
+import Select from 'src/components/Select';
+import Modal from './Modal';
+
+import withToasts from '../../messageToasts/enhancers/withToasts';
+
+type option = {
+  label: string;
+  value: string;
+};
+
+interface Props {
+  addDangerToast: (msg: string) => void;
+  addSuccessToast: (msg: string) => void;
+  onChange: any;
+  onDatasourceSave: any;
+  onHide: any;

Review comment:
       @etr2460 @ktmud actually `onChange` and  `onDatasourceSave` are not called anywhere and I will remove them. Sorry for the confusion.




----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org


[GitHub] [incubator-superset] ktmud commented on a change in pull request #10104: style: dataset modal view

Posted by GitBox <gi...@apache.org>.
ktmud commented on a change in pull request #10104:
URL: https://github.com/apache/incubator-superset/pull/10104#discussion_r443037320



##########
File path: superset-frontend/src/views/datasetList/DatasetModal.tsx
##########
@@ -0,0 +1,318 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { SupersetClient } from '@superset-ui/connection';
+import { t } from '@superset-ui/translation';
+import Icon from 'src/components/Icon';
+import Select from 'src/components/Select';
+import Modal from './Modal';
+import withToasts from '../../messageToasts/enhancers/withToasts';
+
+type Option = {
+  label: string;
+  value: string;
+};
+
+type SelectOptions = {

Review comment:
       `interface SelectOptionsProps {`
   
   or 
   
   ```ts
   import Select, { SupersetStyledSelectProps } from 'src/components/Select';
   
   
   type SelectOptionProps = SupersetStyledSelectProps<Option> & { title: string }
   ```




----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org


[GitHub] [incubator-superset] ktmud commented on a change in pull request #10104: style: dataset modal view

Posted by GitBox <gi...@apache.org>.
ktmud commented on a change in pull request #10104:
URL: https://github.com/apache/incubator-superset/pull/10104#discussion_r443031139



##########
File path: superset-frontend/src/components/Menu/SubMenu.tsx
##########
@@ -72,29 +73,38 @@ interface Props {
 
 interface State {

Review comment:
       Also rename to `SubMenuState` and `SubeMenuProps` if you don't mind.




----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org


[GitHub] [incubator-superset] ktmud commented on a change in pull request #10104: style: dataset modal view

Posted by GitBox <gi...@apache.org>.
ktmud commented on a change in pull request #10104:
URL: https://github.com/apache/incubator-superset/pull/10104#discussion_r443035720



##########
File path: superset-frontend/src/views/datasetList/DatasetModal.tsx
##########
@@ -0,0 +1,318 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import { SupersetClient } from '@superset-ui/connection';
+import { t } from '@superset-ui/translation';
+import Icon from 'src/components/Icon';
+import Select from 'src/components/Select';
+import Modal from './Modal';
+
+import withToasts from '../../messageToasts/enhancers/withToasts';
+
+type option = {
+  label: string;
+  value: string;
+};
+
+interface Props {
+  addDangerToast: (msg: string) => void;
+  addSuccessToast: (msg: string) => void;
+  onChange: any;
+  onDatasourceSave: any;
+  onHide: any;
+  show: boolean;
+}
+
+interface State {
+  datasource: option;
+  datasources: Array<option>;
+  disableSave: boolean;
+  disableSelectSchema: boolean;
+  disableSelectTable: boolean;
+  schema: option;
+  schemaLoading: boolean;
+  schemas: Array<option>;
+  table: option;
+  tableLoading: boolean;
+  tables: Array<option>;
+}
+
+const FieldTitle = styled.p`
+  color: ${({ theme }) => theme.colors.secondary.light2};
+  font-size: ${({ theme }) => theme.typography.sizes.s};
+  margin: 20px 0 10px 0;
+  text-transform: uppercase;
+`;
+
+const StyledIcon = styled(Icon)`
+  margin: auto 10px auto 0;
+`;
+
+class DatasetModal extends React.PureComponent<Props, State> {
+  constructor(props: Props) {
+    super(props);
+
+    this.onDatabaseChange = this.onDatabaseChange.bind(this);
+    this.onSave = this.onSave.bind(this);
+    this.onSchemaChange = this.onSchemaChange.bind(this);
+    this.onTableChange = this.onTableChange.bind(this);
+    this.renderFields = this.renderFields.bind(this);
+    this.renderTitle = this.renderTitle.bind(this);
+  }
+
+  state: State = {
+    datasource: { label: 'Select Datasource', value: 'Select Datasource' },
+    datasources: [],
+    disableSave: true,
+    disableSelectSchema: true,
+    disableSelectTable: true,
+    schema: { label: 'Select Schema', value: 'Select Schema' },
+    schemaLoading: false,
+    schemas: [],
+    table: { label: 'Select Table', value: 'Select Table' },
+    tableLoading: false,
+    tables: [],
+  };
+
+  componentDidMount() {
+    this.fetchDatabase();
+  }
+
+  onDatabaseChange(datasource: option) {
+    this.setState({
+      disableSave: true,
+      disableSelectSchema: true,
+      disableSelectTable: true,
+      schemas: [],
+      tables: [],
+    });
+    this.fetchSchemas(`${datasource.value}`);
+    this.setState({
+      datasource,
+      schema: { label: 'Select Schema', value: 'Select Schema' },
+      table: { label: 'Select Table', value: 'Select Table' },
+    });
+  }
+
+  onSchemaChange(schema: option) {
+    this.setState({ tables: [], disableSelectTable: true, disableSave: true });
+    this.fetchTables(`${schema.value}`);
+    this.setState({ schema });
+  }
+
+  onTableChange(table: option) {
+    const { disableSelectSchema, disableSelectTable } = this.state;
+    const disableSave = disableSelectSchema || disableSelectTable;
+    this.setState({ table, disableSave });
+  }
+
+  onSave() {
+    const { datasource, schema, table } = this.state;
+    const { onHide, addSuccessToast, addDangerToast } = this.props;
+    const data = {
+      database: datasource.value,
+      schema: schema.value,
+      table_name: table.label,
+    };
+
+    SupersetClient.post({
+      endpoint: '/api/v1/dataset/',
+      body: JSON.stringify(data),
+      headers: { 'Content-Type': 'application/json' },

Review comment:
       @kristw @suddjian This seems relevant to this discussion: https://github.com/apache-superset/superset-ui/pull/554#discussion_r433432209




----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org


[GitHub] [incubator-superset] lilykuang commented on a change in pull request #10104: style: dataset modal view

Posted by GitBox <gi...@apache.org>.
lilykuang commented on a change in pull request #10104:
URL: https://github.com/apache/incubator-superset/pull/10104#discussion_r443016509



##########
File path: superset-frontend/src/views/datasetList/Button.tsx
##########
@@ -0,0 +1,64 @@
+/**
+ * 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 from 'react';
+import styled from '@superset-ui/style';
+import BaseButton from 'src/components/Button';
+
+type Button = 'default' | 'primary' | 'secondary';
+
+interface Props {
+  bsStyle: Button;
+  disabled?: boolean;
+  onClick: (...args: any[]) => any;
+  title: string | React.ReactNode;
+}
+
+const StyledButton = styled(BaseButton)`
+  border: none;
+  border-radius: ${({ theme }) => theme.borderRadius}px;
+  padding: 8px;
+  text-transform: uppercase;
+  width: 160px;
+  &.btn[disabled],
+  &.btn[disabled]:hover {
+    background-color: ${({ theme }) => theme.colors.grayscale.light2};
+    color: ${({ theme }) => theme.colors.grayscale.light1};
+  }
+  &.btn-primary,
+  &.btn-primary:hover {
+    background-color: ${({ theme }) => theme.colors.primary.base};
+  }
+  &.btn-secondary {
+    background-color: ${({ theme }) => theme.colors.primary.light4};
+    color: ${({ theme }) => theme.colors.primary.base};
+  }
+`;

Review comment:
       I have moved the buttons back to modal. they are more for modal instead of generalized button that could used everywhere




----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org


[GitHub] [incubator-superset] codecov-commenter commented on pull request #10104: style: dataset modal view

Posted by GitBox <gi...@apache.org>.
codecov-commenter commented on pull request #10104:
URL: https://github.com/apache/incubator-superset/pull/10104#issuecomment-648258819


   # [Codecov](https://codecov.io/gh/apache/incubator-superset/pull/10104?src=pr&el=h1) Report
   > Merging [#10104](https://codecov.io/gh/apache/incubator-superset/pull/10104?src=pr&el=desc) into [master](https://codecov.io/gh/apache/incubator-superset/commit/a6390afb8972f315a0e5c87e618e21708e596f36&el=desc) will **increase** coverage by `4.17%`.
   > The diff coverage is `n/a`.
   
   [![Impacted file tree graph](https://codecov.io/gh/apache/incubator-superset/pull/10104/graphs/tree.svg?width=650&height=150&src=pr&token=KsB0fHcx6l)](https://codecov.io/gh/apache/incubator-superset/pull/10104?src=pr&el=tree)
   
   ```diff
   @@            Coverage Diff             @@
   ##           master   #10104      +/-   ##
   ==========================================
   + Coverage   65.79%   69.96%   +4.17%     
   ==========================================
     Files         590      190     -400     
     Lines       31152    18255   -12897     
     Branches     3169        0    -3169     
   ==========================================
   - Hits        20497    12773    -7724     
   + Misses      10477     5482    -4995     
   + Partials      178        0     -178     
   ```
   
   | Flag | Coverage Δ | |
   |---|---|---|
   | #javascript | `?` | |
   | #python | `69.96% <ø> (-0.24%)` | :arrow_down: |
   
   | [Impacted Files](https://codecov.io/gh/apache/incubator-superset/pull/10104?src=pr&el=tree) | Coverage Δ | |
   |---|---|---|
   | [superset/views/database/mixins.py](https://codecov.io/gh/apache/incubator-superset/pull/10104/diff?src=pr&el=tree#diff-c3VwZXJzZXQvdmlld3MvZGF0YWJhc2UvbWl4aW5zLnB5) | `59.64% <0.00%> (-21.06%)` | :arrow_down: |
   | [superset/utils/cache.py](https://codecov.io/gh/apache/incubator-superset/pull/10104/diff?src=pr&el=tree#diff-c3VwZXJzZXQvdXRpbHMvY2FjaGUucHk=) | `48.00% <0.00%> (-20.00%)` | :arrow_down: |
   | [superset/db\_engine\_specs/mysql.py](https://codecov.io/gh/apache/incubator-superset/pull/10104/diff?src=pr&el=tree#diff-c3VwZXJzZXQvZGJfZW5naW5lX3NwZWNzL215c3FsLnB5) | `78.26% <0.00%> (-13.05%)` | :arrow_down: |
   | [superset/views/database/validators.py](https://codecov.io/gh/apache/incubator-superset/pull/10104/diff?src=pr&el=tree#diff-c3VwZXJzZXQvdmlld3MvZGF0YWJhc2UvdmFsaWRhdG9ycy5weQ==) | `78.94% <0.00%> (-5.27%)` | :arrow_down: |
   | [superset/views/database/api.py](https://codecov.io/gh/apache/incubator-superset/pull/10104/diff?src=pr&el=tree#diff-c3VwZXJzZXQvdmlld3MvZGF0YWJhc2UvYXBpLnB5) | `84.09% <0.00%> (-3.41%)` | :arrow_down: |
   | [superset/db\_engine\_specs/postgres.py](https://codecov.io/gh/apache/incubator-superset/pull/10104/diff?src=pr&el=tree#diff-c3VwZXJzZXQvZGJfZW5naW5lX3NwZWNzL3Bvc3RncmVzLnB5) | `97.29% <0.00%> (-2.71%)` | :arrow_down: |
   | [superset/views/database/views.py](https://codecov.io/gh/apache/incubator-superset/pull/10104/diff?src=pr&el=tree#diff-c3VwZXJzZXQvdmlld3MvZGF0YWJhc2Uvdmlld3MucHk=) | `87.17% <0.00%> (-2.57%)` | :arrow_down: |
   | [superset/models/core.py](https://codecov.io/gh/apache/incubator-superset/pull/10104/diff?src=pr&el=tree#diff-c3VwZXJzZXQvbW9kZWxzL2NvcmUucHk=) | `83.96% <0.00%> (-2.34%)` | :arrow_down: |
   | [superset/jinja\_context.py](https://codecov.io/gh/apache/incubator-superset/pull/10104/diff?src=pr&el=tree#diff-c3VwZXJzZXQvamluamFfY29udGV4dC5weQ==) | `80.00% <0.00%> (-0.96%)` | :arrow_down: |
   | [superset/security/manager.py](https://codecov.io/gh/apache/incubator-superset/pull/10104/diff?src=pr&el=tree#diff-c3VwZXJzZXQvc2VjdXJpdHkvbWFuYWdlci5weQ==) | `88.43% <0.00%> (-0.61%)` | :arrow_down: |
   | ... and [404 more](https://codecov.io/gh/apache/incubator-superset/pull/10104/diff?src=pr&el=tree-more) | |
   
   ------
   
   [Continue to review full report at Codecov](https://codecov.io/gh/apache/incubator-superset/pull/10104?src=pr&el=continue).
   > **Legend** - [Click here to learn more](https://docs.codecov.io/docs/codecov-delta)
   > `Δ = absolute <relative> (impact)`, `ø = not affected`, `? = missing data`
   > Powered by [Codecov](https://codecov.io/gh/apache/incubator-superset/pull/10104?src=pr&el=footer). Last update [a6390af...1a1f02c](https://codecov.io/gh/apache/incubator-superset/pull/10104?src=pr&el=lastupdated). Read the [comment docs](https://docs.codecov.io/docs/pull-request-comments).
   


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org