Only change handlers as the element changes (#56782) (#56822)

Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>

Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
This commit is contained in:
Corey Robertson 2020-02-04 22:47:11 -05:00 committed by GitHub
parent e0bbe83532
commit fe80d9f2c2
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 20 additions and 9 deletions

View file

@ -58,12 +58,10 @@ function selectorFactory(dispatch) {
export const ElementWrapper = compose(
connectAdvanced(selectorFactory),
withPropsOnChange(
(props, nextProps) =>
!isEqual(props.element, nextProps.element) ||
!isEqual(props.selectedPage, nextProps.selectedPage),
(props, nextProps) => !isEqual(props.element, nextProps.element),
props => {
const { element, createHandlers } = props;
const handlers = createHandlers(element, props.selectedPage);
const handlers = createHandlers(element);
// this removes element and createHandlers from passed props
return { handlers };
}

View file

@ -16,7 +16,7 @@ export const createHandlers = dispatch => {
let oldElement;
let completeFn = () => {};
return (element, pageId) => {
return element => {
// reset isComplete when element changes
if (!isEqual(oldElement, element)) {
isComplete = false;
@ -25,7 +25,7 @@ export const createHandlers = dispatch => {
return {
setFilter(text) {
dispatch(setFilter(text, element.id, pageId, true));
dispatch(setFilter(text, element.id, true));
},
getFilter() {

View file

@ -254,9 +254,9 @@ export const removeElements = createThunk(
export const setFilter = createThunk(
'setFilter',
({ dispatch }, filter, elementId, pageId, doRender = true) => {
({ dispatch }, filter, elementId, doRender = true) => {
const _setFilter = createAction('setFilter');
dispatch(_setFilter({ filter, elementId, pageId }));
dispatch(_setFilter({ filter, elementId }));
if (doRender === true) {
dispatch(fetchAllRenderables());

View file

@ -87,6 +87,18 @@ const trimElement = ({ id, position, expression, filter }) => ({
...(filter !== void 0 && { filter }),
});
const getPageWithElementId = (workpad, elementId) => {
const matchingPage = workpad.pages.find(page =>
page.elements.map(element => element.id).includes(elementId)
);
if (matchingPage) {
return matchingPage.id;
}
return undefined;
};
export const elementsReducer = handleActions(
{
// TODO: This takes the entire element, which is not necessary, it could just take the id.
@ -95,7 +107,8 @@ export const elementsReducer = handleActions(
return assignNodeProperties(workpadState, pageId, elementId, { expression });
},
[actions.setFilter]: (workpadState, { payload }) => {
const { filter, pageId, elementId } = payload;
const { filter, elementId } = payload;
const pageId = getPageWithElementId(workpadState, elementId);
return assignNodeProperties(workpadState, pageId, elementId, { filter });
},
[actions.setMultiplePositions]: (workpadState, { payload }) =>