Uploaded image for project: 'Jenkins'
  1. Jenkins
  2. JENKINS-35857

Investigate ReactTransitionGroup improvements

    Details

    • Epic Link:
    • Sprint:
      1.0-m10
    • Similar Issues:

      Description

      While implementing UX-407 and UX-234 we found some potential code smells when using ReactCSSTransitionGroup:

      • For components that need to remove themselves, we have relied in setTimeout with a delay that matches the "leave" animation's duration to trigger the remove.
        • ReactTransitionGroup exposes useful callbacks like componentDidLeave that would be better to utilize rather than setTimeout with the right delay value.
      • Having to ensure that the animation durations defined in CSS match the durations declared on ReactCSSTransitionGroup properties (e.g. transitionAppearTimeout, transitionLeaveTimeout) is the source of potential bugs.
        • Perhaps we can extract the timings from the CSS definition to avoid having to keep them in sync. May not be totally feasible, needs more research.

        Attachments

          Issue Links

            Activity

            Hide
            cliffmeyers Cliff Meyers added a comment -

            I spent a few hours investigating this one earlier in the week and my conclusion is to defer this for now. I could not find a way to extend ReactCSSTransitionGroup and override the _wrapChild function to provide animation lifecycle callbacks. The consensus of the research I did on the web was "DON'T TRY TO EXTEND REACT COMPONENTS" and to use higher-level components, but I can't see how that will work since we need to adjust how RCSSTG actually instantiates its own child components.

            Show
            cliffmeyers Cliff Meyers added a comment - I spent a few hours investigating this one earlier in the week and my conclusion is to defer this for now. I could not find a way to extend ReactCSSTransitionGroup and override the _wrapChild function to provide animation lifecycle callbacks. The consensus of the research I did on the web was "DON'T TRY TO EXTEND REACT COMPONENTS" and to use higher-level components, but I can't see how that will work since we need to adjust how RCSSTG actually instantiates its own child components.

              People

              • Assignee:
                cliffmeyers Cliff Meyers
                Reporter:
                jamesdumay James Dumay
              • Votes:
                0 Vote for this issue
                Watchers:
                1 Start watching this issue

                Dates

                • Created:
                  Updated:
                  Resolved: