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

CloudMonitoring: Update Service to use experimental UI components (#51838)

Browse Source
This commit is contained in:
Kevin Yu 2022-07-07 01:25:53 -07:00 committed by GitHub
parent 5bd58be334
commit 19fa4ef9af
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 16 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
public/app/plugins/datasource/cloud-monitoring/components/Experimental/Service.tsx
View File

@ -1,10 +1,9 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { SelectableValue } from '@grafana/data'; import { SelectableValue } from '@grafana/data';
import { EditorField, EditorRow } from '@grafana/experimental';
import { Select } from '@grafana/ui'; import { Select } from '@grafana/ui';
import { QueryEditorRow } from '..';
import { SELECT_WIDTH } from '../../constants';
import CloudMonitoringDatasource from '../../datasource'; import CloudMonitoringDatasource from '../../datasource';
import { SLOQuery } from '../../types'; import { SLOQuery } from '../../types';
@ -37,10 +36,11 @@ export const Service: React.FC<Props> = ({ refId, query, templateVariableOptions
}, [datasource, projectName, templateVariableOptions]); }, [datasource, projectName, templateVariableOptions]);
return ( return (
<QueryEditorRow label="Service" htmlFor={`${refId}-slo-service`}> <EditorRow>
<EditorField label="Service">
<Select <Select
inputId={`${refId}-slo-service`} inputId={`${refId}-slo-service`}
width={SELECT_WIDTH} width="auto"
allowCustomValue allowCustomValue
value={query?.serviceId && { value: query?.serviceId, label: query?.serviceName || query?.serviceId }} value={query?.serviceId && { value: query?.serviceId, label: query?.serviceName || query?.serviceId }}
placeholder="Select service" placeholder="Select service"
@ -49,6 +49,7 @@ export const Service: React.FC<Props> = ({ refId, query, templateVariableOptions
onChange({ ...query, serviceId, serviceName, sloId: '' }) onChange({ ...query, serviceId, serviceName, sloId: '' })
} }
/> />
</QueryEditorRow> </EditorField>
</EditorRow>
); );
}; };