mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
Dashboard: Support template variables in Search tab for Tempo (#72867)
This commit is contained in:
parent
7bcb3597fe
commit
ed8ca02e0f
@ -14,7 +14,8 @@ interface Props {
|
|||||||
operators: string[];
|
operators: string[];
|
||||||
}
|
}
|
||||||
|
|
||||||
const validationRegex = /^\d+(?:\.\d)?\d*(?:us|µs|ns|ms|s|m|h)$/;
|
// Support template variables (e.g., `$dur`, `$v_1`) and durations (e.g., `300µs`, `1.2ms`)
|
||||||
|
const validationRegex = /^(\$\w+)|(\d+(?:\.\d)?\d*(?:us|µs|ns|ms|s|m|h))$/;
|
||||||
|
|
||||||
const getStyles = () => ({
|
const getStyles = () => ({
|
||||||
noBoxShadow: css`
|
noBoxShadow: css`
|
||||||
|
@ -1,6 +1,7 @@
|
|||||||
import { render, screen } from '@testing-library/react';
|
import { render, screen } from '@testing-library/react';
|
||||||
import userEvent from '@testing-library/user-event';
|
import userEvent from '@testing-library/user-event';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
import { initTemplateSrv } from 'test/helpers/initTemplateSrv';
|
||||||
|
|
||||||
import { TraceqlSearchScope } from '../dataquery.gen';
|
import { TraceqlSearchScope } from '../dataquery.gen';
|
||||||
import { TempoDatasource } from '../datasource';
|
import { TempoDatasource } from '../datasource';
|
||||||
@ -39,6 +40,8 @@ jest.mock('../language_provider', () => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
describe('TraceQLSearch', () => {
|
describe('TraceQLSearch', () => {
|
||||||
|
initTemplateSrv('key', []);
|
||||||
|
|
||||||
let user: ReturnType<typeof userEvent.setup>;
|
let user: ReturnType<typeof userEvent.setup>;
|
||||||
|
|
||||||
const datasource: TempoDatasource = {
|
const datasource: TempoDatasource = {
|
||||||
|
@ -3,7 +3,7 @@ import React, { useCallback, useEffect, useState } from 'react';
|
|||||||
|
|
||||||
import { GrafanaTheme2 } from '@grafana/data';
|
import { GrafanaTheme2 } from '@grafana/data';
|
||||||
import { EditorRow } from '@grafana/experimental';
|
import { EditorRow } from '@grafana/experimental';
|
||||||
import { FetchError } from '@grafana/runtime';
|
import { FetchError, getTemplateSrv } from '@grafana/runtime';
|
||||||
import { Alert, HorizontalGroup, useStyles2 } from '@grafana/ui';
|
import { Alert, HorizontalGroup, useStyles2 } from '@grafana/ui';
|
||||||
|
|
||||||
import { createErrorNotification } from '../../../../core/copy/appNotification';
|
import { createErrorNotification } from '../../../../core/copy/appNotification';
|
||||||
@ -36,6 +36,8 @@ const TraceQLSearch = ({ datasource, query, onChange }: Props) => {
|
|||||||
const [isTagsLoading, setIsTagsLoading] = useState(true);
|
const [isTagsLoading, setIsTagsLoading] = useState(true);
|
||||||
const [traceQlQuery, setTraceQlQuery] = useState<string>('');
|
const [traceQlQuery, setTraceQlQuery] = useState<string>('');
|
||||||
|
|
||||||
|
const templateSrv = getTemplateSrv();
|
||||||
|
|
||||||
const updateFilter = useCallback(
|
const updateFilter = useCallback(
|
||||||
(s: TraceqlFilter) => {
|
(s: TraceqlFilter) => {
|
||||||
const copy = { ...query };
|
const copy = { ...query };
|
||||||
@ -166,7 +168,7 @@ const TraceQLSearch = ({ datasource, query, onChange }: Props) => {
|
|||||||
</InlineSearchField>
|
</InlineSearchField>
|
||||||
</div>
|
</div>
|
||||||
<EditorRow>
|
<EditorRow>
|
||||||
<RawQuery query={traceQlQuery} lang={{ grammar: traceqlGrammar, name: 'traceql' }} />
|
<RawQuery query={templateSrv.replace(traceQlQuery)} lang={{ grammar: traceqlGrammar, name: 'traceql' }} />
|
||||||
</EditorRow>
|
</EditorRow>
|
||||||
<TempoQueryBuilderOptions onChange={onChange} query={query} />
|
<TempoQueryBuilderOptions onChange={onChange} query={query} />
|
||||||
</div>
|
</div>
|
||||||
|
@ -255,7 +255,11 @@ export class TempoDatasource extends DataSourceWithBackend<TempoQuery, TempoJson
|
|||||||
}
|
}
|
||||||
if (targets.traceqlSearch?.length) {
|
if (targets.traceqlSearch?.length) {
|
||||||
try {
|
try {
|
||||||
const queryValue = generateQueryFromFilters(targets.traceqlSearch[0].filters);
|
const queryValueFromFilters = generateQueryFromFilters(targets.traceqlSearch[0].filters);
|
||||||
|
|
||||||
|
// We want to support template variables also in Search for consistency with other data sources
|
||||||
|
const queryValue = this.templateSrv.replace(queryValueFromFilters, options.scopedVars);
|
||||||
|
|
||||||
reportInteraction('grafana_traces_traceql_search_queried', {
|
reportInteraction('grafana_traces_traceql_search_queried', {
|
||||||
datasourceType: 'tempo',
|
datasourceType: 'tempo',
|
||||||
app: options.app ?? '',
|
app: options.app ?? '',
|
||||||
|
Loading…
Reference in New Issue
Block a user