diff --git a/packages/grafana-ui/src/types/datasource.ts b/packages/grafana-ui/src/types/datasource.ts index b80543f4e73..4d0780e4336 100644 --- a/packages/grafana-ui/src/types/datasource.ts +++ b/packages/grafana-ui/src/types/datasource.ts @@ -279,8 +279,10 @@ export interface QueryEditorProps< query: TQuery; onRunQuery: () => void; onChange: (value: TQuery) => void; - panelData: PanelData; // The current panel data - queryResponse?: PanelData; // data filtered to only this query. Includes the error. + /* + * Contains query response filtered by refId and possible query error + */ + data?: PanelData; } export enum DataSourceStatus { diff --git a/public/app/features/dashboard/panel_editor/QueryEditorRow.tsx b/public/app/features/dashboard/panel_editor/QueryEditorRow.tsx index 31b0377a032..bc6db4b742a 100644 --- a/public/app/features/dashboard/panel_editor/QueryEditorRow.tsx +++ b/public/app/features/dashboard/panel_editor/QueryEditorRow.tsx @@ -33,7 +33,7 @@ interface State { datasource: DataSourceApi | null; isCollapsed: boolean; hasTextEditMode: boolean; - queryResponse?: PanelData; + data?: PanelData; } export class QueryEditorRow extends PureComponent { @@ -46,7 +46,7 @@ export class QueryEditorRow extends PureComponent { isCollapsed: false, loadedDataSourceValue: undefined, hasTextEditMode: false, - queryResponse: null, + data: null, }; componentDidMount() { @@ -92,7 +92,7 @@ export class QueryEditorRow extends PureComponent { const { data, query, panel } = this.props; if (data !== prevProps.data) { - this.setState({ queryResponse: filterPanelDataToQuery(data, query.refId) }); + this.setState({ data: filterPanelDataToQuery(data, query.refId) }); if (this.angularScope) { this.angularScope.range = getTimeSrv().timeRange(); @@ -133,8 +133,8 @@ export class QueryEditorRow extends PureComponent { }; renderPluginEditor() { - const { query, data, onChange } = this.props; - const { datasource, queryResponse } = this.state; + const { query, onChange } = this.props; + const { datasource, data } = this.state; if (datasource.components.QueryCtrl) { return
(this.element = element)} />; @@ -149,8 +149,7 @@ export class QueryEditorRow extends PureComponent { datasource={datasource} onChange={onChange} onRunQuery={this.onRunQuery} - queryResponse={queryResponse} - panelData={data} + data={data} /> ); } diff --git a/public/app/features/explore/QueryRow.tsx b/public/app/features/explore/QueryRow.tsx index 3df0bebde20..17191e06d2e 100644 --- a/public/app/features/explore/QueryRow.tsx +++ b/public/app/features/explore/QueryRow.tsx @@ -146,8 +146,7 @@ export class QueryRow extends PureComponent { onRunQuery={this.onRunQuery} onHint={this.onClickHintFix} onChange={this.onChange} - panelData={null} - queryResponse={queryResponse} + data={queryResponse} absoluteRange={absoluteRange} /> ) : ( diff --git a/public/app/plugins/datasource/elasticsearch/components/ElasticsearchQueryField.tsx b/public/app/plugins/datasource/elasticsearch/components/ElasticsearchQueryField.tsx index ab6ef40272c..f7e05f2da8d 100644 --- a/public/app/plugins/datasource/elasticsearch/components/ElasticsearchQueryField.tsx +++ b/public/app/plugins/datasource/elasticsearch/components/ElasticsearchQueryField.tsx @@ -64,7 +64,7 @@ class ElasticsearchQueryField extends React.PureComponent { }; render() { - const { queryResponse, query } = this.props; + const { data, query } = this.props; const { syntaxLoaded } = this.state; return ( @@ -82,9 +82,7 @@ class ElasticsearchQueryField extends React.PureComponent { />
- {queryResponse && queryResponse.error ? ( -
{queryResponse.error.message}
- ) : null} + {data && data.error ?
data.error.message}
: null} ); } diff --git a/public/app/plugins/datasource/loki/components/AnnotationsQueryEditor.tsx b/public/app/plugins/datasource/loki/components/AnnotationsQueryEditor.tsx index d714844d1a8..07116dff36e 100644 --- a/public/app/plugins/datasource/loki/components/AnnotationsQueryEditor.tsx +++ b/public/app/plugins/datasource/loki/components/AnnotationsQueryEditor.tsx @@ -42,7 +42,7 @@ export const LokiAnnotationsQueryEditor = memo(function LokiAnnotationQueryEdito onChange={(query: LokiQuery) => onChange(query.expr)} onRunQuery={() => {}} history={[]} - panelData={null} + data={null} onLoadOptions={setActiveOption} onLabelsRefresh={refreshLabels} syntaxLoaded={isSyntaxReady} diff --git a/public/app/plugins/datasource/loki/components/LokiQueryEditor.tsx b/public/app/plugins/datasource/loki/components/LokiQueryEditor.tsx index 556a012c8e6..72eb0faae90 100644 --- a/public/app/plugins/datasource/loki/components/LokiQueryEditor.tsx +++ b/public/app/plugins/datasource/loki/components/LokiQueryEditor.tsx @@ -12,11 +12,11 @@ import { useLokiSyntax } from './useLokiSyntax'; type Props = QueryEditorProps; export const LokiQueryEditor = memo(function LokiQueryEditor(props: Props) { - const { query, panelData, datasource, onChange, onRunQuery } = props; + const { query, data, datasource, onChange, onRunQuery } = props; let absolute: AbsoluteTimeRange; - if (panelData && panelData.request) { - const { range } = panelData.request; + if (data && data.request) { + const { range } = data.request; absolute = { from: range.from.valueOf(), to: range.to.valueOf(), @@ -44,7 +44,7 @@ export const LokiQueryEditor = memo(function LokiQueryEditor(props: Props) { onChange={onChange} onRunQuery={onRunQuery} history={[]} - panelData={panelData} + data={data} onLoadOptions={setActiveOption} onLabelsRefresh={refreshLabels} syntaxLoaded={isSyntaxReady} diff --git a/public/app/plugins/datasource/loki/components/LokiQueryFieldForm.tsx b/public/app/plugins/datasource/loki/components/LokiQueryFieldForm.tsx index 57b0b6987f0..66954549abd 100644 --- a/public/app/plugins/datasource/loki/components/LokiQueryFieldForm.tsx +++ b/public/app/plugins/datasource/loki/components/LokiQueryFieldForm.tsx @@ -142,7 +142,7 @@ export class LokiQueryFieldForm extends React.PureComponent 0; const chooserText = getChooserText(syntaxLoaded, hasLogLabels, datasourceStatus); const buttonDisabled = !syntaxLoaded || datasourceStatus === DataSourceStatus.Disconnected; - const showError = queryResponse && queryResponse.error && queryResponse.error.refId === query.refId; + const showError = data && data.error && data.error.refId === query.refId; return ( <> @@ -192,9 +192,7 @@ export class LokiQueryFieldForm extends React.PureComponent -
- {showError ?
{queryResponse.error.message}
: null} -
+
{showError ?
{data.error.message}
: null}
); } diff --git a/public/app/plugins/datasource/prometheus/components/PromQueryEditor.tsx b/public/app/plugins/datasource/prometheus/components/PromQueryEditor.tsx index 8cccca92b95..eee711fa0e1 100644 --- a/public/app/plugins/datasource/prometheus/components/PromQueryEditor.tsx +++ b/public/app/plugins/datasource/prometheus/components/PromQueryEditor.tsx @@ -92,7 +92,7 @@ export class PromQueryEditor extends PureComponent { }; render() { - const { datasource, query, panelData, queryResponse } = this.props; + const { datasource, query, data } = this.props; const { formatOption, instant, interval, intervalFactorOption, legendFormat } = this.state; return ( @@ -103,8 +103,7 @@ export class PromQueryEditor extends PureComponent { onRunQuery={this.onRunQuery} onChange={this.onFieldChange} history={[]} - panelData={panelData} - queryResponse={queryResponse} + data={data} datasourceStatus={DataSourceStatus.Connected} // TODO: replace with real DataSourceStatus /> @@ -165,7 +164,7 @@ export class PromQueryEditor extends PureComponent { diff --git a/public/app/plugins/datasource/prometheus/components/PromQueryField.tsx b/public/app/plugins/datasource/prometheus/components/PromQueryField.tsx index 99eef38bde3..0d8fefff7c8 100644 --- a/public/app/plugins/datasource/prometheus/components/PromQueryField.tsx +++ b/public/app/plugins/datasource/prometheus/components/PromQueryField.tsx @@ -152,9 +152,9 @@ class PromQueryField extends React.PureComponent { - const { datasource, query, queryResponse } = this.props; + const { datasource, query, data } = this.props; - if (!queryResponse || queryResponse.series.length === 0) { + if (!data || data.series.length === 0) { this.setState({ hint: null }); return; } - const result = isDataFrame(queryResponse.series[0]) - ? queryResponse.series.map(toLegacyResponseData) - : queryResponse.series; + const result = isDataFrame(data.series[0]) ? data.series.map(toLegacyResponseData) : data.series; const hints = datasource.getQueryHints(query, result); const hint = hints && hints.length > 0 ? hints[0] : null; this.setState({ hint }); @@ -297,12 +295,12 @@ class PromQueryField extends React.PureComponent @@ -329,7 +327,7 @@ class PromQueryField extends React.PureComponent - {showError ?
{queryResponse.error.message}
: null} + {showError ?
{data.error.message}
: null} {hint ? (
{hint.label}{' '}