Datasource: updates PromExploreQueryEditor to prevent it from throwing error on edit (#21605)

* Datasource: updates PromExploreQueryEditor - rewrite to functional component

* Datasource: updates PromQueryField - moves an extra field from children to the separate prop

* Datasource: adds PromExploreExtraField

* Datasource: updates PromExploreQueryEditor - fixes typo

* Datasource: updates prometheus explore editor snapshots

* Datasource: updates PromExploreExtraField export

* Datasource: removes unnecessary div from PromExploreQueryEditor

* Datasource: adds basic PromExploreExtraField snapshot test

* Datasource: adds basic PromExploreQueryEditor test

* Datasource: updates PromExploreQueryEditor snapshot to fix timezone issues

* Datasource: updates PromExploreQueryEditor - onChangeQueryStep cleanup

* Datasource: updates PromExploreQueryEditor test to check ExtraFieldElement render

* Datasource: simplified PromExploreQueryEditor onStepChange method

* Datasource: updates Prometheus module import

* Datasource: updates PromExploreQueryEditor test

* Datasource: updates PromExploreQueryEditor tests

* Datasource: fixes PromExploreQueryEditor error on empty interval init

* Datasource: adds a tooltip to PromExploreExtraField mounted in PromExploreQueryEditor

* Datasource: updates PromExploreQueryEditor snapshots
This commit is contained in:
Lukas Siatka
2020-02-06 12:37:30 +00:00
committed by GitHub
parent df48d1c19f
commit 2d3c5064e1
8 changed files with 285 additions and 73 deletions

View File

@@ -1,5 +1,5 @@
import _ from 'lodash';
import React from 'react';
import React, { ReactNode } from 'react';
import { Plugin } from 'slate';
import {
@@ -110,6 +110,7 @@ export function willApplySuggestion(suggestion: string, { typeaheadContext, type
interface PromQueryFieldProps extends ExploreQueryFieldProps<PrometheusDatasource, PromQuery, PromOptions> {
history: Array<HistoryItem<PromQuery>>;
ExtraFieldElement?: ReactNode;
}
interface PromQueryFieldState {
@@ -291,7 +292,7 @@ class PromQueryField extends React.PureComponent<PromQueryFieldProps, PromQueryF
};
render() {
const { data, query, children } = this.props;
const { data, query, ExtraFieldElement } = this.props;
const { metricsOptions, syntaxLoaded, hint } = this.state;
const cleanText = this.languageProvider ? this.languageProvider.cleanText : undefined;
const chooserText = getChooserText(syntaxLoaded, metricsOptions);
@@ -321,7 +322,7 @@ class PromQueryField extends React.PureComponent<PromQueryFieldProps, PromQueryF
syntaxLoaded={syntaxLoaded}
/>
</div>
{children}
{ExtraFieldElement}
</div>
{showError ? (
<div className="query-row-break">