Alerting: create LabelPicker component for Prometheus / Cortex / Loki labels

[gillesdemey]

We have a few different places where we could improve the alerting UI by allowing the user to select existing label keys / values.

The Prometheus and Loki datasources expose the necessary functions for querying label keys and values.

• Create LabelKeyPicker and LabelValuePicker components
• Implement in create rule / edit rule

(stretch/do later)

• Implement in notification policies
• Implement in silences
• Implement in Alert Panel

For Prometheus / Cortex

grafana/public/app/plugins/datasource/prometheus/datasource.ts

Lines 794 to 807 in 163b570

	async getTagKeys(options?: any) {
	if (options?.series) {
	// Get tags for the provided series only
	const seriesLabels: Array<Record<string, string[]>> = await Promise.all(
	options.series.map((series: string) => this.languageProvider.fetchSeriesLabels(series))
	);
	const uniqueLabels = [...new Set(...seriesLabels.map((value) => Object.keys(value)))];
	return uniqueLabels.map((value: any) => ({ text: value }));
	} else {
	// Get all tags
	const result = await this.metadataRequest('/api/v1/labels');
	return result?.data?.data?.map((value: any) => ({ text: value })) ?? [];
	}
	}

For Loki

grafana/public/app/plugins/datasource/loki/datasource.ts

Lines 446 to 452 in 163b570

	async labelNamesQuery() {
	const url = `${LOKI_ENDPOINT}/label`;
	const params = this.getTimeRangeParams();
	const result = await this.metadataRequest(url, params);
	return result.map((value: string) => ({ text: value }));
	}

[grafanabot]

This issue was removed from the 8.5.0 milestone because 8.5.0 is currently being released.

[grafanabot]

This issue was removed from the 9.1.0 milestone because 9.1.0 is currently being released.