diff --git a/public/app/features/explore/state/actionTypes.ts b/public/app/features/explore/state/actionTypes.ts index ed0995cff17..b267da4f2c1 100644 --- a/public/app/features/explore/state/actionTypes.ts +++ b/public/app/features/explore/state/actionTypes.ts @@ -47,52 +47,66 @@ export enum ActionTypes { export interface AddQueryRowAction { type: ActionTypes.AddQueryRow; - exploreId: ExploreId; - index: number; - query: DataQuery; + payload: { + exploreId: ExploreId; + index: number; + query: DataQuery; + }; } export interface ChangeQueryAction { type: ActionTypes.ChangeQuery; - exploreId: ExploreId; - query: DataQuery; - index: number; - override: boolean; + payload: { + exploreId: ExploreId; + query: DataQuery; + index: number; + override: boolean; + }; } export interface ChangeSizeAction { type: ActionTypes.ChangeSize; - exploreId: ExploreId; - width: number; - height: number; + payload: { + exploreId: ExploreId; + width: number; + height: number; + }; } export interface ChangeTimeAction { type: ActionTypes.ChangeTime; - exploreId: ExploreId; - range: TimeRange; + payload: { + exploreId: ExploreId; + range: TimeRange; + }; } export interface ClearQueriesAction { type: ActionTypes.ClearQueries; - exploreId: ExploreId; + payload: { + exploreId: ExploreId; + }; } export interface HighlightLogsExpressionAction { type: ActionTypes.HighlightLogsExpression; - exploreId: ExploreId; - expressions: string[]; + payload: { + exploreId: ExploreId; + expressions: string[]; + }; } export interface InitializeExploreAction { type: ActionTypes.InitializeExplore; - exploreId: ExploreId; - containerWidth: number; - datasource: string; - eventBridge: Emitter; - exploreDatasources: DataSourceSelectItem[]; - queries: DataQuery[]; - range: RawTimeRange; + payload: { + exploreId: ExploreId; + containerWidth: number; + datasource: string; + eventBridge: Emitter; + exploreDatasources: DataSourceSelectItem[]; + queries: DataQuery[]; + range: RawTimeRange; + }; } export interface InitializeExploreSplitAction { @@ -101,97 +115,125 @@ export interface InitializeExploreSplitAction { export interface LoadDatasourceFailureAction { type: ActionTypes.LoadDatasourceFailure; - exploreId: ExploreId; - error: string; + payload: { + exploreId: ExploreId; + error: string; + }; } export interface LoadDatasourcePendingAction { type: ActionTypes.LoadDatasourcePending; - exploreId: ExploreId; - datasourceId: number; + payload: { + exploreId: ExploreId; + datasourceId: number; + }; } export interface LoadDatasourceMissingAction { type: ActionTypes.LoadDatasourceMissing; - exploreId: ExploreId; + payload: { + exploreId: ExploreId; + }; } export interface LoadDatasourceSuccessAction { type: ActionTypes.LoadDatasourceSuccess; - exploreId: ExploreId; - StartPage?: any; - datasourceInstance: any; - history: HistoryItem[]; - initialDatasource: string; - initialQueries: DataQuery[]; - logsHighlighterExpressions?: any[]; - showingStartPage: boolean; - supportsGraph: boolean; - supportsLogs: boolean; - supportsTable: boolean; + payload: { + exploreId: ExploreId; + StartPage?: any; + datasourceInstance: any; + history: HistoryItem[]; + initialDatasource: string; + initialQueries: DataQuery[]; + logsHighlighterExpressions?: any[]; + showingStartPage: boolean; + supportsGraph: boolean; + supportsLogs: boolean; + supportsTable: boolean; + }; } export interface ModifyQueriesAction { type: ActionTypes.ModifyQueries; - exploreId: ExploreId; - modification: any; - index: number; - modifier: (queries: DataQuery[], modification: any) => DataQuery[]; + payload: { + exploreId: ExploreId; + modification: any; + index: number; + modifier: (queries: DataQuery[], modification: any) => DataQuery[]; + }; } export interface QueryTransactionFailureAction { type: ActionTypes.QueryTransactionFailure; - exploreId: ExploreId; - queryTransactions: QueryTransaction[]; + payload: { + exploreId: ExploreId; + queryTransactions: QueryTransaction[]; + }; } export interface QueryTransactionStartAction { type: ActionTypes.QueryTransactionStart; - exploreId: ExploreId; - resultType: ResultType; - rowIndex: number; - transaction: QueryTransaction; + payload: { + exploreId: ExploreId; + resultType: ResultType; + rowIndex: number; + transaction: QueryTransaction; + }; } export interface QueryTransactionSuccessAction { type: ActionTypes.QueryTransactionSuccess; - exploreId: ExploreId; - history: HistoryItem[]; - queryTransactions: QueryTransaction[]; + payload: { + exploreId: ExploreId; + history: HistoryItem[]; + queryTransactions: QueryTransaction[]; + }; } export interface RemoveQueryRowAction { type: ActionTypes.RemoveQueryRow; - exploreId: ExploreId; - index: number; + payload: { + exploreId: ExploreId; + index: number; + }; } export interface RunQueriesEmptyAction { type: ActionTypes.RunQueriesEmpty; - exploreId: ExploreId; + payload: { + exploreId: ExploreId; + }; } export interface ScanStartAction { type: ActionTypes.ScanStart; - exploreId: ExploreId; - scanner: RangeScanner; + payload: { + exploreId: ExploreId; + scanner: RangeScanner; + }; } export interface ScanRangeAction { type: ActionTypes.ScanRange; - exploreId: ExploreId; - range: RawTimeRange; + payload: { + exploreId: ExploreId; + range: RawTimeRange; + }; } export interface ScanStopAction { type: ActionTypes.ScanStop; - exploreId: ExploreId; + payload: { + exploreId: ExploreId; + }; } export interface SetQueriesAction { type: ActionTypes.SetQueries; - exploreId: ExploreId; - queries: DataQuery[]; + payload: { + exploreId: ExploreId; + queries: DataQuery[]; + }; } export interface SplitCloseAction { @@ -200,7 +242,9 @@ export interface SplitCloseAction { export interface SplitOpenAction { type: ActionTypes.SplitOpen; - itemState: ExploreItemState; + payload: { + itemState: ExploreItemState; + }; } export interface StateSaveAction { @@ -209,17 +253,23 @@ export interface StateSaveAction { export interface ToggleTableAction { type: ActionTypes.ToggleTable; - exploreId: ExploreId; + payload: { + exploreId: ExploreId; + }; } export interface ToggleGraphAction { type: ActionTypes.ToggleGraph; - exploreId: ExploreId; + payload: { + exploreId: ExploreId; + }; } export interface ToggleLogsAction { type: ActionTypes.ToggleLogs; - exploreId: ExploreId; + payload: { + exploreId: ExploreId; + }; } export type Action = diff --git a/public/app/features/explore/state/actions.ts b/public/app/features/explore/state/actions.ts index ecfb35c8c2f..ae0bce6a019 100644 --- a/public/app/features/explore/state/actions.ts +++ b/public/app/features/explore/state/actions.ts @@ -52,7 +52,7 @@ type ThunkResult = ThunkAction; */ export function addQueryRow(exploreId: ExploreId, index: number): AddQueryRowAction { const query = generateEmptyQuery(index + 1); - return { type: ActionTypes.AddQueryRow, exploreId, index, query }; + return { type: ActionTypes.AddQueryRow, payload: { exploreId, index, query } }; } /** @@ -81,7 +81,7 @@ export function changeQuery( query = { ...generateEmptyQuery(index) }; } - dispatch({ type: ActionTypes.ChangeQuery, exploreId, query, index, override }); + dispatch({ type: ActionTypes.ChangeQuery, payload: { exploreId, query, index, override } }); if (override) { dispatch(runQueries(exploreId)); } @@ -96,7 +96,7 @@ export function changeSize( exploreId: ExploreId, { height, width }: { height: number; width: number } ): ChangeSizeAction { - return { type: ActionTypes.ChangeSize, exploreId, height, width }; + return { type: ActionTypes.ChangeSize, payload: { exploreId, height, width } }; } /** @@ -104,7 +104,7 @@ export function changeSize( */ export function changeTime(exploreId: ExploreId, range: TimeRange): ThunkResult { return dispatch => { - dispatch({ type: ActionTypes.ChangeTime, exploreId, range }); + dispatch({ type: ActionTypes.ChangeTime, payload: { exploreId, range } }); dispatch(runQueries(exploreId)); }; } @@ -115,7 +115,7 @@ export function changeTime(exploreId: ExploreId, range: TimeRange): ThunkResult< export function clearQueries(exploreId: ExploreId): ThunkResult { return dispatch => { dispatch(scanStop(exploreId)); - dispatch({ type: ActionTypes.ClearQueries, exploreId }); + dispatch({ type: ActionTypes.ClearQueries, payload: { exploreId } }); dispatch(stateSave()); }; } @@ -124,7 +124,7 @@ export function clearQueries(exploreId: ExploreId): ThunkResult { * Highlight expressions in the log results */ export function highlightLogsExpression(exploreId: ExploreId, expressions: string[]): HighlightLogsExpressionAction { - return { type: ActionTypes.HighlightLogsExpression, exploreId, expressions }; + return { type: ActionTypes.HighlightLogsExpression, payload: { exploreId, expressions } }; } /** @@ -150,13 +150,15 @@ export function initializeExplore( dispatch({ type: ActionTypes.InitializeExplore, - exploreId, - containerWidth, - datasource, - eventBridge, - exploreDatasources, - queries, - range, + payload: { + exploreId, + containerWidth, + datasource, + eventBridge, + exploreDatasources, + queries, + range, + }, }); if (exploreDatasources.length > 1) { @@ -187,8 +189,10 @@ export function initializeExploreSplit() { */ export const loadDatasourceFailure = (exploreId: ExploreId, error: string): LoadDatasourceFailureAction => ({ type: ActionTypes.LoadDatasourceFailure, - exploreId, - error, + payload: { + exploreId, + error, + }, }); /** @@ -196,7 +200,7 @@ export const loadDatasourceFailure = (exploreId: ExploreId, error: string): Load */ export const loadDatasourceMissing = (exploreId: ExploreId): LoadDatasourceMissingAction => ({ type: ActionTypes.LoadDatasourceMissing, - exploreId, + payload: { exploreId }, }); /** @@ -204,8 +208,10 @@ export const loadDatasourceMissing = (exploreId: ExploreId): LoadDatasourceMissi */ export const loadDatasourcePending = (exploreId: ExploreId, datasourceId: number): LoadDatasourcePendingAction => ({ type: ActionTypes.LoadDatasourcePending, - exploreId, - datasourceId, + payload: { + exploreId, + datasourceId, + }, }); /** @@ -232,16 +238,18 @@ export const loadDatasourceSuccess = ( return { type: ActionTypes.LoadDatasourceSuccess, - exploreId, - StartPage, - datasourceInstance: instance, - history, - initialDatasource: instance.name, - initialQueries: queries, - showingStartPage: Boolean(StartPage), - supportsGraph, - supportsLogs, - supportsTable, + payload: { + exploreId, + StartPage, + datasourceInstance: instance, + history, + initialDatasource: instance.name, + initialQueries: queries, + showingStartPage: Boolean(StartPage), + supportsGraph, + supportsLogs, + supportsTable, + }, }; }; @@ -323,7 +331,7 @@ export function modifyQueries( modifier: any ): ThunkResult { return dispatch => { - dispatch({ type: ActionTypes.ModifyQueries, exploreId, modification, index, modifier }); + dispatch({ type: ActionTypes.ModifyQueries, payload: { exploreId, modification, index, modifier } }); if (!modification.preventSubmit) { dispatch(runQueries(exploreId)); } @@ -349,7 +357,7 @@ export function queryTransactionFailure( // Transaction might have been discarded if (!queryTransactions.find(qt => qt.id === transactionId)) { - return null; + return; } console.error(response); @@ -388,7 +396,10 @@ export function queryTransactionFailure( return qt; }); - dispatch({ type: ActionTypes.QueryTransactionFailure, exploreId, queryTransactions: nextQueryTransactions }); + dispatch({ + type: ActionTypes.QueryTransactionFailure, + payload: { exploreId, queryTransactions: nextQueryTransactions }, + }); }; } @@ -405,7 +416,7 @@ export function queryTransactionStart( resultType: ResultType, rowIndex: number ): QueryTransactionStartAction { - return { type: ActionTypes.QueryTransactionStart, exploreId, resultType, rowIndex, transaction }; + return { type: ActionTypes.QueryTransactionStart, payload: { exploreId, resultType, rowIndex, transaction } }; } /** @@ -466,9 +477,11 @@ export function queryTransactionSuccess( dispatch({ type: ActionTypes.QueryTransactionSuccess, - exploreId, - history: nextHistory, - queryTransactions: nextQueryTransactions, + payload: { + exploreId, + history: nextHistory, + queryTransactions: nextQueryTransactions, + }, }); // Keep scanning for results if this was the last scanning transaction @@ -477,7 +490,7 @@ export function queryTransactionSuccess( const other = nextQueryTransactions.find(qt => qt.scanning && !qt.done); if (!other) { const range = scanner(); - dispatch({ type: ActionTypes.ScanRange, exploreId, range }); + dispatch({ type: ActionTypes.ScanRange, payload: { exploreId, range } }); } } else { // We can stop scanning if we have a result @@ -492,7 +505,7 @@ export function queryTransactionSuccess( */ export function removeQueryRow(exploreId: ExploreId, index: number): ThunkResult { return dispatch => { - dispatch({ type: ActionTypes.RemoveQueryRow, exploreId, index }); + dispatch({ type: ActionTypes.RemoveQueryRow, payload: { exploreId, index } }); dispatch(runQueries(exploreId)); }; } @@ -514,7 +527,7 @@ export function runQueries(exploreId: ExploreId) { } = getState().explore[exploreId]; if (!hasNonEmptyQuery(modifiedQueries)) { - dispatch({ type: ActionTypes.RunQueriesEmpty, exploreId }); + dispatch({ type: ActionTypes.RunQueriesEmpty, payload: { exploreId } }); return; } @@ -618,11 +631,11 @@ function runQueriesForType( export function scanStart(exploreId: ExploreId, scanner: RangeScanner): ThunkResult { return dispatch => { // Register the scanner - dispatch({ type: ActionTypes.ScanStart, exploreId, scanner }); + dispatch({ type: ActionTypes.ScanStart, payload: { exploreId, scanner } }); // Scanning must trigger query run, and return the new range const range = scanner(); // Set the new range to be displayed - dispatch({ type: ActionTypes.ScanRange, exploreId, range }); + dispatch({ type: ActionTypes.ScanRange, payload: { exploreId, range } }); }; } @@ -630,7 +643,7 @@ export function scanStart(exploreId: ExploreId, scanner: RangeScanner): ThunkRes * Stop any scanning for more results. */ export function scanStop(exploreId: ExploreId): ScanStopAction { - return { type: ActionTypes.ScanStop, exploreId }; + return { type: ActionTypes.ScanStop, payload: { exploreId } }; } /** @@ -643,8 +656,10 @@ export function setQueries(exploreId: ExploreId, rawQueries: DataQuery[]): Thunk const queries = rawQueries.map(q => ({ ...q, ...generateEmptyQuery() })); dispatch({ type: ActionTypes.SetQueries, - exploreId, - queries, + payload: { + exploreId, + queries, + }, }); dispatch(runQueries(exploreId)); }; @@ -674,7 +689,7 @@ export function splitOpen(): ThunkResult { queryTransactions: [], initialQueries: leftState.modifiedQueries.slice(), }; - dispatch({ type: ActionTypes.SplitOpen, itemState }); + dispatch({ type: ActionTypes.SplitOpen, payload: { itemState } }); dispatch(stateSave()); }; } @@ -710,7 +725,7 @@ export function stateSave() { */ export function toggleGraph(exploreId: ExploreId): ThunkResult { return (dispatch, getState) => { - dispatch({ type: ActionTypes.ToggleGraph, exploreId }); + dispatch({ type: ActionTypes.ToggleGraph, payload: { exploreId } }); if (getState().explore[exploreId].showingGraph) { dispatch(runQueries(exploreId)); } @@ -722,7 +737,7 @@ export function toggleGraph(exploreId: ExploreId): ThunkResult { */ export function toggleLogs(exploreId: ExploreId): ThunkResult { return (dispatch, getState) => { - dispatch({ type: ActionTypes.ToggleLogs, exploreId }); + dispatch({ type: ActionTypes.ToggleLogs, payload: { exploreId } }); if (getState().explore[exploreId].showingLogs) { dispatch(runQueries(exploreId)); } @@ -734,7 +749,7 @@ export function toggleLogs(exploreId: ExploreId): ThunkResult { */ export function toggleTable(exploreId: ExploreId): ThunkResult { return (dispatch, getState) => { - dispatch({ type: ActionTypes.ToggleTable, exploreId }); + dispatch({ type: ActionTypes.ToggleTable, payload: { exploreId } }); if (getState().explore[exploreId].showingTable) { dispatch(runQueries(exploreId)); } diff --git a/public/app/features/explore/state/reducers.ts b/public/app/features/explore/state/reducers.ts index 73790ba14bc..b112a5370e3 100644 --- a/public/app/features/explore/state/reducers.ts +++ b/public/app/features/explore/state/reducers.ts @@ -61,7 +61,7 @@ const itemReducer = (state, action: Action): ExploreItemState => { switch (action.type) { case ActionTypes.AddQueryRow: { const { initialQueries, modifiedQueries, queryTransactions } = state; - const { index, query } = action; + const { index, query } = action.payload; // Add new query row after given index, keep modifications of existing rows const nextModifiedQueries = [ @@ -96,7 +96,7 @@ const itemReducer = (state, action: Action): ExploreItemState => { case ActionTypes.ChangeQuery: { const { initialQueries, queryTransactions } = state; let { modifiedQueries } = state; - const { query, index, override } = action; + const { query, index, override } = action.payload; // Fast path: only change modifiedQueries to not trigger an update modifiedQueries[index] = query; @@ -133,7 +133,7 @@ const itemReducer = (state, action: Action): ExploreItemState => { if (datasourceInstance && datasourceInstance.interval) { interval = datasourceInstance.interval; } - const containerWidth = action.width; + const containerWidth = action.payload.width; const queryIntervals = getIntervals(range, interval, containerWidth); return { ...state, containerWidth, queryIntervals }; } @@ -141,7 +141,7 @@ const itemReducer = (state, action: Action): ExploreItemState => { case ActionTypes.ChangeTime: { return { ...state, - range: action.range, + range: action.payload.range, }; } @@ -157,27 +157,27 @@ const itemReducer = (state, action: Action): ExploreItemState => { } case ActionTypes.HighlightLogsExpression: { - const { expressions } = action; + const { expressions } = action.payload; return { ...state, logsHighlighterExpressions: expressions }; } case ActionTypes.InitializeExplore: { - const { containerWidth, eventBridge, exploreDatasources, range } = action; + const { containerWidth, datasource, eventBridge, exploreDatasources, queries, range } = action.payload; return { ...state, containerWidth, eventBridge, exploreDatasources, range, - initialDatasource: action.datasource, - initialQueries: action.queries, + initialDatasource: datasource, + initialQueries: queries, initialized: true, - modifiedQueries: action.queries.slice(), + modifiedQueries: queries.slice(), }; } case ActionTypes.LoadDatasourceFailure: { - return { ...state, datasourceError: action.error, datasourceLoading: false }; + return { ...state, datasourceError: action.payload.error, datasourceLoading: false }; } case ActionTypes.LoadDatasourceMissing: { @@ -185,36 +185,47 @@ const itemReducer = (state, action: Action): ExploreItemState => { } case ActionTypes.LoadDatasourcePending: { - return { ...state, datasourceLoading: true, requestedDatasourceId: action.datasourceId }; + return { ...state, datasourceLoading: true, requestedDatasourceId: action.payload.datasourceId }; } case ActionTypes.LoadDatasourceSuccess: { const { containerWidth, range } = state; - const queryIntervals = getIntervals(range, action.datasourceInstance.interval, containerWidth); + const { + StartPage, + datasourceInstance, + history, + initialDatasource, + initialQueries, + showingStartPage, + supportsGraph, + supportsLogs, + supportsTable, + } = action.payload; + const queryIntervals = getIntervals(range, datasourceInstance.interval, containerWidth); return { ...state, queryIntervals, - StartPage: action.StartPage, - datasourceInstance: action.datasourceInstance, + StartPage, + datasourceInstance, + history, + initialDatasource, + initialQueries, + showingStartPage, + supportsGraph, + supportsLogs, + supportsTable, datasourceLoading: false, datasourceMissing: false, - history: action.history, - initialDatasource: action.initialDatasource, - initialQueries: action.initialQueries, logsHighlighterExpressions: undefined, - modifiedQueries: action.initialQueries.slice(), + modifiedQueries: initialQueries.slice(), queryTransactions: [], - showingStartPage: action.showingStartPage, - supportsGraph: action.supportsGraph, - supportsLogs: action.supportsLogs, - supportsTable: action.supportsTable, }; } case ActionTypes.ModifyQueries: { const { initialQueries, modifiedQueries, queryTransactions } = state; - const { modification, index, modifier } = action as any; + const { modification, index, modifier } = action.payload as any; let nextQueries: DataQuery[]; let nextQueryTransactions; if (index === undefined) { @@ -257,7 +268,7 @@ const itemReducer = (state, action: Action): ExploreItemState => { } case ActionTypes.QueryTransactionFailure: { - const { queryTransactions } = action; + const { queryTransactions } = action.payload; return { ...state, queryTransactions, @@ -267,7 +278,7 @@ const itemReducer = (state, action: Action): ExploreItemState => { case ActionTypes.QueryTransactionStart: { const { datasourceInstance, queryIntervals, queryTransactions } = state; - const { resultType, rowIndex, transaction } = action; + const { resultType, rowIndex, transaction } = action.payload; // Discarding existing transactions of same type const remainingTransactions = queryTransactions.filter( qt => !(qt.resultType === resultType && qt.rowIndex === rowIndex) @@ -292,7 +303,7 @@ const itemReducer = (state, action: Action): ExploreItemState => { case ActionTypes.QueryTransactionSuccess: { const { datasourceInstance, queryIntervals } = state; - const { history, queryTransactions } = action; + const { history, queryTransactions } = action.payload; const results = calculateResultsFromQueryTransactions( queryTransactions, datasourceInstance, @@ -311,7 +322,7 @@ const itemReducer = (state, action: Action): ExploreItemState => { case ActionTypes.RemoveQueryRow: { const { datasourceInstance, initialQueries, queryIntervals, queryTransactions } = state; let { modifiedQueries } = state; - const { index } = action; + const { index } = action.payload; modifiedQueries = [...modifiedQueries.slice(0, index), ...modifiedQueries.slice(index + 1)]; @@ -344,7 +355,7 @@ const itemReducer = (state, action: Action): ExploreItemState => { } case ActionTypes.ScanRange: { - return { ...state, scanRange: action.range }; + return { ...state, scanRange: action.payload.range }; } case ActionTypes.ScanStart: { @@ -358,7 +369,7 @@ const itemReducer = (state, action: Action): ExploreItemState => { } case ActionTypes.SetQueries: { - const { queries } = action; + const { queries } = action.payload; return { ...state, initialQueries: queries.slice(), modifiedQueries: queries.slice() }; } @@ -420,7 +431,7 @@ export const exploreReducer = (state = initialExploreState, action: Action): Exp return { ...state, split: true, - right: action.itemState, + right: action.payload.itemState, }; } @@ -432,13 +443,15 @@ export const exploreReducer = (state = initialExploreState, action: Action): Exp } } - const { exploreId } = action as any; - if (exploreId !== undefined) { - const exploreItemState = state[exploreId]; - return { - ...state, - [exploreId]: itemReducer(exploreItemState, action), - }; + if (action.payload) { + const { exploreId } = action.payload as any; + if (exploreId !== undefined) { + const exploreItemState = state[exploreId]; + return { + ...state, + [exploreId]: itemReducer(exploreItemState, action), + }; + } } return state;