diff --git a/src/containers/Tenant/Diagnostics/TenantOverview/TenantCpu/TopQueries.tsx b/src/containers/Tenant/Diagnostics/TenantOverview/TenantCpu/TopQueries.tsx index c72044c30c..f6444707da 100644 --- a/src/containers/Tenant/Diagnostics/TenantOverview/TenantCpu/TopQueries.tsx +++ b/src/containers/Tenant/Diagnostics/TenantOverview/TenantCpu/TopQueries.tsx @@ -3,7 +3,7 @@ import React from 'react'; import {useHistory, useLocation} from 'react-router-dom'; import {parseQuery} from '../../../../../routes'; -import {changeUserInput} from '../../../../../store/reducers/executeQuery'; +import {replaceUserInput} from '../../../../../store/reducers/executeQuery'; import { setTopQueriesFilters, topQueriesApi, @@ -52,7 +52,7 @@ export function TopQueries({tenantName}: TopQueriesProps) { (row: any) => { const {QueryText: input} = row; - dispatch(changeUserInput({input})); + dispatch(replaceUserInput({input})); const queryParams = parseQuery(location); diff --git a/src/containers/Tenant/Diagnostics/TopQueries/TopQueries.tsx b/src/containers/Tenant/Diagnostics/TopQueries/TopQueries.tsx index 65e90ca349..562d2c38d6 100644 --- a/src/containers/Tenant/Diagnostics/TopQueries/TopQueries.tsx +++ b/src/containers/Tenant/Diagnostics/TopQueries/TopQueries.tsx @@ -11,7 +11,7 @@ import {DateRange} from '../../../../components/DateRange'; import {Search} from '../../../../components/Search'; import {TableWithControlsLayout} from '../../../../components/TableWithControlsLayout/TableWithControlsLayout'; import {parseQuery} from '../../../../routes'; -import {changeUserInput} from '../../../../store/reducers/executeQuery'; +import {replaceUserInput} from '../../../../store/reducers/executeQuery'; import {setTopQueriesFilters} from '../../../../store/reducers/executeTopQueries/executeTopQueries'; import { TENANT_PAGE, @@ -70,7 +70,7 @@ export const TopQueries = ({tenantName}: TopQueriesProps) => { const onRowClick = React.useCallback( (input: string) => { - dispatch(changeUserInput({input})); + dispatch(replaceUserInput({input})); const queryParams = parseQuery(location); diff --git a/src/containers/Tenant/Query/QueriesHistory/QueriesHistory.tsx b/src/containers/Tenant/Query/QueriesHistory/QueriesHistory.tsx index 6b611a2bb1..db4e961e00 100644 --- a/src/containers/Tenant/Query/QueriesHistory/QueriesHistory.tsx +++ b/src/containers/Tenant/Query/QueriesHistory/QueriesHistory.tsx @@ -26,10 +26,10 @@ const b = cn('ydb-queries-history'); const QUERIES_HISTORY_COLUMNS_WIDTH_LS_KEY = 'queriesHistoryTableColumnsWidth'; interface QueriesHistoryProps { - changeUserInput: (value: {input: string}) => void; + replaceUserInput: (value: {input: string}) => void; } -function QueriesHistory({changeUserInput}: QueriesHistoryProps) { +function QueriesHistory({replaceUserInput}: QueriesHistoryProps) { const dispatch = useTypedDispatch(); const queriesHistory = useTypedSelector(selectQueriesHistory); @@ -37,7 +37,7 @@ function QueriesHistory({changeUserInput}: QueriesHistoryProps) { const reversedHistory = [...queriesHistory].reverse(); const onQueryClick = (query: QueryInHistory) => { - changeUserInput({input: query.queryText}); + replaceUserInput({input: query.queryText}); dispatch(setQueryTab(TENANT_QUERY_TABS_ID.newQuery)); }; diff --git a/src/containers/Tenant/Query/Query.tsx b/src/containers/Tenant/Query/Query.tsx index 1e78eae8e8..7fdbc08051 100644 --- a/src/containers/Tenant/Query/Query.tsx +++ b/src/containers/Tenant/Query/Query.tsx @@ -2,7 +2,7 @@ import React from 'react'; import {Helmet} from 'react-helmet-async'; -import {changeUserInput} from '../../../store/reducers/executeQuery'; +import {changeUserInput, replaceUserInput} from '../../../store/reducers/executeQuery'; import {TENANT_QUERY_TABS_ID} from '../../../store/reducers/tenant/constants'; import type {EPathType} from '../../../types/api/schema'; import {cn} from '../../../utils/cn'; @@ -33,6 +33,10 @@ export const Query = (props: QueryProps) => { dispatch(changeUserInput(value)); }; + const handleUserInputReplace = (value: {input: string}) => { + dispatch(replaceUserInput(value)); + }; + const activeTab = React.useMemo( () => queryEditorTabs.find(({id}) => id === queryTab), [queryTab], @@ -44,10 +48,10 @@ export const Query = (props: QueryProps) => { return ; } case TENANT_QUERY_TABS_ID.history: { - return ; + return ; } case TENANT_QUERY_TABS_ID.saved: { - return ; + return ; } default: { return null; diff --git a/src/containers/Tenant/Query/SavedQueries/SavedQueries.tsx b/src/containers/Tenant/Query/SavedQueries/SavedQueries.tsx index b641ca842b..54ac30c89e 100644 --- a/src/containers/Tenant/Query/SavedQueries/SavedQueries.tsx +++ b/src/containers/Tenant/Query/SavedQueries/SavedQueries.tsx @@ -62,10 +62,10 @@ const DeleteDialog = ({visible, queryName, onCancelClick, onConfirmClick}: Delet const SAVED_QUERIES_COLUMNS_WIDTH_LS_KEY = 'savedQueriesTableColumnsWidth'; interface SavedQueriesProps { - changeUserInput: (value: {input: string}) => void; + replaceUserInput: (value: {input: string}) => void; } -export const SavedQueries = ({changeUserInput}: SavedQueriesProps) => { +export const SavedQueries = ({replaceUserInput}: SavedQueriesProps) => { const savedQueries = useSavedQueries(); const dispatch = useTypedDispatch(); const filter = useTypedSelector(selectSavedQueriesFilter); @@ -89,7 +89,7 @@ export const SavedQueries = ({changeUserInput}: SavedQueriesProps) => { }; const onQueryClick = (queryText: string, queryName: string) => { - changeUserInput({input: queryText}); + replaceUserInput({input: queryText}); dispatch(setQueryNameToEdit(queryName)); dispatch(setQueryTab(TENANT_QUERY_TABS_ID.newQuery)); }; diff --git a/src/containers/Tenant/utils/newSQLQueryActions.ts b/src/containers/Tenant/utils/newSQLQueryActions.ts index 3898160ca2..e5bbdef5c0 100644 --- a/src/containers/Tenant/utils/newSQLQueryActions.ts +++ b/src/containers/Tenant/utils/newSQLQueryActions.ts @@ -1,4 +1,4 @@ -import {changeUserInput} from '../../../store/reducers/executeQuery'; +import {replaceUserInput} from '../../../store/reducers/executeQuery'; import { addTableIndex, @@ -31,7 +31,7 @@ import { export const bindActions = (dispatch: React.Dispatch) => { const inputQuery = (query: () => string) => () => { - dispatch(changeUserInput({input: query()})); + dispatch(replaceUserInput({input: query()})); }; return { diff --git a/src/containers/Tenant/utils/schemaActions.ts b/src/containers/Tenant/utils/schemaActions.ts index 8fd4f2f156..47e41c1cc8 100644 --- a/src/containers/Tenant/utils/schemaActions.ts +++ b/src/containers/Tenant/utils/schemaActions.ts @@ -2,7 +2,7 @@ import copy from 'copy-to-clipboard'; import type {NavigationTreeNodeType, NavigationTreeProps} from 'ydb-ui-components'; import type {AppDispatch} from '../../../store'; -import {changeUserInput} from '../../../store/reducers/executeQuery'; +import {replaceUserInput} from '../../../store/reducers/executeQuery'; import type {GetTableSchemaDataParams} from '../../../store/reducers/tableSchemaData'; import {TENANT_PAGES_IDS, TENANT_QUERY_TABS_ID} from '../../../store/reducers/tenant/constants'; import {setQueryTab, setTenantPage} from '../../../store/reducers/tenant/tenant'; @@ -73,7 +73,7 @@ const bindActions = ( : Promise.resolve(undefined); userInputDataPromise.then((tableData) => { - dispatch(changeUserInput({input: tmpl({...params, tableData})})); + dispatch(replaceUserInput({input: tmpl({...params, tableData})})); }); dispatch(setTenantPage(TENANT_PAGES_IDS.query)); diff --git a/src/store/reducers/executeQuery.ts b/src/store/reducers/executeQuery.ts index b58376567c..eda0936fe7 100644 --- a/src/store/reducers/executeQuery.ts +++ b/src/store/reducers/executeQuery.ts @@ -21,6 +21,7 @@ import {api} from './api'; const MAXIMUM_QUERIES_IN_HISTORY = 20; const CHANGE_USER_INPUT = 'query/CHANGE_USER_INPUT'; +const REPLACE_USER_INPUT = 'query/REPLACE_USER_INPUT'; const SET_QUERY_RESULT = 'query/SET_QUERY_RESULT'; const SET_QUERY_TRACE_READY = 'query/SET_QUERY_TRACE_READY'; const SAVE_QUERY_TO_HISTORY = 'query/SAVE_QUERY_TO_HISTORY'; @@ -57,6 +58,21 @@ const executeQuery: Reducer = ( action, ) => { switch (action.type) { + case REPLACE_USER_INPUT: { + if (action.data.input === state.input) { + return state; + } + + if (window.confirm('Are you sure you want to replace the input?')) { + return { + ...state, + input: action.data.input, + }; + } + + return state; + } + case CHANGE_USER_INPUT: { return { ...state, @@ -353,6 +369,13 @@ export const changeUserInput = ({input}: {input: string}) => { } as const; }; +export const replaceUserInput = ({input}: {input: string}) => { + return { + type: REPLACE_USER_INPUT, + data: {input}, + } as const; +}; + export const setTenantPath = (value: string) => { return { type: SET_TENANT_PATH, diff --git a/src/types/store/executeQuery.ts b/src/types/store/executeQuery.ts index 391a20ae30..76ed0d30cd 100644 --- a/src/types/store/executeQuery.ts +++ b/src/types/store/executeQuery.ts @@ -2,6 +2,7 @@ import type { changeUserInput, goToNextQuery, goToPreviousQuery, + replaceUserInput, saveQueryToHistory, setQueryHistoryFilter, setQueryResult, @@ -62,6 +63,7 @@ export type ExecuteQueryAction = | ReturnType | ReturnType | ReturnType + | ReturnType | ReturnType | ReturnType | ReturnType