mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
QueryEditorRow: Fix broken drag-and-drop reordering (#56515)
This commit is contained in:
@@ -75,6 +75,7 @@ export class QueryEditorRow<TQuery extends DataQuery> extends PureComponent<Prop
|
||||
element: HTMLElement | null = null;
|
||||
angularScope: AngularQueryComponentScope<TQuery> | null = null;
|
||||
angularQueryEditor: AngularComponent | null = null;
|
||||
id = '';
|
||||
|
||||
state: State<TQuery> = {
|
||||
datasource: null,
|
||||
@@ -85,8 +86,9 @@ export class QueryEditorRow<TQuery extends DataQuery> extends PureComponent<Prop
|
||||
};
|
||||
|
||||
componentDidMount() {
|
||||
const { data, query } = this.props;
|
||||
const { data, query, id } = this.props;
|
||||
const dataFilteredByRefId = filterPanelDataToQuery(data, query.refId);
|
||||
this.id = uniqueId(id + '_');
|
||||
this.setState({ data: dataFilteredByRefId });
|
||||
|
||||
this.loadDatasource();
|
||||
@@ -159,6 +161,10 @@ export class QueryEditorRow<TQuery extends DataQuery> extends PureComponent<Prop
|
||||
const { datasource, loadedDataSourceIdentifier } = this.state;
|
||||
const { data, query } = this.props;
|
||||
|
||||
if (prevProps.id !== this.props.id) {
|
||||
this.id = uniqueId(this.props.id + '_');
|
||||
}
|
||||
|
||||
if (data !== prevProps.data) {
|
||||
const dataFilteredByRefId = filterPanelDataToQuery(data, query.refId);
|
||||
|
||||
@@ -449,10 +455,9 @@ export class QueryEditorRow<TQuery extends DataQuery> extends PureComponent<Prop
|
||||
};
|
||||
|
||||
render() {
|
||||
const { query, id, index, visualization } = this.props;
|
||||
const { query, index, visualization } = this.props;
|
||||
const { datasource, showingHelp, data } = this.state;
|
||||
const isDisabled = query.hide;
|
||||
const generatedUniqueId = uniqueId(id + '_');
|
||||
|
||||
const rowClasses = classNames('query-editor-row', {
|
||||
'query-editor-row--disabled': isDisabled,
|
||||
@@ -469,14 +474,14 @@ export class QueryEditorRow<TQuery extends DataQuery> extends PureComponent<Prop
|
||||
return (
|
||||
<div aria-label={selectors.components.QueryEditorRows.rows}>
|
||||
<QueryOperationRow
|
||||
id={generatedUniqueId}
|
||||
id={this.id}
|
||||
draggable={true}
|
||||
index={index}
|
||||
headerElement={this.renderHeader}
|
||||
actions={this.renderActions}
|
||||
onOpen={this.onOpen}
|
||||
>
|
||||
<div className={rowClasses} id={generatedUniqueId}>
|
||||
<div className={rowClasses} id={this.id}>
|
||||
<ErrorBoundaryAlert>
|
||||
{showingHelp && DatasourceCheatsheet && (
|
||||
<OperationRowHelp>
|
||||
|
||||
Reference in New Issue
Block a user