Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Bug 1722876: Fix Infinite Re-Render Bug in Operand List Sort #1863

Merged

Conversation

alecmerdler
Copy link
Contributor

@alecmerdler alecmerdler commented Jun 28, 2019

Description

Use React.memo() and React.useCallback() to prevent HorizontalNav from re-rendering unnecessarily, which causes the detail page route components to be mounted/unmounted when using props.pagesFor().

Upgrade react-redux to work with React.memo()
Upgrade react-router, react-router-dom so that they work with React.memo()
Upgrade react-helmet because of another call stack issue.

Also renames components, types, and other symbols from using ClusterServiceVersionResource to Operand.

Fixes https://bugzilla.redhat.com/show_bug.cgi?id=1722876

@openshift-ci-robot openshift-ci-robot added the size/L Denotes a PR that changes 100-499 lines, ignoring generated files. label Jun 28, 2019
@openshift-ci-robot openshift-ci-robot added the approved Indicates a PR has been approved by an approver from all required OWNERS files. label Jun 28, 2019
@@ -116,7 +116,7 @@ export const navFactory: NavFactory = {
}),
};

export const NavBar: React.SFC<NavBarProps> = ({pages, basePath, hideDivider}) => {
export const NavBar = withRouter<NavBarProps>(({pages, basePath, hideDivider}) => {
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is actually a better solution to ensure NavBar re-renders when the route changes. Before it was depending on HorizontalNav to be re-rendered, but using withRouter ensures we capture route changes.

NavBar.displayName = 'NavBar';

export class HorizontalNav extends React.PureComponent<HorizontalNavProps> {
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Converted to functional component with useMemo() to prevent unmounting child <Route> components.

import ConnectedEmptyStateComponent from '../EmptyState';
import { getStoreTypedComponent } from '../../test/test-utils';

describe('EmptyState', () => {
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Doesn't really test anything, and fails when upgrading to newer react-redux version.

@spadgett spadgett added this to the v4.2 milestone Jun 28, 2019
Copy link
Member

@spadgett spadgett left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice catch 👍

Operand is a much better name as well.

/lgtm

@openshift-ci-robot openshift-ci-robot added the lgtm Indicates that a PR is ready to be merged. label Jun 28, 2019
@spadgett spadgett changed the title Fix Infinite Re-Render Bug in Operand List Sort Bug 1722876: Fix Infinite Re-Render Bug in Operand List Sort Jun 28, 2019
@openshift-ci-robot
Copy link
Contributor

@alecmerdler: This pull request references a valid Bugzilla bug. The bug has been moved to the POST state.

In response to this:

Bug 1722876: Fix Infinite Re-Render Bug in Operand List Sort

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes/test-infra repository.

@openshift-ci-robot openshift-ci-robot added the bugzilla/valid-bug Indicates that a referenced Bugzilla bug is valid for the branch this PR is targeting. label Jun 28, 2019
@openshift-ci-robot openshift-ci-robot removed the lgtm Indicates that a PR is ready to be merged. label Jun 29, 2019
frontend/package.json Outdated Show resolved Hide resolved
@spadgett
Copy link
Member

spadgett commented Jul 1, 2019

/lgtm

@openshift-ci-robot openshift-ci-robot added the lgtm Indicates that a PR is ready to be merged. label Jul 1, 2019
@spadgett
Copy link
Member

spadgett commented Jul 1, 2019

Looks like integration test login is broken with this change

@openshift-bot
Copy link
Contributor

/retest

Please review the full test history for this PR and help us cut down flakes.

1 similar comment
@openshift-bot
Copy link
Contributor

/retest

Please review the full test history for this PR and help us cut down flakes.

@spadgett
Copy link
Member

spadgett commented Jul 2, 2019

/hold

...to prevent automatic retesting. The login tests are consistently failing.

@openshift-ci-robot openshift-ci-robot added the do-not-merge/hold Indicates that a PR should not merge because someone has issued a /hold command. label Jul 2, 2019
@openshift-ci-robot openshift-ci-robot added size/XL Denotes a PR that changes 500-999 lines, ignoring generated files. and removed lgtm Indicates that a PR is ready to be merged. size/L Denotes a PR that changes 100-499 lines, ignoring generated files. labels Jul 2, 2019
@@ -24,12 +24,6 @@ import {
PageSectionVariants,
} from '@patternfly/react-core';

// React Router's proptypes are incorrect. See https://github.com/ReactTraining/react-router/pull/5393
(Route as any).propTypes.path = PropTypes.oneOfType([
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This was causing problems with yarn run build. Issue appears to be fixed with newer version of library.

@spadgett
Copy link
Member

spadgett commented Jul 2, 2019

/hold cancel
/lgtm

@openshift-ci-robot openshift-ci-robot added lgtm Indicates that a PR is ready to be merged. and removed do-not-merge/hold Indicates that a PR should not merge because someone has issued a /hold command. labels Jul 2, 2019
@openshift-ci-robot
Copy link
Contributor

[APPROVALNOTIFIER] This PR is APPROVED

This pull-request has been approved by: alecmerdler, spadgett

The full list of commands accepted by this bot can be found here.

The pull request process is described here

Needs approval from an approver in each of these files:

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment

@spadgett
Copy link
Member

spadgett commented Jul 2, 2019

We got past login this time

/retest

@alecmerdler
Copy link
Contributor Author

Tests are passing locally for me, so they must be CI flakes.

@openshift-merge-robot openshift-merge-robot merged commit c7b6d7e into openshift:master Jul 3, 2019
@alecmerdler alecmerdler deleted the bugzilla-1722876 branch July 3, 2019 04:17
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
approved Indicates a PR has been approved by an approver from all required OWNERS files. bugzilla/valid-bug Indicates that a referenced Bugzilla bug is valid for the branch this PR is targeting. lgtm Indicates that a PR is ready to be merged. size/XL Denotes a PR that changes 500-999 lines, ignoring generated files.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

5 participants