1import React from 'react'; 2 3import Datasource from '../../datasource'; 4import { AzureMonitorQuery, AzureMonitorOption, AzureMonitorErrorish } from '../../types'; 5import SubscriptionField from '../SubscriptionField'; 6import MetricNamespaceField from './MetricNamespaceField'; 7import ResourceTypeField from './ResourceTypeField'; 8import ResourceGroupsField from './ResourceGroupsField'; 9import ResourceNameField from './ResourceNameField'; 10import MetricNameField from './MetricNameField'; 11import AggregationField from './AggregationField'; 12import TimeGrainField from './TimeGrainField'; 13import DimensionFields from './DimensionFields'; 14import TopField from './TopField'; 15import LegendFormatField from './LegendFormatField'; 16import { InlineFieldRow } from '@grafana/ui'; 17import { 18 useMetricNames, 19 useMetricNamespaces, 20 useResourceGroups, 21 useResourceNames, 22 useResourceTypes, 23 useSubscriptions, 24 useMetricMetadata, 25} from './dataHooks'; 26 27interface MetricsQueryEditorProps { 28 query: AzureMonitorQuery; 29 datasource: Datasource; 30 subscriptionId?: string; 31 onChange: (newQuery: AzureMonitorQuery) => void; 32 variableOptionGroup: { label: string; options: AzureMonitorOption[] }; 33 setError: (source: string, error: AzureMonitorErrorish | undefined) => void; 34} 35 36const MetricsQueryEditor: React.FC<MetricsQueryEditorProps> = ({ 37 query, 38 datasource, 39 subscriptionId, 40 variableOptionGroup, 41 onChange, 42 setError, 43}) => { 44 const metricsMetadata = useMetricMetadata(query, datasource, onChange); 45 const subscriptions = useSubscriptions(query, datasource, onChange, setError); 46 const resourceGroups = useResourceGroups(query, datasource, onChange, setError); 47 const resourceTypes = useResourceTypes(query, datasource, onChange, setError); 48 const resourceNames = useResourceNames(query, datasource, onChange, setError); 49 const metricNames = useMetricNames(query, datasource, onChange, setError); 50 const metricNamespaces = useMetricNamespaces(query, datasource, onChange, setError); 51 52 return ( 53 <div data-testid="azure-monitor-metrics-query-editor"> 54 <InlineFieldRow> 55 <SubscriptionField 56 subscriptions={subscriptions} 57 query={query} 58 datasource={datasource} 59 subscriptionId={subscriptionId} 60 variableOptionGroup={variableOptionGroup} 61 onQueryChange={onChange} 62 setError={setError} 63 /> 64 65 <ResourceGroupsField 66 resourceGroups={resourceGroups} 67 query={query} 68 datasource={datasource} 69 subscriptionId={subscriptionId} 70 variableOptionGroup={variableOptionGroup} 71 onQueryChange={onChange} 72 setError={setError} 73 /> 74 </InlineFieldRow> 75 76 <InlineFieldRow> 77 <ResourceTypeField 78 resourceTypes={resourceTypes} 79 query={query} 80 datasource={datasource} 81 subscriptionId={subscriptionId} 82 variableOptionGroup={variableOptionGroup} 83 onQueryChange={onChange} 84 setError={setError} 85 /> 86 <ResourceNameField 87 resourceNames={resourceNames} 88 query={query} 89 datasource={datasource} 90 subscriptionId={subscriptionId} 91 variableOptionGroup={variableOptionGroup} 92 onQueryChange={onChange} 93 setError={setError} 94 /> 95 </InlineFieldRow> 96 97 <InlineFieldRow> 98 <MetricNamespaceField 99 metricNamespaces={metricNamespaces} 100 query={query} 101 datasource={datasource} 102 subscriptionId={subscriptionId} 103 variableOptionGroup={variableOptionGroup} 104 onQueryChange={onChange} 105 setError={setError} 106 /> 107 <MetricNameField 108 metricNames={metricNames} 109 query={query} 110 datasource={datasource} 111 subscriptionId={subscriptionId} 112 variableOptionGroup={variableOptionGroup} 113 onQueryChange={onChange} 114 setError={setError} 115 /> 116 </InlineFieldRow> 117 <InlineFieldRow> 118 <AggregationField 119 query={query} 120 datasource={datasource} 121 subscriptionId={subscriptionId} 122 variableOptionGroup={variableOptionGroup} 123 onQueryChange={onChange} 124 setError={setError} 125 aggregationOptions={metricsMetadata?.aggOptions ?? []} 126 isLoading={metricsMetadata.isLoading} 127 /> 128 <TimeGrainField 129 query={query} 130 datasource={datasource} 131 subscriptionId={subscriptionId} 132 variableOptionGroup={variableOptionGroup} 133 onQueryChange={onChange} 134 setError={setError} 135 timeGrainOptions={metricsMetadata?.timeGrains ?? []} 136 /> 137 </InlineFieldRow> 138 <DimensionFields 139 query={query} 140 datasource={datasource} 141 subscriptionId={subscriptionId} 142 variableOptionGroup={variableOptionGroup} 143 onQueryChange={onChange} 144 setError={setError} 145 dimensionOptions={metricsMetadata?.dimensions ?? []} 146 /> 147 <TopField 148 query={query} 149 datasource={datasource} 150 subscriptionId={subscriptionId} 151 variableOptionGroup={variableOptionGroup} 152 onQueryChange={onChange} 153 setError={setError} 154 /> 155 <LegendFormatField 156 query={query} 157 datasource={datasource} 158 subscriptionId={subscriptionId} 159 variableOptionGroup={variableOptionGroup} 160 onQueryChange={onChange} 161 setError={setError} 162 /> 163 </div> 164 ); 165}; 166 167export default MetricsQueryEditor; 168