Fix: Adds context to list of keys that are not part of query (#17423)

Fixes: #17408

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

@@ -13,7 +13,7 @@ import { TypeaheadOutput, HistoryItem } from 'app/types/explore';
 import { getNextCharacter, getPreviousCousin } from 'app/features/explore/utils/dom';
 import BracesPlugin from 'app/features/explore/slate-plugins/braces';
 import QueryField, { TypeaheadInput, QueryFieldState } from 'app/features/explore/QueryField';
-import { PromQuery } from '../types';
+import { PromQuery, PromContext } from '../types';
 import { CancelablePromise, makePromiseCancelable } from 'app/core/utils/CancelablePromise';
 import { DataSourceApi, ExploreQueryFieldProps, DataSourceStatus, QueryHint } from '@grafana/ui';
 
@@ -223,7 +223,7 @@ class PromQueryField extends React.PureComponent<PromQueryFieldProps, PromQueryF
     // Send text change to parent
     const { query, onChange, onRunQuery } = this.props;
     if (onChange) {
-      const nextQuery: PromQuery = { ...query, expr: value, context: 'explore' };
+      const nextQuery: PromQuery = { ...query, expr: value, context: PromContext.Explore };
       onChange(nextQuery);
 
       if (override && onRunQuery) {

public/app/plugins/datasource/prometheus/datasource.ts

@@ -2,6 +2,7 @@
 import _ from 'lodash';
 import $ from 'jquery';
 import { from, Observable } from 'rxjs';
+import { single, map, filter } from 'rxjs/operators';
 
 // Services & Utils
 import kbn from 'app/core/utils/kbn';
@@ -15,7 +16,7 @@ import { getQueryHints } from './query_hints';
 import { expandRecordingRules } from './language_utils';
 
 // Types
-import { PromQuery, PromOptions, PromQueryRequest } from './types';
+import { PromQuery, PromOptions, PromQueryRequest, PromContext } from './types';
 import {
   DataQueryRequest,
   DataSourceApi,
@@ -29,7 +30,6 @@ import { ExploreUrlState } from 'app/types/explore';
 import { safeStringifyValue } from 'app/core/utils/explore';
 import { TemplateSrv } from 'app/features/templating/template_srv';
 import { TimeSrv } from 'app/features/dashboard/services/TimeSrv';
-import { single, map, filter } from 'rxjs/operators';
 
 export class PrometheusDatasource extends DataSourceApi<PromQuery, PromOptions> {
   type: string;
@@ -224,7 +224,7 @@ export class PrometheusDatasource extends DataSourceApi<PromQuery, PromOptions>
         continue;
       }
 
-      if (target.context === 'explore') {
+      if (target.context === PromContext.Explore) {
         target.format = 'time_series';
         target.instant = false;
         const instantTarget: any = _.cloneDeep(target);
@@ -260,7 +260,10 @@ export class PrometheusDatasource extends DataSourceApi<PromQuery, PromOptions>
       return this.$q.when({ data: [] }) as Promise<{ data: any }>;
     }
 
-    if (observer && options.targets.filter(target => target.context === 'explore').length === options.targets.length) {
+    if (
+      observer &&
+      options.targets.filter(target => target.context === PromContext.Explore).length === options.targets.length
+    ) {
       // using observer to make the instant query return immediately
       this.runObserverQueries(options, observer, queries, activeTargets, end);
       return this.$q.when({ data: [] }) as Promise<{ data: any }>;

public/app/plugins/datasource/prometheus/types.ts

@@ -1,8 +1,13 @@
 import { DataQuery, DataSourceJsonData } from '@grafana/ui/src/types';
 
+export enum PromContext {
+  Explore = 'explore',
+  Panel = 'panel',
+}
+
 export interface PromQuery extends DataQuery {
   expr: string;
-  context?: 'explore' | 'panel';
+  context?: PromContext;
   format?: string;
   instant?: boolean;
   hinting?: boolean;