feat(sqllab): Add a configuration option to disable data preview (#19104)

superset-frontend/src/SqlLab/actions/sqlLab.js

@@ -1018,28 +1018,13 @@ function getTableMetadata(table, query, dispatch) {
     ),
   })
     .then(({ json }) => {
-      const dataPreviewQuery = {
-        id: shortid.generate(),
-        dbId: query.dbId,
-        sql: json.selectStar,
-        tableName: table.name,
-        sqlEditorId: null,
-        tab: '',
-        runAsync: false,
-        ctas: false,
-        isDataPreview: true,
-      };
       const newTable = {
         ...table,
         ...json,
         expanded: true,
         isMetadataLoading: false,
-        dataPreviewQueryId: dataPreviewQuery.id,
       };
-      Promise.all([
-        dispatch(mergeTable(newTable, dataPreviewQuery)), // Merge table to tables in state
-        dispatch(runQuery(dataPreviewQuery)), // Run query to get preview data for table
-      ]);
+      dispatch(mergeTable(newTable)); // Merge table to tables in state
       return newTable;
     })
     .catch(() =>
@@ -1082,7 +1067,7 @@ function getTableExtendedMetadata(table, query, dispatch) {
     );
 }
 
-export function addTable(query, tableName, schemaName) {
+export function addTable(query, database, tableName, schemaName) {
   return function (dispatch) {
     const table = {
       dbId: query.dbId,
@@ -1110,6 +1095,32 @@ export function addTable(query, tableName, schemaName) {
           })
         : Promise.resolve({ json: { id: shortid.generate() } });
 
+      if (!database.disable_data_preview && database.id === query.dbId) {
+        const dataPreviewQuery = {
+          id: shortid.generate(),
+          dbId: query.dbId,
+          sql: newTable.selectStar,
+          tableName: table.name,
+          sqlEditorId: null,
+          tab: '',
+          runAsync: database.allow_run_async,
+          ctas: false,
+          isDataPreview: true,
+        };
+        Promise.all([
+          dispatch(
+            mergeTable(
+              {
+                ...newTable,
+                dataPreviewQueryId: dataPreviewQuery.id,
+              },
+              dataPreviewQuery,
+            ),
+          ),
+          dispatch(runQuery(dataPreviewQuery)),
+        ]);
+      }
+
       return sync
         .then(({ json: resultJson }) =>
           dispatch(mergeTable({ ...table, id: resultJson.id })),

superset-frontend/src/SqlLab/actions/sqlLab.test.js

@@ -727,28 +727,18 @@ describe('async actions', () => {
       it('updates the table schema state in the backend', () => {
         expect.assertions(5);
 
-        const results = {
-          data: mockBigNumber,
-          query: { sqlEditorId: 'null' },
-          query_id: 'efgh',
-        };
-        fetchMock.post(runQueryEndpoint, JSON.stringify(results), {
-          overwriteRoutes: true,
-        });
-
+        const database = { disable_data_preview: true };
         const tableName = 'table';
         const schemaName = 'schema';
         const store = mockStore({});
         const expectedActionTypes = [
           actions.MERGE_TABLE, // addTable
           actions.MERGE_TABLE, // getTableMetadata
-          actions.START_QUERY, // runQuery (data preview)
           actions.MERGE_TABLE, // getTableExtendedMetadata
-          actions.QUERY_SUCCESS, // querySuccess
           actions.MERGE_TABLE, // addTable
         ];
         return store
-          .dispatch(actions.addTable(query, tableName, schemaName))
+          .dispatch(actions.addTable(query, database, tableName, schemaName))
           .then(() => {
             expect(store.getActions().map(a => a.type)).toEqual(
               expectedActionTypes,
@@ -759,6 +749,47 @@ describe('async actions', () => {
               1,
             );
 
+            // tab state is not updated, since no query was run
+            expect(fetchMock.calls(updateTabStateEndpoint)).toHaveLength(0);
+          });
+      });
+
+      it('updates and runs data preview query when configured', () => {
+        expect.assertions(5);
+
+        const results = {
+          data: mockBigNumber,
+          query: { sqlEditorId: 'null', dbId: 1 },
+          query_id: 'efgh',
+        };
+        fetchMock.post(runQueryEndpoint, JSON.stringify(results), {
+          overwriteRoutes: true,
+        });
+
+        const database = { disable_data_preview: false, id: 1 };
+        const tableName = 'table';
+        const schemaName = 'schema';
+        const store = mockStore({});
+        const expectedActionTypes = [
+          actions.MERGE_TABLE, // addTable
+          actions.MERGE_TABLE, // getTableMetadata
+          actions.MERGE_TABLE, // getTableExtendedMetadata
+          actions.MERGE_TABLE, // addTable (data preview)
+          actions.START_QUERY, // runQuery (data preview)
+          actions.MERGE_TABLE, // addTable
+          actions.QUERY_SUCCESS, // querySuccess
+        ];
+        return store
+          .dispatch(actions.addTable(query, database, tableName, schemaName))
+          .then(() => {
+            expect(store.getActions().map(a => a.type)).toEqual(
+              expectedActionTypes,
+            );
+            expect(fetchMock.calls(updateTableSchemaEndpoint)).toHaveLength(1);
+            expect(fetchMock.calls(getTableMetadataEndpoint)).toHaveLength(1);
+            expect(fetchMock.calls(getExtraTableMetadataEndpoint)).toHaveLength(
+              1,
+            );
             // tab state is not updated, since the query is a data preview
             expect(fetchMock.calls(updateTabStateEndpoint)).toHaveLength(0);
           });

superset-frontend/src/SqlLab/components/AceEditorWrapper/index.tsx

@@ -43,11 +43,17 @@ interface Props {
   actions: {
     queryEditorSetSelectedText: (edit: any, text: null | string) => void;
     queryEditorSetFunctionNames: (queryEditor: object, dbId: number) => void;
-    addTable: (queryEditor: any, value: any, schema: any) => void;
+    addTable: (
+      queryEditor: any,
+      database: any,
+      value: any,
+      schema: any,
+    ) => void;
   };
   autocomplete: boolean;
   onBlur: (sql: string) => void;
   sql: string;
+  database: any;
   schemas: any[];
   tables: any[];
   functionNames: string[];
@@ -210,6 +216,7 @@ class AceEditorWrapper extends React.PureComponent<Props, State> {
         if (data.meta === 'table') {
           this.props.actions.addTable(
             this.props.queryEditor,
+            this.props.database,
             data.value,
             this.props.queryEditor.schema,
           );

superset-frontend/src/SqlLab/components/SqlEditor/index.jsx

@@ -514,6 +514,7 @@ class SqlEditor extends React.PureComponent {
             onChange={this.onSqlChanged}
             queryEditor={this.props.queryEditor}
             sql={this.props.queryEditor.sql}
+            database={this.props.database}
             schemas={this.props.queryEditor.schemaOptions}
             tables={this.props.queryEditor.tableOptions}
             functionNames={this.props.queryEditor.functionNames}

superset-frontend/src/SqlLab/components/SqlEditorLeftBar/index.tsx

@@ -36,7 +36,7 @@ interface actionsTypes {
   queryEditorSetFunctionNames: (queryEditor: QueryEditor, dbId: number) => void;
   collapseTable: (table: Table) => void;
   expandTable: (table: Table) => void;
-  addTable: (queryEditor: any, value: any, schema: any) => void;
+  addTable: (queryEditor: any, database: any, value: any, schema: any) => void;
   setDatabases: (arg0: any) => {};
   addDangerToast: (msg: string) => void;
   queryEditorSetSchema: (queryEditor: QueryEditor, schema?: string) => void;
@@ -103,7 +103,7 @@ export default function SqlEditorLeftBar({
 
   const onTableChange = (tableName: string, schemaName: string) => {
     if (tableName && schemaName) {
-      actions.addTable(queryEditor, tableName, schemaName);
+      actions.addTable(queryEditor, database, tableName, schemaName);
     }
   };