[Lens] Fix console.error react memory leak when saving new viz (#65490)

This commit is contained in:
Marta Bondyra 2020-05-07 17:21:49 +02:00 committed by GitHub
parent c0164bc645
commit eb97e919f3
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 18 additions and 7 deletions

View file

@ -4,7 +4,7 @@
* you may not use this file except in compliance with the Elastic License.
*/
import React, { useState, useMemo, memo, FunctionComponent } from 'react';
import React, { useState, useMemo, useEffect, memo, FunctionComponent } from 'react';
import { debounce } from 'lodash';
/**
@ -17,7 +17,11 @@ export function debouncedComponent<TProps>(component: FunctionComponent<TProps>,
return (props: TProps) => {
const [cachedProps, setCachedProps] = useState(props);
const delayRender = useMemo(() => debounce(setCachedProps, delay), []);
const debouncePropsChange = debounce(setCachedProps, delay);
const delayRender = useMemo(() => debouncePropsChange, []);
// cancel debounced prop change if component has been unmounted in the meantime
useEffect(() => () => debouncePropsChange.cancel(), []);
delayRender(props);

View file

@ -61,6 +61,8 @@ export function EditorFrame(props: EditorFrameProps) {
// Initialize current datasource and all active datasources
useEffect(() => {
// prevents executing dispatch on unmounted component
let isUnmounted = false;
if (!allLoaded) {
Object.entries(props.datasourceMap).forEach(([datasourceId, datasource]) => {
if (
@ -70,16 +72,21 @@ export function EditorFrame(props: EditorFrameProps) {
datasource
.initialize(state.datasourceStates[datasourceId].state || undefined)
.then(datasourceState => {
dispatch({
type: 'UPDATE_DATASOURCE_STATE',
updater: datasourceState,
datasourceId,
});
if (!isUnmounted) {
dispatch({
type: 'UPDATE_DATASOURCE_STATE',
updater: datasourceState,
datasourceId,
});
}
})
.catch(onError);
}
});
}
return () => {
isUnmounted = true;
};
}, [allLoaded]);
const datasourceLayers: Record<string, DatasourcePublicAPI> = {};