I have an issue with
ReactTransitionGroup, whereby an element which has just had
.superfade-leave-active applied, doesn't apply
.superfade-enter afterwards, when the render method is telling it to.
The logic is that the message shown is the first item in the
ReactTransitionGroup list, and my
UserSearchResults component is the second. The latter only appears when the data is loaded. (The data is mocked as an array at the top, and is loaded with a 500ms delay.)
Desired result: first element appears whenever there is text in the list; second always appears whenever the data is loaded
Actual result: first element works as desired; second shows initially, but then after any text change after 500ms, it animates away.
Note: When the animate component is removed, it works as expected.