Rerender child components when the parent changes this.props.isOpen

[ndbroadbent]

Instead of checking for this.isOpen !== props.isOpen, we need to check for this.props.isOpen !== props.isOpen, so that the parent component can close the menu force child components to re-render by updating the isOpen prop.

(this.isOpen and this.props.isOpen can get out of sync.)

[Kureev]

Hi @ndbroadbent. this.props.isOpen & this.isOpen can be out of sync, indeed. This happens because we need to mutate isOpen property every time when we toggle side menu. As you may know, it's a bad practice to mutate props, so we keep a local, props-driven value in the instance property.

Furthermore, we have componentWillReceiveProps that keeps an eye on this.props.isOpen, so I don't see a reason why we need to change this. Can you elaborate?

[Kureev]

Closed due to lack of feedback. Feel free to re-open this PR answering the question above.

[AlexCatch]

It would make more sense to have a single source of truth. We either keep the open state entirely in the side menu or we keep it entirely in the parent component, it's not generally recommended to copy props like it is.

It also requires you to call forceUpdate as it's set as a property of the side menu and not inside state, is there a reason why it isn't stored in the component state?