chore(frontend): migrate SqlLab and explore JS/JSX files to TypeScript (#36760)

Co-authored-by: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Evan Rusackas
2026-01-06 10:52:58 -08:00
committed by GitHub
parent aaa174f820
commit 9aff89c1b4
69 changed files with 3272 additions and 1482 deletions

View File

@@ -232,7 +232,8 @@ test('returns column keywords among selected tables', async () => {
);
storeWithSqlLab.dispatch(
addTable(
{ id: expectQueryEditorId },
// eslint-disable-next-line @typescript-eslint/no-explicit-any
{ id: expectQueryEditorId } as any,
expectTable,
expectCatalog,
expectSchema,
@@ -276,7 +277,8 @@ test('returns column keywords among selected tables', async () => {
act(() => {
storeWithSqlLab.dispatch(
addTable(
{ id: expectQueryEditorId },
// eslint-disable-next-line @typescript-eslint/no-explicit-any
{ id: expectQueryEditorId } as any,
unexpectedTable,
expectCatalog,
expectSchema,

View File

@@ -149,10 +149,10 @@ export function useKeywords(
if (data.meta === 'table') {
dispatch(
addTable(
{ id: queryEditorId, dbId, tabViewId },
{ id: String(queryEditorId), dbId: dbId as number, tabViewId },
data.value,
catalog,
schema,
catalog ?? null,
schema ?? '',
false, // Don't auto-expand/switch tabs when adding via autocomplete
),
);

View File

@@ -122,7 +122,7 @@ function QueryAutoRefresh({
dispatch(
queryFailed(
query,
query.errorMessage,
query.errorMessage ?? '',
query.extra?.errors?.[0]?.extra?.link,
query.extra?.errors,
),

View File

@@ -344,9 +344,9 @@ export const SaveDatasetModal = ({
dispatch(
createDatasource({
sql: datasource.sql,
dbId: datasource.dbId || datasource?.database?.id,
catalog: datasource?.catalog,
schema: datasource?.schema,
dbId: (datasource.dbId ?? datasource?.database?.id) as number,
catalog: datasource?.catalog ?? null,
schema: datasource?.schema ?? '',
templateParams,
datasourceName: datasetName,
}),

View File

@@ -143,7 +143,9 @@ const SouthPane = ({
({ dbId, catalog, schema, name }) =>
[dbId, catalog, schema, name].join(':') === key,
);
dispatch(removeTables([table]));
if (table) {
dispatch(removeTables([table]));
}
}
},
[dispatch, pinnedTables],

View File

@@ -280,7 +280,8 @@ const SqlEditor: FC<Props> = ({
dispatch(
runQueryFromSqlEditor(
database,
// eslint-disable-next-line @typescript-eslint/no-explicit-any
database as any,
queryEditor,
defaultQueryLimit,
ctasArg ? ctas : '',
@@ -565,8 +566,8 @@ const SqlEditor: FC<Props> = ({
};
const setQueryEditorAndSaveSql = useCallback(
sql => {
dispatch(queryEditorSetAndSaveSql(queryEditor, sql));
(sql: string) => {
dispatch(queryEditorSetAndSaveSql(queryEditor, sql, undefined));
},
[dispatch, queryEditor],
);
@@ -578,7 +579,7 @@ const SqlEditor: FC<Props> = ({
const onSqlChanged = useEffectEvent((sql: string) => {
currentSQL.current = sql;
dispatch(queryEditorSetSql(queryEditor, sql));
dispatch(queryEditorSetSql(queryEditor, sql, undefined));
});
const getQueryCostEstimate = () => {

View File

@@ -31,6 +31,7 @@ import {
setDatabases,
addDangerToast,
resetState,
type Database,
} from 'src/SqlLab/actions/sqlLab';
import { Button, EmptyState, Icons } from '@superset-ui/core/components';
import { type DatabaseObject } from 'src/components';
@@ -194,8 +195,8 @@ const SqlEditorLeftBar = ({ queryEditorId }: SqlEditorLeftBarProps) => {
);
const handleDbList = useCallback(
(result: DatabaseObject) => {
dispatch(setDatabases(result));
(result: DatabaseObject[]) => {
dispatch(setDatabases(result as unknown as Database[]));
},
[dispatch],
);

View File

@@ -171,7 +171,7 @@ const TableElement = ({ table, ...props }: TableElementProps) => {
dispatch(
tableApiUtil.invalidateTags([{ type: 'TableMetadatas', id: name }]),
);
dispatch(syncTable(table, tableData));
dispatch(syncTable(table, tableData, table.queryEditorId));
};
const renderWell = () => {

View File

@@ -1,136 +0,0 @@
/**
* 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 persistState from 'redux-localstorage';
import { pickBy } from 'lodash';
import { isFeatureEnabled, FeatureFlag } from '@superset-ui/core';
import { filterUnsavedQueryEditorList } from 'src/SqlLab/components/EditorAutoSync';
import {
emptyTablePersistData,
emptyQueryResults,
clearQueryEditors,
} from '../utils/reduxStateToLocalStorageHelper';
import { BYTES_PER_CHAR, KB_STORAGE } from '../constants';
const CLEAR_ENTITY_HELPERS_MAP = {
tables: emptyTablePersistData,
queries: emptyQueryResults,
queryEditors: clearQueryEditors,
unsavedQueryEditor: qe => clearQueryEditors([qe])[0],
};
const sqlLabPersistStateConfig = {
paths: ['sqlLab'],
config: {
slicer: paths => state => {
const subset = {};
paths.forEach(path => {
if (isFeatureEnabled(FeatureFlag.SqllabBackendPersistence)) {
const {
queryEditors,
editorTabLastUpdatedAt,
unsavedQueryEditor,
tables,
queries,
tabHistory,
lastUpdatedActiveTab,
destroyedQueryEditors,
} = state.sqlLab;
const unsavedQueryEditors = filterUnsavedQueryEditorList(
queryEditors,
unsavedQueryEditor,
editorTabLastUpdatedAt,
);
const hasUnsavedActiveTabState =
tabHistory.slice(-1)[0] !== lastUpdatedActiveTab;
const hasUnsavedDeletedQueryEditors =
Object.keys(destroyedQueryEditors).length > 0;
if (
unsavedQueryEditors.length > 0 ||
hasUnsavedActiveTabState ||
hasUnsavedDeletedQueryEditors
) {
const hasFinishedMigrationFromLocalStorage =
unsavedQueryEditors.every(
({ inLocalStorage }) => !inLocalStorage,
);
subset.sqlLab = {
queryEditors: unsavedQueryEditors,
...(!hasFinishedMigrationFromLocalStorage && {
tabHistory,
tables: tables.filter(table => table.inLocalStorage),
queries: pickBy(
queries,
query => query.inLocalStorage && !query.isDataPreview,
),
}),
...(hasUnsavedActiveTabState && {
tabHistory,
}),
destroyedQueryEditors,
};
}
return;
}
// this line is used to remove old data from browser localStorage.
// we used to persist all redux state into localStorage, but
// it caused configurations passed from server-side got override.
// see PR 6257 for details
delete state[path].common; // eslint-disable-line no-param-reassign
if (path === 'sqlLab') {
subset[path] = Object.fromEntries(
Object.entries(state[path]).map(([key, value]) => [
key,
CLEAR_ENTITY_HELPERS_MAP[key]?.(value) ?? value,
]),
);
}
});
const data = JSON.stringify(subset);
// 2 digit precision
const currentSize =
Math.round(((data.length * BYTES_PER_CHAR) / KB_STORAGE) * 100) / 100;
if (state.localStorageUsageInKilobytes !== currentSize) {
state.localStorageUsageInKilobytes = currentSize; // eslint-disable-line no-param-reassign
}
return subset;
},
merge: (initialState, persistedState = {}) => {
const result = {
...initialState,
...persistedState,
sqlLab: {
...persistedState?.sqlLab,
// Overwrite initialState over persistedState for sqlLab
// since a logic in getInitialState overrides the value from persistedState
...initialState.sqlLab,
},
};
return result;
},
},
};
// TODO: requires redux-localstorage > 1.0 for typescript support
/** @type {any} */
export const persistSqlLabStateEnhancer = persistState(
sqlLabPersistStateConfig.paths,
sqlLabPersistStateConfig.config,
);

View File

@@ -0,0 +1,185 @@
/**
* 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 type { StoreEnhancer } from 'redux';
import persistState from 'redux-localstorage';
import { pickBy } from 'lodash';
import { isFeatureEnabled, FeatureFlag } from '@superset-ui/core';
import { filterUnsavedQueryEditorList } from 'src/SqlLab/components/EditorAutoSync';
import type {
SqlLabRootState,
QueryEditor,
UnsavedQueryEditor,
Table,
} from '../types';
import {
emptyTablePersistData,
emptyQueryResults,
clearQueryEditors,
} from '../utils/reduxStateToLocalStorageHelper';
import { BYTES_PER_CHAR, KB_STORAGE } from '../constants';
type SqlLabState = SqlLabRootState['sqlLab'];
type ClearEntityHelperValue =
| Table[]
| SqlLabState['queries']
| QueryEditor[]
| UnsavedQueryEditor;
interface ClearEntityHelpersMap {
tables: (tables: Table[]) => ReturnType<typeof emptyTablePersistData>;
queries: (
queries: SqlLabState['queries'],
) => ReturnType<typeof emptyQueryResults>;
queryEditors: (
queryEditors: QueryEditor[],
) => ReturnType<typeof clearQueryEditors>;
unsavedQueryEditor: (
qe: UnsavedQueryEditor,
) => ReturnType<typeof clearQueryEditors>[number];
}
const CLEAR_ENTITY_HELPERS_MAP: ClearEntityHelpersMap = {
tables: emptyTablePersistData,
queries: emptyQueryResults,
queryEditors: clearQueryEditors,
unsavedQueryEditor: (qe: UnsavedQueryEditor) =>
clearQueryEditors([qe as QueryEditor])[0],
};
interface PersistedSqlLabState {
sqlLab?: Partial<SqlLabState>;
localStorageUsageInKilobytes?: number;
}
const sqlLabPersistStateConfig = {
paths: ['sqlLab'],
config: {
slicer:
(paths: string[]) =>
(state: SqlLabRootState): PersistedSqlLabState => {
const subset: PersistedSqlLabState = {};
paths.forEach(path => {
if (isFeatureEnabled(FeatureFlag.SqllabBackendPersistence)) {
const {
queryEditors,
editorTabLastUpdatedAt,
unsavedQueryEditor,
tables,
queries,
tabHistory,
lastUpdatedActiveTab,
destroyedQueryEditors,
} = state.sqlLab;
const unsavedQueryEditors = filterUnsavedQueryEditorList(
queryEditors,
unsavedQueryEditor,
editorTabLastUpdatedAt,
);
const hasUnsavedActiveTabState =
tabHistory.slice(-1)[0] !== lastUpdatedActiveTab;
const hasUnsavedDeletedQueryEditors =
Object.keys(destroyedQueryEditors).length > 0;
if (
unsavedQueryEditors.length > 0 ||
hasUnsavedActiveTabState ||
hasUnsavedDeletedQueryEditors
) {
const hasFinishedMigrationFromLocalStorage =
unsavedQueryEditors.every(
({ inLocalStorage }) => !inLocalStorage,
);
subset.sqlLab = {
queryEditors: unsavedQueryEditors,
...(!hasFinishedMigrationFromLocalStorage && {
tabHistory,
tables: tables.filter(table => table.inLocalStorage),
queries: pickBy(
queries,
query => query.inLocalStorage && !query.isDataPreview,
),
}),
...(hasUnsavedActiveTabState && {
tabHistory,
}),
destroyedQueryEditors,
};
}
return;
}
// this line is used to remove old data from browser localStorage.
// we used to persist all redux state into localStorage, but
// it caused configurations passed from server-side got override.
// see PR 6257 for details
const statePath = state[path as keyof SqlLabRootState];
if (
statePath &&
typeof statePath === 'object' &&
'common' in statePath
) {
delete (statePath as Record<string, unknown>).common; // eslint-disable-line no-param-reassign
}
if (path === 'sqlLab') {
subset[path] = Object.fromEntries(
Object.entries(state[path]).map(([key, value]) => {
const helper = CLEAR_ENTITY_HELPERS_MAP[
key as keyof ClearEntityHelpersMap
] as ((val: ClearEntityHelperValue) => unknown) | undefined;
return [
key,
helper?.(value as ClearEntityHelperValue) ?? value,
];
}),
);
}
});
const data = JSON.stringify(subset);
// 2 digit precision
const currentSize =
Math.round(((data.length * BYTES_PER_CHAR) / KB_STORAGE) * 100) / 100;
if (state.localStorageUsageInKilobytes !== currentSize) {
state.localStorageUsageInKilobytes = currentSize; // eslint-disable-line no-param-reassign
}
return subset;
},
merge: (
initialState: SqlLabRootState,
persistedState: PersistedSqlLabState = {},
) => ({
...initialState,
...persistedState,
sqlLab: {
...persistedState?.sqlLab,
// Overwrite initialState over persistedState for sqlLab
// since a logic in getInitialState overrides the value from persistedState
...initialState.sqlLab,
},
}),
},
};
// redux-localstorage doesn't have TypeScript definitions
// The library returns a StoreEnhancer that persists specified paths to localStorage
// eslint-disable-next-line @typescript-eslint/no-explicit-any
export const persistSqlLabStateEnhancer = (persistState as any)(
sqlLabPersistStateConfig.paths,
sqlLabPersistStateConfig.config,
) as StoreEnhancer;

View File

@@ -20,7 +20,9 @@ import { normalizeTimestamp, QueryState, t } from '@superset-ui/core';
import { isEqual, omit } from 'lodash';
import { shallowEqual } from 'react-redux';
import { now } from '@superset-ui/core/utils/dates';
import type { SqlLabRootState, QueryEditor, Table } from '../types';
import * as actions from '../actions/sqlLab';
import type { SqlLabAction } from '../actions/sqlLab';
import {
addToObject,
alterInObject,
@@ -31,7 +33,14 @@ import {
extendArr,
} from '../../reduxUtils';
function alterUnsavedQueryEditorState(state, updatedState, id, silent = false) {
type SqlLabState = SqlLabRootState['sqlLab'];
function alterUnsavedQueryEditorState(
state: SqlLabState,
updatedState: Partial<QueryEditor>,
id: string,
silent = false,
): Partial<SqlLabState> {
if (state.tabHistory[state.tabHistory.length - 1] !== id) {
const { queryEditors } = alterInArr(
state,
@@ -52,8 +61,12 @@ function alterUnsavedQueryEditorState(state, updatedState, id, silent = false) {
};
}
export default function sqlLabReducer(state = {}, action) {
const actionHandlers = {
export default function sqlLabReducer(
state: SqlLabState = {} as SqlLabState,
action: SqlLabAction,
): SqlLabState {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
const actionHandlers: Record<string, () => any> = {
[actions.ADD_QUERY_EDITOR]() {
const mergeUnsavedState = alterInArr(
state,
@@ -65,10 +78,10 @@ export default function sqlLabReducer(state = {}, action) {
);
const newState = {
...mergeUnsavedState,
tabHistory: [...state.tabHistory, action.queryEditor.id],
tabHistory: [...state.tabHistory, action.queryEditor!.id],
};
return addToArr(newState, 'queryEditors', {
...action.queryEditor,
...action.queryEditor!,
updatedAt: new Date().getTime(),
});
},
@@ -78,23 +91,24 @@ export default function sqlLabReducer(state = {}, action) {
return alterInArr(
state,
'queryEditors',
existing,
// eslint-disable-next-line @typescript-eslint/no-explicit-any
existing as any,
{
remoteId: result.remoteId,
name: query.name,
remoteId: result!.remoteId,
name: (query as { name: string }).name,
},
'id',
);
},
[actions.UPDATE_QUERY_EDITOR]() {
const id = action.alterations.remoteId;
const id = action.alterations!.remoteId;
const existing = state.queryEditors.find(qe => qe.remoteId === id);
if (existing == null) return state;
return alterInArr(
state,
'queryEditors',
existing,
action.alterations,
action.alterations!,
'remoteId',
);
},
@@ -104,19 +118,20 @@ export default function sqlLabReducer(state = {}, action) {
);
const progenitor = {
...queryEditor,
...(state.unsavedQueryEditor.id === queryEditor.id &&
...(state.unsavedQueryEditor.id === queryEditor?.id &&
state.unsavedQueryEditor),
};
const qe = {
remoteId: progenitor.remoteId,
name: t('Copy of %s', progenitor.name),
dbId: action.query.dbId ? action.query.dbId : null,
catalog: action.query.catalog ? action.query.catalog : null,
schema: action.query.schema ? action.query.schema : null,
dbId: action.query!.dbId ? action.query!.dbId : null,
catalog: action.query!.catalog ? action.query!.catalog : null,
schema: action.query!.schema ? action.query!.schema : null,
autorun: true,
sql: action.query.sql,
queryLimit: action.query.queryLimit,
maxRow: action.query.maxRow,
sql: action.query!.sql,
queryLimit: action.query!.queryLimit,
// eslint-disable-next-line @typescript-eslint/no-explicit-any
maxRow: (action.query as any)?.maxRow,
};
const stateWithoutUnsavedState = {
...state,
@@ -124,20 +139,24 @@ export default function sqlLabReducer(state = {}, action) {
};
return sqlLabReducer(
stateWithoutUnsavedState,
actions.addQueryEditor(qe),
// eslint-disable-next-line @typescript-eslint/no-explicit-any
actions.addQueryEditor(qe as any),
);
},
[actions.REMOVE_QUERY_EDITOR]() {
const queryEditor = {
...action.queryEditor,
...(action.queryEditor.id === state.unsavedQueryEditor.id &&
...action.queryEditor!,
...(action.queryEditor!.id === state.unsavedQueryEditor.id &&
state.unsavedQueryEditor),
};
let newState = removeFromArr(state, 'queryEditors', queryEditor);
// List of remaining queryEditor ids
const qeIds = newState.queryEditors.map(qe => qe.tabViewId ?? qe.id);
const qeIds = newState.queryEditors.map(
(qe: QueryEditor) => qe.tabViewId ?? qe.id,
);
const queries = {};
// eslint-disable-next-line @typescript-eslint/no-explicit-any
const queries: any = {};
Object.keys(state.queries).forEach(k => {
const query = state.queries[k];
if (qeIds.indexOf(query.sqlEditorId) > -1) {
@@ -158,18 +177,18 @@ export default function sqlLabReducer(state = {}, action) {
...newState,
tabHistory:
tabHistory.length === 0 && newState.queryEditors.length > 0
? newState.queryEditors.slice(-1).map(qe => qe.id)
? newState.queryEditors.slice(-1).map((qe: QueryEditor) => qe.id)
: tabHistory,
tables,
queries,
unsavedQueryEditor: {
...(action.queryEditor.id !== state.unsavedQueryEditor.id &&
...(action.queryEditor!.id !== state.unsavedQueryEditor.id &&
state.unsavedQueryEditor),
},
destroyedQueryEditors: {
...newState.destroyedQueryEditors,
...(!queryEditor.inLocalStorage && {
[queryEditor.tabViewId ?? queryEditor.id]: Date.now(),
[(queryEditor.tabViewId ?? queryEditor.id)!]: Date.now(),
}),
},
};
@@ -177,19 +196,19 @@ export default function sqlLabReducer(state = {}, action) {
},
[actions.CLEAR_DESTROYED_QUERY_EDITOR]() {
const destroyedQueryEditors = { ...state.destroyedQueryEditors };
delete destroyedQueryEditors[action.queryEditorId];
delete destroyedQueryEditors[action.queryEditorId!];
return { ...state, destroyedQueryEditors };
},
[actions.REMOVE_QUERY]() {
const newQueries = { ...state.queries };
delete newQueries[action.query.id];
delete newQueries[action.query!.id!];
return { ...state, queries: newQueries };
},
[actions.RESET_STATE]() {
return { ...action.sqlLabInitialState };
},
[actions.MERGE_TABLE]() {
const at = { ...action.table };
const at = { ...action.table } as Table;
const existingTableIndex = state.tables.findIndex(
xt =>
xt.dbId === at.dbId &&
@@ -200,7 +219,7 @@ export default function sqlLabReducer(state = {}, action) {
);
if (existingTableIndex >= 0) {
if (action.query) {
at.dataPreviewQueryId = action.query.id;
at.dataPreviewQueryId = action.query!.id;
}
return {
...state,
@@ -228,30 +247,30 @@ export default function sqlLabReducer(state = {}, action) {
};
if (action.query) {
newState = alterInArr(newState, 'tables', at, {
dataPreviewQueryId: action.query.id,
dataPreviewQueryId: action.query!.id,
});
}
return newState;
},
[actions.EXPAND_TABLE]() {
return alterInArr(state, 'tables', action.table, { expanded: true });
return alterInArr(state, 'tables', action.table!, { expanded: true });
},
[actions.REMOVE_DATA_PREVIEW]() {
const queries = { ...state.queries };
delete queries[action.table.dataPreviewQueryId];
const newState = alterInArr(state, 'tables', action.table, {
delete queries[action.table!.dataPreviewQueryId!];
const newState = alterInArr(state, 'tables', action.table!, {
dataPreviewQueryId: null,
});
return { ...newState, queries };
},
[actions.CHANGE_DATA_PREVIEW_ID]() {
const queries = { ...state.queries };
delete queries[action.oldQueryId];
delete queries[action.oldQueryId!];
const newTables = [];
const newTables: Table[] = [];
state.tables.forEach(xt => {
if (xt.dataPreviewQueryId === action.oldQueryId) {
newTables.push({ ...xt, dataPreviewQueryId: action.newQuery.id });
newTables.push({ ...xt, dataPreviewQueryId: action.newQuery!.id });
} else {
newTables.push(xt);
}
@@ -263,20 +282,20 @@ export default function sqlLabReducer(state = {}, action) {
};
},
[actions.COLLAPSE_TABLE]() {
return alterInArr(state, 'tables', action.table, { expanded: false });
return alterInArr(state, 'tables', action.table!, { expanded: false });
},
[actions.REMOVE_TABLES]() {
const tableIds = action.tables.map(table => table.id);
const tableIds = action.tables!.map((table: Table) => table.id);
const tables = state.tables.filter(table => !tableIds.includes(table.id));
return {
...state,
tables,
...(tableIds.includes(state.activeSouthPaneTab) && {
...(tableIds.includes(state.activeSouthPaneTab as string) && {
activeSouthPaneTab:
tables.find(
({ queryEditorId }) =>
queryEditorId === action.tables[0].queryEditorId,
queryEditorId === action.tables![0].queryEditorId,
)?.id ?? 'Results',
}),
};
@@ -286,7 +305,7 @@ export default function sqlLabReducer(state = {}, action) {
...state,
queryCostEstimates: {
...state.queryCostEstimates,
[action.query.id]: {
[action.query!.id!]: {
completed: false,
cost: null,
error: null,
@@ -299,9 +318,9 @@ export default function sqlLabReducer(state = {}, action) {
...state,
queryCostEstimates: {
...state.queryCostEstimates,
[action.query.id]: {
[action.query!.id!]: {
completed: true,
cost: action.json.result,
cost: action.json!.result,
error: null,
},
},
@@ -312,7 +331,7 @@ export default function sqlLabReducer(state = {}, action) {
...state,
queryCostEstimates: {
...state.queryCostEstimates,
[action.query.id]: {
[action.query!.id!]: {
completed: false,
cost: null,
error: action.error,
@@ -323,15 +342,19 @@ export default function sqlLabReducer(state = {}, action) {
[actions.START_QUERY]() {
let newState = { ...state };
let sqlEditorId;
if (action.query.sqlEditorId) {
if (action.query!.sqlEditorId) {
const queryEditorByTabId = getFromArr(
state.queryEditors,
action.query.sqlEditorId,
action.query!.sqlEditorId,
'tabViewId',
);
sqlEditorId = queryEditorByTabId?.id ?? action.query.sqlEditorId;
sqlEditorId =
(queryEditorByTabId as QueryEditor | undefined)?.id ??
action.query!.sqlEditorId;
const foundQueryEditor = getFromArr(state.queryEditors, sqlEditorId);
const baseQe = foundQueryEditor || {};
const qe = {
...getFromArr(state.queryEditors, sqlEditorId),
...baseQe,
...(sqlEditorId === state.unsavedQueryEditor.id &&
state.unsavedQueryEditor),
};
@@ -342,40 +365,44 @@ export default function sqlLabReducer(state = {}, action) {
query: null,
};
const q = { ...state.queries[qe.latestQueryId], results: newResults };
const queries = { ...state.queries, [q.id]: q };
const queries = {
...state.queries,
[q.id]: q,
} as SqlLabState['queries'];
newState = { ...state, queries };
}
}
newState = addToObject(newState, 'queries', action.query);
newState = addToObject(newState, 'queries', action.query!) as SqlLabState;
return {
...newState,
...alterUnsavedQueryEditorState(
state,
{
latestQueryId: action.query.id,
latestQueryId: action.query!.id,
},
sqlEditorId,
action.query.isDataPreview,
sqlEditorId!,
action.query!.isDataPreview,
),
};
},
[actions.STOP_QUERY]() {
return alterInObject(state, 'queries', action.query, {
return alterInObject(state, 'queries', action.query!, {
state: QueryState.Stopped,
results: [],
});
},
[actions.CLEAR_QUERY_RESULTS]() {
const newResults = { ...action.query.results };
// eslint-disable-next-line @typescript-eslint/no-explicit-any
const newResults = { ...(action.query as any).results };
newResults.data = [];
return alterInObject(state, 'queries', action.query, {
return alterInObject(state, 'queries', action.query!, {
results: newResults,
cached: true,
});
},
[actions.REQUEST_QUERY_RESULTS]() {
return alterInObject(state, 'queries', action.query, {
return alterInObject(state, 'queries', action.query!, {
state: QueryState.Fetching,
});
},
@@ -383,12 +410,13 @@ export default function sqlLabReducer(state = {}, action) {
// prevent race condition where query succeeds shortly after being canceled
// or the final result was unsuccessful
if (
action.query.state === QueryState.STOPPED ||
action.results.status !== QueryState.Success
action.query!.state === QueryState.Stopped ||
(action.results as { status?: string })?.status !== QueryState.Success
) {
return state;
}
const alts = {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
const alts: any = {
endDttm: now(),
progress: 100,
results: action.results,
@@ -407,10 +435,10 @@ export default function sqlLabReducer(state = {}, action) {
alts.resultsKey = resultsKey;
}
return alterInObject(state, 'queries', action.query, alts);
return alterInObject(state, 'queries', action.query!, alts);
},
[actions.QUERY_FAILED]() {
if (action.query.state === QueryState.Stopped) {
if (action.query!.state === QueryState.Stopped) {
return state;
}
const alts = {
@@ -420,13 +448,13 @@ export default function sqlLabReducer(state = {}, action) {
endDttm: now(),
link: action.link,
};
return alterInObject(state, 'queries', action.query, alts);
return alterInObject(state, 'queries', action.query!, alts);
},
[actions.SET_ACTIVE_QUERY_EDITOR]() {
const qeIds = state.queryEditors.map(qe => qe.id);
if (
qeIds.indexOf(action.queryEditor?.id) > -1 &&
state.tabHistory[state.tabHistory.length - 1] !== action.queryEditor.id
qeIds.indexOf(action.queryEditor!.id!) > -1 &&
state.tabHistory[state.tabHistory.length - 1] !== action.queryEditor!.id
) {
const mergeUnsavedState = {
...alterInArr(state, 'queryEditors', state.unsavedQueryEditor, {
@@ -435,18 +463,18 @@ export default function sqlLabReducer(state = {}, action) {
unsavedQueryEditor: {},
};
return {
...(action.queryEditor.id === state.unsavedQueryEditor.id
...(action.queryEditor!.id === state.unsavedQueryEditor.id
? alterInArr(
mergeUnsavedState,
'queryEditors',
action.queryEditor,
action.queryEditor!,
{
...action.queryEditor,
...action.queryEditor!,
...state.unsavedQueryEditor,
},
)
: mergeUnsavedState),
tabHistory: [...state.tabHistory, action.queryEditor.id],
tabHistory: [...state.tabHistory, action.queryEditor!.id],
};
}
return state;
@@ -460,12 +488,17 @@ export default function sqlLabReducer(state = {}, action) {
...state.unsavedQueryEditor,
},
);
return alterInArr(mergeUnsavedState, 'queryEditors', action.queryEditor, {
...action.queryEditor,
});
return alterInArr(
mergeUnsavedState,
'queryEditors',
action.queryEditor!,
{
...action.queryEditor!,
},
);
},
[actions.SET_TABLES]() {
return extendArr(state, 'tables', action.tables);
return extendArr(state, 'tables', action.tables!);
},
[actions.SET_ACTIVE_SOUTHPANE_TAB]() {
return { ...state, activeSouthPaneTab: action.tabId };
@@ -473,9 +506,9 @@ export default function sqlLabReducer(state = {}, action) {
[actions.MIGRATE_QUERY_EDITOR]() {
try {
// remove migrated query editor from localStorage
const { sqlLab } = JSON.parse(localStorage.getItem('redux'));
const { sqlLab } = JSON.parse(localStorage.getItem('redux') || '{}');
sqlLab.queryEditors = sqlLab.queryEditors.filter(
qe => qe.id !== action.oldQueryEditor.id,
(qe: QueryEditor) => qe.id !== action.oldQueryEditor!.id,
);
localStorage.setItem('redux', JSON.stringify({ sqlLab }));
} catch (error) {
@@ -485,16 +518,16 @@ export default function sqlLabReducer(state = {}, action) {
return alterInArr(
state,
'queryEditors',
action.oldQueryEditor,
action.newQueryEditor,
action.oldQueryEditor!,
action.newQueryEditor!,
);
},
[actions.MIGRATE_TABLE]() {
try {
// remove migrated table from localStorage
const { sqlLab } = JSON.parse(localStorage.getItem('redux'));
const { sqlLab } = JSON.parse(localStorage.getItem('redux') || '{}');
sqlLab.tables = sqlLab.tables.filter(
table => table.id !== action.oldTable.id,
(table: Table) => table.id !== action.oldTable!.id,
);
localStorage.setItem('redux', JSON.stringify({ sqlLab }));
} catch (error) {
@@ -503,14 +536,14 @@ export default function sqlLabReducer(state = {}, action) {
// replace localStorage table with the server backed one
return addToArr(
removeFromArr(state, 'tables', action.oldTable),
removeFromArr(state, 'tables', action.oldTable!),
'tables',
action.newTable,
action.newTable!,
);
},
[actions.MIGRATE_QUERY]() {
const query = {
...state.queries[action.queryId],
...state.queries[action.queryId!],
// point query to migrated query editor
sqlEditorId: action.queryEditorId,
};
@@ -525,7 +558,7 @@ export default function sqlLabReducer(state = {}, action) {
{
dbId: action.dbId,
},
action.queryEditor.id,
action.queryEditor!.id!,
),
};
},
@@ -537,7 +570,7 @@ export default function sqlLabReducer(state = {}, action) {
{
catalog: action.catalog,
},
action.queryEditor.id,
action.queryEditor!.id!,
),
};
},
@@ -547,9 +580,9 @@ export default function sqlLabReducer(state = {}, action) {
...alterUnsavedQueryEditorState(
state,
{
schema: action.schema,
schema: action.schema ?? undefined,
},
action.queryEditor.id,
action.queryEditor!.id!,
),
};
},
@@ -561,14 +594,14 @@ export default function sqlLabReducer(state = {}, action) {
{
name: action.name,
},
action.queryEditor.id,
action.queryEditor!.id!,
),
};
},
[actions.QUERY_EDITOR_SET_SQL]() {
const { unsavedQueryEditor } = state;
if (
unsavedQueryEditor?.id === action.queryEditor.id &&
unsavedQueryEditor?.id === action.queryEditor!.id &&
unsavedQueryEditor.sql === action.sql
) {
return state;
@@ -578,10 +611,10 @@ export default function sqlLabReducer(state = {}, action) {
...alterUnsavedQueryEditorState(
state,
{
sql: action.sql,
sql: action.sql ?? undefined,
...(action.queryId && { latestQueryId: action.queryId }),
},
action.queryEditor.id,
action.queryEditor!.id!,
),
};
},
@@ -593,7 +626,7 @@ export default function sqlLabReducer(state = {}, action) {
{
cursorPosition: action.position,
},
action.queryEditor.id,
action.queryEditor!.id!,
),
};
},
@@ -605,7 +638,7 @@ export default function sqlLabReducer(state = {}, action) {
{
queryLimit: action.queryLimit,
},
action.queryEditor.id,
action.queryEditor!.id!,
),
};
},
@@ -617,7 +650,7 @@ export default function sqlLabReducer(state = {}, action) {
{
templateParams: action.templateParams,
},
action.queryEditor.id,
action.queryEditor!.id!,
),
};
},
@@ -627,9 +660,9 @@ export default function sqlLabReducer(state = {}, action) {
...alterUnsavedQueryEditorState(
state,
{
selectedText: action.sql,
selectedText: action.sql ?? undefined,
},
action.queryEditor.id,
action.queryEditor!.id!,
true,
),
};
@@ -642,7 +675,7 @@ export default function sqlLabReducer(state = {}, action) {
{
autorun: action.autorun,
},
action.queryEditor.id,
action.queryEditor!.id!,
),
};
},
@@ -655,7 +688,7 @@ export default function sqlLabReducer(state = {}, action) {
northPercent: action.northPercent,
southPercent: action.southPercent,
},
action.queryEditor.id,
action.queryEditor!.id!,
),
};
},
@@ -667,13 +700,15 @@ export default function sqlLabReducer(state = {}, action) {
{
hideLeftBar: action.hideLeftBar,
},
action.queryEditor.id,
action.queryEditor!.id!,
),
};
},
[actions.SET_DATABASES]() {
const databases = {};
action.databases.forEach(db => {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
const databases: any = {};
// eslint-disable-next-line @typescript-eslint/no-explicit-any
(action.databases as any[])!.forEach((db: any) => {
databases[db.id] = {
...db,
extra_json: JSON.parse(db.extra || ''),
@@ -686,54 +721,57 @@ export default function sqlLabReducer(state = {}, action) {
// Fetch the updates to the queries present in the store.
let change = false;
let { queriesLastUpdate } = state;
Object.entries(action.alteredQueries).forEach(([id, changedQuery]) => {
if (
!state.queries.hasOwnProperty(id) ||
(state.queries[id].state !== QueryState.Stopped &&
state.queries[id].state !== QueryState.Failed)
) {
const changedOn = normalizeTimestamp(changedQuery.changed_on);
const timestamp = Date.parse(changedOn);
if (timestamp > queriesLastUpdate) {
queriesLastUpdate = timestamp;
}
const prevState = state.queries[id]?.state;
const currentState = changedQuery.state;
newQueries[id] = {
...state.queries[id],
...changedQuery,
...(changedQuery.startDttm && {
startDttm: Number(changedQuery.startDttm),
}),
...(changedQuery.endDttm && {
endDttm: Number(changedQuery.endDttm),
}),
// race condition:
// because of async behavior, sql lab may still poll a couple of seconds
// when it started fetching or finished rendering results
state:
currentState === QueryState.Success &&
[
QueryState.Fetching,
QueryState.Success,
QueryState.Running,
].includes(prevState)
? prevState
: currentState,
};
// eslint-disable-next-line @typescript-eslint/no-explicit-any
Object.entries(action.alteredQueries!).forEach(
([id, changedQuery]: [string, any]) => {
if (
shallowEqual(
omit(newQueries[id], ['extra']),
omit(state.queries[id], ['extra']),
) &&
isEqual(newQueries[id].extra, state.queries[id].extra)
!state.queries.hasOwnProperty(id) ||
(state.queries[id].state !== QueryState.Stopped &&
state.queries[id].state !== QueryState.Failed)
) {
newQueries[id] = state.queries[id];
} else {
change = true;
const changedOn = normalizeTimestamp(changedQuery.changed_on);
const timestamp = Date.parse(changedOn);
if (timestamp > queriesLastUpdate) {
queriesLastUpdate = timestamp;
}
const prevState = state.queries[id]?.state;
const currentState = changedQuery.state;
newQueries[id] = {
...state.queries[id],
...changedQuery,
...(changedQuery.startDttm && {
startDttm: Number(changedQuery.startDttm),
}),
...(changedQuery.endDttm && {
endDttm: Number(changedQuery.endDttm),
}),
// race condition:
// because of async behavior, sql lab may still poll a couple of seconds
// when it started fetching or finished rendering results
state:
currentState === QueryState.Success &&
[
QueryState.Fetching,
QueryState.Success,
QueryState.Running,
].includes(prevState)
? prevState
: currentState,
};
if (
shallowEqual(
omit(newQueries[id], ['extra']),
omit(state.queries[id], ['extra']),
) &&
isEqual(newQueries[id].extra, state.queries[id].extra)
) {
newQueries[id] = state.queries[id];
} else {
change = true;
}
}
}
});
},
);
if (!change) {
newQueries = state.queries;
}
@@ -746,14 +784,15 @@ export default function sqlLabReducer(state = {}, action) {
.filter(([, query]) => {
if (
['running', 'pending'].includes(query.state) &&
Date.now() - query.startDttm > action.interval &&
Date.now() - query.startDttm > action.interval! &&
query.progress === 0
) {
return false;
}
return true;
})
.map(([id, query]) => [
// eslint-disable-next-line @typescript-eslint/no-explicit-any
.map(([id, query]: [string, any]) => [
id,
{
...query,