Move action properties to payload

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 =

public/app/features/explore/state/actions.ts

@@ -52,7 +52,7 @@ type ThunkResult<R> = ThunkAction<R, StoreState, undefined, ThunkableAction>;
  */
 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<void> {
   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<void> {
   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<void> {
  * 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<void> {
   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<void> {
   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<void> {
   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<void> {
       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<void> {
   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<void> {
  */
 export function toggleLogs(exploreId: ExploreId): ThunkResult<void> {
   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<void> {
  */
 export function toggleTable(exploreId: ExploreId): ThunkResult<void> {
   return (dispatch, getState) => {
-    dispatch({ type: ActionTypes.ToggleTable, exploreId });
+    dispatch({ type: ActionTypes.ToggleTable, payload: { exploreId } });
     if (getState().explore[exploreId].showingTable) {
       dispatch(runQueries(exploreId));
     }

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;