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

PromQuery: Show exemplars in collapsed view (#52767)

Browse Source 
* add Examplars: false in collapsed view

* assign defaut value - false to switch

* add 3 tests for 3 possible cases

Co-authored-by: Taewoo Kim <taewookim@Taewoos-MacBook-Pro.local>
This commit is contained in:
Taewoo K 2022-07-27 09:08:52 -04:00 committed by GitHub
parent 542b4f2431
commit 8b6b82f239
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 27 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
public/app/plugins/datasource/prometheus/querybuilder/components/PromQueryBuilderOptions.test.tsx
View File

@ -68,6 +68,21 @@ describe('PromQueryBuilderOptions', () => {
expect(screen.getByText('Type: Instant')).toBeInTheDocument();
});
it('Should show "Exemplars: false" by default', async () => {
setup();
expect(screen.getByText('Exemplars: false')).toBeInTheDocument();
});
it('Should show "Exemplars: false" when query has "Exemplars: false"', async () => {
setup({ exemplar: false });
expect(screen.getByText('Exemplars: false')).toBeInTheDocument();
});
it('Should show "Exemplars: true" when query has "Exemplars: true"', async () => {
setup({ exemplar: true });
expect(screen.getByText('Exemplars: true')).toBeInTheDocument();
});
});
function setup(queryOverrides: Partial<PromQuery> = {}) {

18
public/app/plugins/datasource/prometheus/querybuilder/components/PromQueryBuilderOptions.tsx
View File

@ -57,7 +57,10 @@ export const PromQueryBuilderOptions = React.memo<Props>(({ query, app, onChange
return (
<EditorRow>
<QueryOptionGroup title="Options" collapsedInfo={getCollapsedInfo(query, formatOption.label!, queryTypeLabel)}>
<QueryOptionGroup
title="Options"
collapsedInfo={getCollapsedInfo(query, formatOption.label!, queryTypeLabel, app)}
>
<PromQueryLegendEditor
legendFormat={query.legendFormat}
onChange={(legendFormat) => onChange({ ...query, legendFormat })}
@ -89,7 +92,7 @@ export const PromQueryBuilderOptions = React.memo<Props>(({ query, app, onChange
</EditorField>
{shouldShowExemplarSwitch(query, app) && (
<EditorField label="Exemplars">
<EditorSwitch value={query.exemplar} onChange={onExemplarChange} />
<EditorSwitch value={query.exemplar || false} onChange={onExemplarChange} />
</EditorField>
)}
{query.intervalFactor && query.intervalFactor > 1 && (
@ -120,7 +123,7 @@ function getQueryTypeValue(query: PromQuery) {
return query.range && query.instant ? 'both' : query.instant ? 'instant' : 'range';
}
function getCollapsedInfo(query: PromQuery, formatOption: string, queryType: string): string[] {
function getCollapsedInfo(query: PromQuery, formatOption: string, queryType: string, app?: CoreApp): string[] {
const items: string[] = [];
items.push(`Legend: ${getLegendModeLabel(query.legendFormat)}`);
@ -128,10 +131,13 @@ function getCollapsedInfo(query: PromQuery, formatOption: string, queryType: str
items.push(`Step: ${query.interval ?? 'auto'}`);
items.push(`Type: ${queryType}`);
if (query.exemplar) {
items.push(`Exemplars: true`);
if (shouldShowExemplarSwitch(query, app)) {
if (query.exemplar) {
items.push(`Exemplars: true`);
} else {
items.push(`Exemplars: false`);
}
}
return items;
}