make sure service and slo display name is passed to segment comp (#30900)

This commit is contained in:
Erik Sundell 2021-02-08 07:51:31 +01:00 committed by GitHub
parent d824dc8e1c
commit ae64dcf063
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 13 additions and 7 deletions

View File

@ -21,7 +21,9 @@ export const defaultQuery: (dataSource: CloudMonitoringDatasource) => SLOQuery =
aliasBy: '',
selectorName: 'select_slo_health',
serviceId: '',
serviceName: '',
sloId: '',
sloName: '',
});
export function SLOQueryEditor({
@ -42,7 +44,7 @@ export function SLOQueryEditor({
<QueryInlineField label="Service">
<SegmentAsync
allowCustomValue
value={query?.serviceId}
value={{ value: query?.serviceId, label: query?.serviceName || query?.serviceId }}
placeholder="Select service"
loadOptions={() =>
datasource.getSLOServices(query.projectName).then((services) => [
@ -53,14 +55,16 @@ export function SLOQueryEditor({
...services,
])
}
onChange={({ value: serviceId = '' }) => onChange({ ...query, serviceId, sloId: '' })}
onChange={({ value: serviceId = '', label: serviceName = '' }) =>
onChange({ ...query, serviceId, serviceName, sloId: '' })
}
/>
</QueryInlineField>
<QueryInlineField label="SLO">
<SegmentAsync
allowCustomValue
value={query?.sloId}
value={{ value: query?.sloId, label: query?.sloName || query?.sloId }}
placeholder="Select SLO"
loadOptions={() =>
datasource.getServiceLevelObjectives(query.projectName, query.serviceId).then((sloIds) => [
@ -71,10 +75,10 @@ export function SLOQueryEditor({
...sloIds,
])
}
onChange={async ({ value: sloId = '' }) => {
onChange={async ({ value: sloId = '', label: sloName = '' }) => {
const slos = await datasource.getServiceLevelObjectives(query.projectName, query.serviceId);
const slo = slos.find(({ value }) => value === datasource.templateSrv.replace(sloId));
onChange({ ...query, sloId, goal: slo?.goal });
onChange({ ...query, sloId, sloName, goal: slo?.goal });
}}
/>
</QueryInlineField>

View File

@ -257,9 +257,9 @@ export default class CloudMonitoringDatasource extends DataSourceWithBackend<
async getSLOServices(projectName: string): Promise<Array<SelectableValue<string>>> {
return this.api.get(`${this.templateSrv.replace(projectName)}/services?pageSize=1000`, {
responseMap: ({ name }: { name: string }) => ({
responseMap: ({ name, displayName }: { name: string; displayName: string }) => ({
value: name.match(/([^\/]*)\/*$/)![1],
label: name.match(/([^\/]*)\/*$/)![1],
label: displayName || name.match(/([^\/]*)\/*$/)![1],
}),
});
}

View File

@ -92,7 +92,9 @@ export interface SLOQuery {
aliasBy?: string;
selectorName: string;
serviceId: string;
serviceName: string;
sloId: string;
sloName: string;
goal?: number;
}