More types and some refactoring

packages/grafana-ui/src/types/plugin.ts

@@ -1,6 +1,6 @@
 import { ComponentClass } from 'react';
 import { PanelProps, PanelOptionsProps } from './panel';
-import { DataQueryOptions, DataQuery, DataQueryResponse, QueryHint } from './datasource';
+import { DataQueryOptions, DataQuery, DataQueryResponse, QueryHint, QueryFixAction } from './datasource';
 
 export interface DataSourceApi<TQuery extends DataQuery = DataQuery> {
   /**
@@ -42,7 +42,7 @@ export interface DataSourceApi<TQuery extends DataQuery = DataQuery> {
 }
 
 export interface ExploreDataSourceApi<TQuery extends DataQuery = DataQuery> extends DataSourceApi {
-  modifyQuery?(query: TQuery, action: any): TQuery;
+  modifyQuery?(query: TQuery, action: QueryFixAction): TQuery;
   getHighlighterExpression?(query: TQuery): string;
   languageProvider?: any;
 }
@@ -62,6 +62,7 @@ export interface ExploreQueryFieldProps<DSType extends DataSourceApi, TQuery ext
   history: any[];
   onExecuteQuery?: () => void;
   onQueryChange?: (value: TQuery) => void;
+  onExecuteHint?: (action: QueryFixAction) => void;
 }
 
 export interface PluginExports {

public/app/features/explore/QueryField.tsx

@@ -387,8 +387,6 @@ export class QueryField extends React.PureComponent<QueryFieldProps, QueryFieldS
     this.resetTimer = setTimeout(this.resetTypeahead, 100);
     // Disrupting placeholder entry wipes all remaining placeholders needing input
     this.placeholdersBuffer.clearPlaceholders();
-
-    this.executeOnQueryChangeAndExecuteQueries();
   };
 
   handleFocus = () => {};

public/app/features/explore/QueryRow.tsx

@@ -20,7 +20,7 @@ import {
 
 // Types
 import { StoreState } from 'app/types';
-import { RawTimeRange, DataQuery, ExploreDataSourceApi, QueryHint } from '@grafana/ui';
+import { RawTimeRange, DataQuery, ExploreDataSourceApi, QueryHint, QueryFixAction } from '@grafana/ui';
 import { QueryTransaction, HistoryItem, ExploreItemState, ExploreId } from 'app/types/explore';
 import { Emitter } from 'app/core/utils/emitter';
 
@@ -78,10 +78,10 @@ export class QueryRow extends PureComponent<QueryRowProps> {
     this.onChangeQuery(null, true);
   };
 
-  onClickHintFix = action => {
+  onClickHintFix = (action: QueryFixAction) => {
     const { datasourceInstance, exploreId, index } = this.props;
     if (datasourceInstance && datasourceInstance.modifyQuery) {
-      const modifier = (queries: DataQuery, action: any) => datasourceInstance.modifyQuery(queries, action);
+      const modifier = (queries: DataQuery, action: QueryFixAction) => datasourceInstance.modifyQuery(queries, action);
       this.props.modifyQueries(exploreId, action, index, modifier);
     }
   };
@@ -116,14 +116,12 @@ export class QueryRow extends PureComponent<QueryRowProps> {
             <QueryField
               datasource={datasourceInstance}
               initialQuery={initialQuery}
-              onExecuteQuery={this.onExecuteQuery}
-              onQueryChange={this.onChangeQuery}
               error={queryError}
               hint={hint}
               history={history}
-              // onClickHintFix={this.onClickHintFix}
-              // onPressEnter={this.onExecuteQuery}
-              // onQueryChange={this.onChangeQuery}
+              onExecuteQuery={this.onExecuteQuery}
+              onExecuteHint={this.onClickHintFix}
+              onQueryChange={this.onChangeQuery}
             />
           ) : (
             <QueryEditor

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

@@ -1,6 +1,6 @@
 // Types
 import { Emitter } from 'app/core/core';
-import { RawTimeRange, TimeRange, DataQuery, DataSourceSelectItem, DataSourceApi } from '@grafana/ui/src/types';
+import { RawTimeRange, TimeRange, DataQuery, DataSourceSelectItem, DataSourceApi, QueryFixAction } from '@grafana/ui/src/types';
 import {
   ExploreId,
   ExploreItemState,
@@ -155,9 +155,9 @@ export interface ModifyQueriesAction {
   type: ActionTypes.ModifyQueries;
   payload: {
     exploreId: ExploreId;
-    modification: any;
+    modification: QueryFixAction;
     index: number;
-    modifier: (queries: DataQuery[], modification: any) => DataQuery[];
+    modifier: (queries: DataQuery[], modification: QueryFixAction) => DataQuery[];
   };
 }
 

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

@@ -30,6 +30,7 @@ import {
   DataQuery,
   DataSourceSelectItem,
   QueryHint,
+  QueryFixAction,
 } from '@grafana/ui/src/types';
 import {
   ExploreId,
@@ -54,6 +55,7 @@ import {
   ScanStopAction,
   UpdateDatasourceInstanceAction,
   QueriesImported,
+  ModifyQueriesAction,
 } from './actionTypes';
 
 type ThunkResult<R> = ThunkAction<R, StoreState, undefined, ThunkableAction>;
@@ -385,12 +387,16 @@ export function loadDatasource(exploreId: ExploreId, instance: DataSourceApi): T
  */
 export function modifyQueries(
   exploreId: ExploreId,
-  modification: any,
+  modification: QueryFixAction,
   index: number,
   modifier: any
 ): ThunkResult<void> {
   return dispatch => {
-    dispatch({ type: ActionTypes.ModifyQueries, payload: { exploreId, modification, index, modifier } });
+    const modifyQueryAction: ModifyQueriesAction = {
+      type: ActionTypes.ModifyQueries,
+      payload: { exploreId, modification, index, modifier },
+    };
+    dispatch(modifyQueryAction);
     if (!modification.preventSubmit) {
       dispatch(runQueries(exploreId));
     }

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

@@ -230,7 +230,7 @@ export const itemReducer = (state, action: Action): ExploreItemState => {
 
     case ActionTypes.ModifyQueries: {
       const { initialQueries, modifiedQueries, queryTransactions } = state;
-      const { modification, index, modifier } = action.payload as any;
+      const { modification, index, modifier } = action.payload;
       let nextQueries: DataQuery[];
       let nextQueryTransactions;
       if (index === undefined) {

public/app/plugins/datasource/loki/components/LokiQueryField.tsx

@@ -177,10 +177,10 @@ export class LokiQueryField extends React.PureComponent<LokiQueryFieldProps, Lok
   };
 
   onClickHintFix = () => {
-    // const { hint, onClickHintFix } = this.props;
-    // if (onClickHintFix && hint && hint.fix) {
-    //   onClickHintFix(hint.fix.action);
-    // }
+    const { hint, onExecuteHint } = this.props;
+    if (onExecuteHint && hint && hint.fix) {
+      onExecuteHint(hint.fix.action);
+    }
   };
 
   onUpdateLanguage = () => {

public/app/plugins/datasource/prometheus/components/PromQueryField.tsx

@@ -183,10 +183,10 @@ class PromQueryField extends React.PureComponent<PromQueryFieldProps, PromQueryF
   };
 
   onClickHintFix = () => {
-    // const { hint, onClickHintFix } = this.props;
-    // if (onClickHintFix && hint && hint.fix) {
-    //   onClickHintFix(hint.fix.action);
-    // }
+    const { hint, onExecuteHint } = this.props;
+    if (onExecuteHint && hint && hint.fix) {
+      onExecuteHint(hint.fix.action);
+    }
   };
 
   onUpdateLanguage = () => {