1import React from 'react'; 2import { AzureMonitorErrorish, AzureMonitorOption, AzureMonitorQuery } from '../../types'; 3import Datasource from '../../datasource'; 4import { Alert, InlineFieldRow } from '@grafana/ui'; 5import QueryField from './QueryField'; 6import FormatAsField from './FormatAsField'; 7import ResourceField from './ResourceField'; 8import useMigrations from './useMigrations'; 9 10interface LogsQueryEditorProps { 11 query: AzureMonitorQuery; 12 datasource: Datasource; 13 subscriptionId?: string; 14 onChange: (newQuery: AzureMonitorQuery) => void; 15 variableOptionGroup: { label: string; options: AzureMonitorOption[] }; 16 setError: (source: string, error: AzureMonitorErrorish | undefined) => void; 17 hideFormatAs?: boolean; 18} 19 20const LogsQueryEditor: React.FC<LogsQueryEditorProps> = ({ 21 query, 22 datasource, 23 subscriptionId, 24 variableOptionGroup, 25 onChange, 26 setError, 27 hideFormatAs, 28}) => { 29 const migrationError = useMigrations(datasource, query, onChange); 30 31 return ( 32 <div data-testid="azure-monitor-logs-query-editor"> 33 <InlineFieldRow> 34 <ResourceField 35 query={query} 36 datasource={datasource} 37 subscriptionId={subscriptionId} 38 variableOptionGroup={variableOptionGroup} 39 onQueryChange={onChange} 40 setError={setError} 41 /> 42 </InlineFieldRow> 43 44 <QueryField 45 query={query} 46 datasource={datasource} 47 subscriptionId={subscriptionId} 48 variableOptionGroup={variableOptionGroup} 49 onQueryChange={onChange} 50 setError={setError} 51 /> 52 53 {!hideFormatAs && ( 54 <FormatAsField 55 query={query} 56 datasource={datasource} 57 subscriptionId={subscriptionId} 58 variableOptionGroup={variableOptionGroup} 59 onQueryChange={onChange} 60 setError={setError} 61 /> 62 )} 63 64 {migrationError && <Alert title={migrationError.title}>{migrationError.message}</Alert>} 65 </div> 66 ); 67}; 68 69export default LogsQueryEditor; 70