Skip to content

Commit

Permalink
feat(sqllab): Highlight and make actionable table name in the editor
Browse files Browse the repository at this point in the history
  • Loading branch information
justinpark committed Jul 31, 2024
1 parent 06c9f33 commit 80e4290
Show file tree
Hide file tree
Showing 17 changed files with 1,145 additions and 101 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -155,8 +155,10 @@ const defaultTheme = {
},
},
zIndex: {
aboveEditorActiveLine: 3,
aboveDashboardCharts: 10,
dropdown: 11,
belowModal: 900,
max: 3000,
},
transitionTiming: 0.3,
Expand Down
15 changes: 9 additions & 6 deletions superset-frontend/src/SqlLab/actions/sqlLab.js
Original file line number Diff line number Diff line change
Expand Up @@ -237,15 +237,15 @@ export function clearInactiveQueries(interval) {
return { type: CLEAR_INACTIVE_QUERIES, interval };
}

export function startQuery(query) {
export function startQuery(query, runPreviewOnly) {
Object.assign(query, {
id: query.id ? query.id : nanoid(11),
progress: 0,
startDttm: now(),
state: query.runAsync ? 'pending' : 'running',
cached: false,
});
return { type: START_QUERY, query };
return { type: START_QUERY, query, runPreviewOnly };
}

export function querySuccess(query, results) {
Expand Down Expand Up @@ -323,9 +323,9 @@ export function fetchQueryResults(query, displayLimit) {
};
}

export function runQuery(query) {
export function runQuery(query, runPreviewOnly) {
return function (dispatch) {
dispatch(startQuery(query));
dispatch(startQuery(query, runPreviewOnly));
const postPayload = {
client_id: query.id,
database_id: query.dbId,
Expand Down Expand Up @@ -952,7 +952,7 @@ export function addTable(queryEditor, tableName, catalogName, schemaName) {
};
}

export function runTablePreviewQuery(newTable) {
export function runTablePreviewQuery(newTable, runPreviewOnly) {
return function (dispatch, getState) {
const {
sqlLab: { databases },
Expand All @@ -962,7 +962,7 @@ export function runTablePreviewQuery(newTable) {

if (database && !database.disable_data_preview) {
const dataPreviewQuery = {
id: nanoid(11),
id: newTable.previewQueryId ?? nanoid(11),
dbId,
catalog,
schema,
Expand All @@ -974,6 +974,9 @@ export function runTablePreviewQuery(newTable) {
ctas: false,
isDataPreview: true,
};
if (runPreviewOnly) {
return dispatch(runQuery(dataPreviewQuery, runPreviewOnly));
}
return Promise.all([
dispatch(
mergeTable(
Expand Down
70 changes: 51 additions & 19 deletions superset-frontend/src/SqlLab/actions/sqlLab.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -844,30 +844,38 @@ describe('async actions', () => {
});

describe('runTablePreviewQuery', () => {
it('updates and runs data preview query when configured', () => {
expect.assertions(3);
const results = {
data: mockBigNumber,
query: { sqlEditorId: 'null', dbId: 1 },
query_id: 'efgh',
};
const tableName = 'table';
const catalogName = null;
const schemaName = 'schema';
const store = mockStore({
...initialState,
sqlLab: {
...initialState.sqlLab,
databases: {
1: { disable_data_preview: false },
},
},
});

const results = {
data: mockBigNumber,
query: { sqlEditorId: 'null', dbId: 1 },
query_id: 'efgh',
};
beforeEach(() => {
fetchMock.post(runQueryEndpoint, JSON.stringify(results), {
overwriteRoutes: true,
});
});

afterEach(() => {
store.clearActions();
fetchMock.resetHistory();
});

it('updates and runs data preview query when configured', () => {
expect.assertions(3);

const tableName = 'table';
const catalogName = null;
const schemaName = 'schema';
const store = mockStore({
...initialState,
sqlLab: {
...initialState.sqlLab,
databases: {
1: { disable_data_preview: false },
},
},
});
const expectedActionTypes = [
actions.MERGE_TABLE, // addTable (data preview)
actions.START_QUERY, // runQuery (data preview)
Expand All @@ -888,6 +896,30 @@ describe('async actions', () => {
expect(fetchMock.calls(updateTabStateEndpoint)).toHaveLength(0);
});
});

it('runs data preview query only', () => {
const expectedActionTypes = [
actions.START_QUERY, // runQuery (data preview)
actions.QUERY_SUCCESS, // querySuccess
];
const request = actions.runTablePreviewQuery(
{
dbId: 1,
name: tableName,
catalog: catalogName,
schema: schemaName,
},
true,
);
return request(store.dispatch, store.getState).then(() => {
expect(store.getActions().map(a => a.type)).toEqual(
expectedActionTypes,
);
expect(fetchMock.calls(runQueryEndpoint)).toHaveLength(1);
// tab state is not updated, since the query is a data preview
expect(fetchMock.calls(updateTabStateEndpoint)).toHaveLength(0);
});
});
});

describe('expandTable', () => {
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,169 @@
/**
* 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 fetchMock from 'fetch-mock';
import { render } from 'spec/helpers/testing-library';
import { defaultQueryEditor, initialState } from 'src/SqlLab/fixtures';
import AceEditorTokenProvider, {
useTokenContext,
LookUpParams,
} from './AceEditorTokenProvider';
import AceEditorMetadataPopup from '.';

fetchMock.get('glob:*/api/v1/database/*/schemas/?*', {
count: 1,
result: ['main'],
});
fetchMock.get('glob:*/api/v1/database/*/tables/?*', {
result: [
{
label: 'table2',
value: 'table2',
type: 'table',
},
],
});
fetchMock.get('glob:*/api/v1/database/*/table_metadata/extra/*', {});
fetchMock.get('glob:*/api/v1/database/*/table_metadata/?*', {
status: 200,
body: {
name: 'table1',
columns: [
{
name: 'column1',
type: 'VARCHAR',
keys: [],
comment: null,
},
{
name: 'column2',
type: 'VARCHAR',
keys: [],
comment: null,
},
],
},
});

const TestTrigger = (params: Partial<LookUpParams>) => {
const { getMatchTokenData, setActiveTokenData } = useTokenContext();

return (
<button
type="button"
onClick={() => {
const tokenData = getMatchTokenData({
token: {
type: 'keyword',
value: 'table1',
index: 2,
},
siblingTokens: [
{
type: 'keyword',
value: 'main',
index: 0,
},
{
type: 'text',
value: '.',
index: 1,
},
],
position: {
row: 0,
column: 0,
},
...params,
});
if (tokenData) {
const [metadataType, metadata] = tokenData;
setActiveTokenData({
metadataType,
metadata,
markerStyle: { x: 0, y: 0, width: 10 },
});
}
}}
>
Trigger
</button>
);
};

const setup = (params: Partial<LookUpParams>) =>
render(
<AceEditorTokenProvider>
<AceEditorMetadataPopup />
<TestTrigger {...params} />
</AceEditorTokenProvider>,
{
useRedux: true,
initialState: {
...initialState,
sqlLab: {
...initialState.sqlLab,
queryEditors: [
{
...defaultQueryEditor,
dbId: 1,
},
],
tabHistory: [defaultQueryEditor.id],
},
},
},
);

const waitLoadMetadataValidators = () => new Promise(r => setTimeout(r, 300));

test('should pop up the table metadata when sibling token is in the list', async () => {
const { getByText, queryByText, findByText } = await setup({});
expect(queryByText('table1')).not.toBeInTheDocument();
await waitLoadMetadataValidators();
getByText('Trigger').click();
const popupTitle = await findByText('main.table1');
expect(popupTitle).toBeInTheDocument();
expect(getByText('column1')).toBeInTheDocument();
expect(getByText('column2')).toBeInTheDocument();
});

test('should pop up the table metadata when table token is in the list', async () => {
const { getByText, queryByText, findByText } = await setup({
token: { type: 'table', value: 'table2', index: 0 },
siblingTokens: [],
});
expect(queryByText('main.table2')).not.toBeInTheDocument();
await waitLoadMetadataValidators();
getByText('Trigger').click();
const popupTitle = await findByText('main.table2');
expect(popupTitle).toBeInTheDocument();
expect(getByText('column1')).toBeInTheDocument();
expect(getByText('column2')).toBeInTheDocument();
});

test('should ignore poping up when table token is not in the list', async () => {
const { getByText, queryByText } = await setup({
token: { type: 'table', value: 'table3', index: 0 },
siblingTokens: [],
});
expect(queryByText('main.table3')).not.toBeInTheDocument();
await waitLoadMetadataValidators();
getByText('Trigger').click();
expect(queryByText('main.table3')).not.toBeInTheDocument();
});
Loading

0 comments on commit 80e4290

Please sign in to comment.