From 6838af5ce1ada141eedcf0a37a35b0b4266b8b58 Mon Sep 17 00:00:00 2001
From: Ivana Huckova <30407135+ivanahuckova@users.noreply.github.com>
Date: Fri, 20 Nov 2020 12:08:10 +0100
Subject: [PATCH] Explore/Prometheus: Update default query type option to
 "Both" (#28935)

* Update default option to 'both'

* Update public/app/plugins/datasource/prometheus/components/PromExploreExtraField.tsx

Co-authored-by: Diana Payton <52059945+oddlittlebird@users.noreply.github.com>

* Fix running of queries for both

* Update wording

Co-authored-by: Diana Payton <52059945+oddlittlebird@users.noreply.github.com>
---
 .../prometheus/components/PromExploreExtraField.tsx        | 7 ++++++-
 .../prometheus/components/PromExploreQueryEditor.tsx       | 3 ++-
 .../__snapshots__/PromExploreQueryEditor.test.tsx.snap     | 2 +-
 public/app/plugins/datasource/prometheus/datasource.ts     | 6 +++---
 4 files changed, 12 insertions(+), 6 deletions(-)

diff --git a/public/app/plugins/datasource/prometheus/components/PromExploreExtraField.tsx b/public/app/plugins/datasource/prometheus/components/PromExploreExtraField.tsx
index 80bcf7c971f..fccf7150c84 100644
--- a/public/app/plugins/datasource/prometheus/components/PromExploreExtraField.tsx
+++ b/public/app/plugins/datasource/prometheus/components/PromExploreExtraField.tsx
@@ -34,7 +34,12 @@ export const PromExploreExtraField: React.FC<PromExploreExtraFieldProps> = memo(
           )}
           aria-label="Query type field"
         >
-          <InlineFormLabel width={5}>Query type</InlineFormLabel>
+          <InlineFormLabel
+            width="auto"
+            tooltip="Choose the type of query you would like to run. An instant query queries against a single point in time. A range query queries over a range of time. With both, you'll run two queries - one instant and one range. "
+          >
+            Query type
+          </InlineFormLabel>
 
           <RadioButtonGroup options={rangeOptions} value={queryType} onChange={onQueryTypeChange} />
         </div>
diff --git a/public/app/plugins/datasource/prometheus/components/PromExploreQueryEditor.tsx b/public/app/plugins/datasource/prometheus/components/PromExploreQueryEditor.tsx
index 171fa9f0c58..e94ecedda65 100644
--- a/public/app/plugins/datasource/prometheus/components/PromExploreQueryEditor.tsx
+++ b/public/app/plugins/datasource/prometheus/components/PromExploreQueryEditor.tsx
@@ -57,7 +57,8 @@ export const PromExploreQueryEditor: FC<Props> = (props: Props) => {
       data={data}
       ExtraFieldElement={
         <PromExploreExtraField
-          queryType={query.range && query.instant ? 'both' : query.instant ? 'instant' : 'range'}
+          // Select "both" as default option when Explore is opened. In legacy requests, range and instant can be undefined. In this case, we want to run queries with "both".
+          queryType={query.range === query.instant ? 'both' : query.instant ? 'instant' : 'range'}
           stepValue={query.interval || ''}
           onQueryTypeChange={onQueryTypeChange}
           onStepChange={onStepChange}
diff --git a/public/app/plugins/datasource/prometheus/components/__snapshots__/PromExploreQueryEditor.test.tsx.snap b/public/app/plugins/datasource/prometheus/components/__snapshots__/PromExploreQueryEditor.test.tsx.snap
index 5e0c5e2e09c..ccf5c794692 100644
--- a/public/app/plugins/datasource/prometheus/components/__snapshots__/PromExploreQueryEditor.test.tsx.snap
+++ b/public/app/plugins/datasource/prometheus/components/__snapshots__/PromExploreQueryEditor.test.tsx.snap
@@ -7,7 +7,7 @@ exports[`PromExploreQueryEditor should render component 1`] = `
       onKeyDownFunc={[Function]}
       onQueryTypeChange={[Function]}
       onStepChange={[Function]}
-      queryType="range"
+      queryType="both"
       stepValue="1s"
     />
   }
diff --git a/public/app/plugins/datasource/prometheus/datasource.ts b/public/app/plugins/datasource/prometheus/datasource.ts
index ee3f3e40b40..2241b9c9ab6 100644
--- a/public/app/plugins/datasource/prometheus/datasource.ts
+++ b/public/app/plugins/datasource/prometheus/datasource.ts
@@ -171,8 +171,8 @@ export class PrometheusDatasource extends DataSourceApi<PromQuery, PromOptions>
 
       target.requestId = options.panelId + target.refId;
 
-      if (target.range && target.instant) {
-        // If running both (only available in Explore) - instant and range query, prepare both targets
+      // In Explore, we run both (instant and range) queries if both are true (selected) or both are undefined (legacy Explore queries)
+      if (options.app === CoreApp.Explore && target.range === target.instant) {
         // Create instant target
         const instantTarget: any = cloneDeep(target);
         instantTarget.format = 'table';
@@ -194,8 +194,8 @@ export class PrometheusDatasource extends DataSourceApi<PromQuery, PromOptions>
           this.createQuery(instantTarget, options, start, end),
           this.createQuery(rangeTarget, options, start, end)
         );
-      } else if (target.instant && options.app === CoreApp.Explore) {
         // If running only instant query in Explore, format as table
+      } else if (target.instant && options.app === CoreApp.Explore) {
         const instantTarget: any = cloneDeep(target);
         instantTarget.format = 'table';
         queries.push(this.createQuery(instantTarget, options, start, end));