fix: allow creating table option and remove schema requirement in dataset add modal (#10369)

superset-frontend/src/components/TableSelector.jsx

@@ -20,7 +20,7 @@ import React from 'react';
 import styled from '@superset-ui/style';
 import PropTypes from 'prop-types';
 import rison from 'rison';
-import { Select, AsyncSelect } from 'src/components/Select';
+import { AsyncSelect, CreatableSelect, Select } from 'src/components/Select';
 import { Label } from 'react-bootstrap';
 import { t } from '@superset-ui/translation';
 import { SupersetClient } from '@superset-ui/connection';
@@ -358,31 +358,49 @@ export default class TableSelector extends React.PureComponent {
       tableSelectDisabled = true;
     }
     const options = this.state.tableOptions;
-    const select = this.props.schema ? (
+    let select = null;
-      <Select
+    if (this.props.schema && !this.props.formMode) {
-        name="select-table"
+      select = (
-        isLoading={this.state.tableLoading}
+        <Select
-        ignoreAccents={false}
+          name="select-table"
-        placeholder={t('Select table or type table name')}
+          isLoading={this.state.tableLoading}
-        autosize={false}
+          ignoreAccents={false}
-        onChange={this.changeTable}
+          placeholder={t('Select table or type table name')}
-        options={options}
+          autosize={false}
-        value={this.state.tableName}
+          onChange={this.changeTable}
-        optionRenderer={this.renderTableOption}
+          options={options}
-      />
+          value={this.state.tableName}
-    ) : (
+          optionRenderer={this.renderTableOption}
-      <AsyncSelect
+        />
-        name="async-select-table"
+      );
-        placeholder={tableSelectPlaceholder}
+    } else if (this.props.formMode) {
-        disabled={tableSelectDisabled}
+      select = (
-        autosize={false}
+        <CreatableSelect
-        onChange={this.changeTable}
+          name="select-table"
-        value={this.state.tableName}
+          isLoading={this.state.tableLoading}
-        loadOptions={this.getTableNamesBySubStr}
+          ignoreAccents={false}
-        optionRenderer={this.renderTableOption}
+          placeholder={t('Select table or type table name')}
-        isDisabled={this.props.formMode}
+          autosize={false}
-      />
+          onChange={this.changeTable}
-    );
+          options={options}
+          value={this.state.tableName}
+          optionRenderer={this.renderTableOption}
+        />
+      );
+    } else {
+      select = (
+        <AsyncSelect
+          name="async-select-table"
+          placeholder={tableSelectPlaceholder}
+          isDisabled={tableSelectDisabled}
+          autosize={false}
+          onChange={this.changeTable}
+          value={this.state.tableName}
+          loadOptions={this.getTableNamesBySubStr}
+          optionRenderer={this.renderTableOption}
+        />
+      );
+    }
     const refresh = !this.props.formMode && (
       <RefreshLabel
         onClick={() => this.changeSchema({ value: this.props.schema }, true)}

superset-frontend/src/views/datasetList/AddDatasetModal.tsx

@@ -73,7 +73,7 @@ const DatasetModal: FunctionComponent<DatasetModalProps> = ({
     tableName: string;
   }) => {
     setDatasourceId(dbId);
-    setDisableSave(isNil(dbId) || isEmpty(schema) || isEmpty(tableName));
+    setDisableSave(isNil(dbId) || isEmpty(tableName));
     setSchema(schema);
     setTableName(tableName);
   };
@@ -83,7 +83,7 @@ const DatasetModal: FunctionComponent<DatasetModalProps> = ({
       endpoint: '/api/v1/dataset/',
       body: JSON.stringify({
         database: datasourceId,
-        schema: currentSchema,
+        ...(currentSchema ? { schema: currentSchema } : {}),
         table_name: currentTableName,
       }),
       headers: { 'Content-Type': 'application/json' },