Loki: Refactor query editor so query field can be used independently (#33276)

* Refactor Loki so LokiQueryField can be used independently

* Refactor PromQueryEditor
This commit is contained in:
Ivana Huckova
2021-04-23 10:08:23 +02:00
committed by GitHub
parent c809d63065
commit c32c682f81
9 changed files with 590 additions and 541 deletions

View File

@ -7,11 +7,13 @@ import { InlineFormLabel } from '@grafana/ui';
import { LokiDatasource } from '../datasource';
import { LokiQuery, LokiOptions } from '../types';
import { LokiQueryField } from './LokiQueryField';
import { LokiOptionFields } from './LokiOptionFields';
type Props = QueryEditorProps<LokiDatasource, LokiQuery, LokiOptions>;
export function LokiQueryEditor(props: Props) {
const { range, query, data, datasource, onChange, onRunQuery } = props;
const absoluteTimeRange = { from: range!.from!.valueOf(), to: range!.to!.valueOf() }; // Range here is never optional
const onLegendChange = (e: React.SyntheticEvent<HTMLInputElement>) => {
const nextQuery = { ...query, legendFormat: e.currentTarget.value };
@ -49,9 +51,20 @@ export function LokiQueryEditor(props: Props) {
onBlur={onRunQuery}
history={[]}
data={data}
range={range}
runOnBlur={true}
ExtraFieldElement={legendField}
absoluteRange={absoluteTimeRange}
ExtraFieldElement={
<>
<LokiOptionFields
queryType={query.instant ? 'instant' : 'range'}
lineLimitValue={query?.maxLines?.toString() || ''}
query={query}
onRunQuery={onRunQuery}
onChange={onChange}
runOnBlur={true}
/>
{legendField}
</>
}
/>
);
}