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 = 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 = (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 (