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