IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Loki code editor: do not run query on blur in explore mode (#49241)

Browse Source 
* loki code editor: do not run query on blur in explore mode

* loki: code editor: better change tracking

* fixed comment

Co-authored-by: Ivana Huckova <30407135+ivanahuckova@users.noreply.github.com>

Co-authored-by: Ivana Huckova <30407135+ivanahuckova@users.noreply.github.com>
This commit is contained in:
Gábor Farkas 2022-05-26 15:03:36 +02:00 committed by GitHub
parent a59066a21d
commit 386181cf45
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 21 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
public/app/plugins/datasource/loki/querybuilder/components/LokiQueryCodeEditor.tsx
View File

@ -1,16 +1,33 @@
import { css } from '@emotion/css';
import React from 'react';
import { GrafanaTheme2 } from '@grafana/data';
import { CoreApp, GrafanaTheme2 } from '@grafana/data';
import { useStyles2 } from '@grafana/ui';
import { testIds } from '../../components/LokiQueryEditor';
import { LokiQueryField } from '../../components/LokiQueryField';
import { LokiQueryEditorProps } from '../../components/types';
export function LokiQueryCodeEditor({ query, datasource, range, onRunQuery, onChange, data }: LokiQueryEditorProps) {
export function LokiQueryCodeEditor({
query,
datasource,
range,
onRunQuery,
onChange,
data,
app,
}: LokiQueryEditorProps) {
const styles = useStyles2(getStyles);
// the inner QueryField works like this when a blur event happens:
// - if it has an onBlur prop, it calls it
// - else it calls onRunQuery (some extra conditions apply)
//
// we want it to not do anything when a blur event happens in explore mode,
// so we set an empty-function in such case. otherwise we set `undefined`,
// which will cause it to run the query when blur happens.
const onBlur = app === CoreApp.Explore ? () => undefined : undefined;
return (
<div className={styles.wrapper}>
<LokiQueryField
@ -19,6 +36,7 @@ export function LokiQueryCodeEditor({ query, datasource, range, onRunQuery, onCh
range={range}
onRunQuery={onRunQuery}
onChange={onChange}
onBlur={onBlur}
history={[]}
data={data}
data-testid={testIds.editor}

2
public/app/plugins/datasource/loki/querybuilder/components/LokiQueryEditorSelector.tsx
View File

@ -111,7 +111,7 @@ export const LokiQueryEditorSelector = React.memo<LokiQueryEditorProps>((props)
</EditorHeader>
<Space v={0.5} />
<EditorRows>
{editorMode === QueryEditorMode.Code && <LokiQueryCodeEditor {...props} />}
{editorMode === QueryEditorMode.Code && <LokiQueryCodeEditor {...props} onChange={onChangeInternal} />}
{editorMode === QueryEditorMode.Builder && (
<LokiQueryBuilderContainer
datasource={props.datasource}