From fd1b0de34b35adebb1d4c158bf585e7c03d79a65 Mon Sep 17 00:00:00 2001
From: Ivana Huckova <30407135+ivanahuckova@users.noreply.github.com>
Date: Tue, 12 Oct 2021 15:58:48 +0200
Subject: [PATCH] Prometheus: Set default value for query expr (#40330)

---
 .../components/PromExploreExtraField.tsx         | 13 +------------
 .../components/PromExploreQueryEditor.tsx        | 16 +++++++++++++++-
 2 files changed, 16 insertions(+), 13 deletions(-)

diff --git a/public/app/plugins/datasource/prometheus/components/PromExploreExtraField.tsx b/public/app/plugins/datasource/prometheus/components/PromExploreExtraField.tsx
index cafa6d1b18f..50ba5d10d24 100644
--- a/public/app/plugins/datasource/prometheus/components/PromExploreExtraField.tsx
+++ b/public/app/plugins/datasource/prometheus/components/PromExploreExtraField.tsx
@@ -1,4 +1,4 @@
-import React, { memo, useEffect, useCallback } from 'react';
+import React, { memo, useCallback } from 'react';
 import { usePrevious } from 'react-use';
 import { isEqual } from 'lodash';
 import { css, cx } from '@emotion/css';
@@ -28,17 +28,6 @@ export const PromExploreExtraField: React.FC<PromExploreExtraFieldProps> = memo(
 
     const prevQuery = usePrevious(query);
 
-    // Setting default values
-    useEffect(() => {
-      if (query.exemplar === undefined) {
-        onChange({ ...query, exemplar: true });
-      }
-
-      if (!query.instant && !query.range) {
-        onChange({ ...query, instant: true, range: true });
-      }
-    }, [onChange, query]);
-
     const onExemplarChange = useCallback(
       (exemplar: boolean) => {
         if (!isEqual(query, prevQuery) || exemplar !== query.exemplar) {
diff --git a/public/app/plugins/datasource/prometheus/components/PromExploreQueryEditor.tsx b/public/app/plugins/datasource/prometheus/components/PromExploreQueryEditor.tsx
index c31bdc57c58..d54dcc192a4 100644
--- a/public/app/plugins/datasource/prometheus/components/PromExploreQueryEditor.tsx
+++ b/public/app/plugins/datasource/prometheus/components/PromExploreQueryEditor.tsx
@@ -1,4 +1,4 @@
-import React, { memo, FC } from 'react';
+import React, { memo, FC, useEffect } from 'react';
 import { QueryEditorProps } from '@grafana/data';
 import { PrometheusDatasource } from '../datasource';
 import { PromQuery, PromOptions } from '../types';
@@ -10,6 +10,20 @@ export type Props = QueryEditorProps<PrometheusDatasource, PromQuery, PromOption
 export const PromExploreQueryEditor: FC<Props> = (props: Props) => {
   const { range, query, data, datasource, history, onChange, onRunQuery } = props;
 
+  // Setting default values
+  useEffect(() => {
+    if (query.expr === undefined) {
+      onChange({ ...query, expr: '' });
+    }
+    if (query.exemplar === undefined) {
+      onChange({ ...query, exemplar: true });
+    }
+
+    if (!query.instant && !query.range) {
+      onChange({ ...query, instant: true, range: true });
+    }
+  }, [onChange, query]);
+
   return (
     <PromQueryField
       datasource={datasource}