Fix: Use dashboard time range in prometheus variable editor (#78950)

Use dashboard time range in variable editor
This commit is contained in:
ismail simsek 2023-12-01 15:30:47 +01:00 committed by GitHub
parent ae3f1506df
commit 46044efdf8
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 27 additions and 1 deletions

View File

@ -3,6 +3,8 @@ import userEvent from '@testing-library/user-event';
import React from 'react';
import { selectOptionInTest } from 'test/helpers/selectOptionInTest';
import { dateTime, TimeRange } from '@grafana/data';
import { PrometheusDatasource } from '../datasource';
import PrometheusLanguageProvider from '../language_provider';
import { migrateVariableEditorBackToVariableSupport } from '../migrations/variableMigration';
@ -368,4 +370,24 @@ describe('PromVariableQueryEditor', () => {
qryType: 5,
});
});
test('Calls language provider with the time range received in props', async () => {
const now = dateTime('2023-09-16T21:26:00Z');
const range: TimeRange = {
from: dateTime(now).subtract(2, 'days'),
to: now,
raw: {
from: 'now-2d',
to: 'now',
},
};
props.range = range;
const languageProviderStartMock = jest.fn();
props.datasource.languageProvider.start = languageProviderStartMock;
render(<PromVariableQueryEditor {...props} />);
expect(languageProviderStartMock).toHaveBeenCalledWith(range);
});
});

View File

@ -33,7 +33,7 @@ export type Props = QueryEditorProps<PrometheusDatasource, PromQuery, PromOption
const refId = 'PrometheusVariableQueryEditor-VariableQuery';
export const PromVariableQueryEditor = ({ onChange, query, datasource }: Props) => {
export const PromVariableQueryEditor = ({ onChange, query, datasource, range }: Props) => {
// to select the query type, i.e. label_names, label_values, etc.
const [qryType, setQryType] = useState<number | undefined>(undefined);
// list of variables for each function
@ -59,6 +59,10 @@ export const PromVariableQueryEditor = ({ onChange, query, datasource }: Props)
// label filters have been added as a filter for metrics in label values query type
const [labelFilters, setLabelFilters] = useState<QueryBuilderLabelFilter[]>([]);
useEffect(() => {
datasource.languageProvider.start(range);
}, [datasource.languageProvider, range]);
useEffect(() => {
if (!query) {
return;