fix: Removes Redux state mutations - iteration 3 (#23637)

This commit is contained in:
Michael S. Molina 2023-04-10 19:01:34 -03:00 committed by GitHub
parent ca408a7159
commit 8bd8276791
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -16,7 +16,7 @@
* specific language governing permissions and limitations
* under the License.
*/
import { snakeCase, isEqual } from 'lodash';
import { snakeCase, isEqual, cloneDeep } from 'lodash';
import PropTypes from 'prop-types';
import React from 'react';
import {
@ -117,6 +117,11 @@ class ChartRenderer extends React.Component {
this.props.actions?.updateDataMask(this.props.chartId, dataMask);
},
};
// TODO: queriesResponse comes from Redux store but it's being edited by
// the plugins, hence we need to clone it to avoid state mutation
// until we change the reducers to use Redux Toolkit with Immer
this.mutableQueriesResponse = cloneDeep(this.props.queriesResponse);
}
shouldComponentUpdate(nextProps, nextState) {
@ -131,6 +136,11 @@ class ChartRenderer extends React.Component {
}
this.hasQueryResponseChange =
nextProps.queriesResponse !== this.props.queriesResponse;
if (this.hasQueryResponseChange) {
this.mutableQueriesResponse = cloneDeep(nextProps.queriesResponse);
}
return (
this.hasQueryResponseChange ||
!isEqual(nextProps.datasource, this.props.datasource) ||
@ -246,7 +256,6 @@ class ChartRenderer extends React.Component {
chartIsStale,
formData,
latestQueryFormData,
queriesResponse,
postTransformProps,
} = this.props;
@ -339,7 +348,7 @@ class ChartRenderer extends React.Component {
filterState={filterState}
hooks={this.hooks}
behaviors={behaviors}
queriesData={queriesResponse}
queriesData={this.mutableQueriesResponse}
onRenderSuccess={this.handleRenderSuccess}
onRenderFailure={this.handleRenderFailure}
noResults={noResultsComponent}