Fix transition group

This commit is contained in:
Jerko Steiner 2019-11-17 09:31:24 -03:00
parent b46206de1f
commit 63bae9fc55

View File

@ -1,4 +1,5 @@
import CSSTransition from 'react-transition-group/CSSTransition' import CSSTransition from 'react-transition-group/CSSTransition'
import TransitionGroup from 'react-transition-group/TransitionGroup'
import React from 'react' import React from 'react'
import classnames from 'classnames' import classnames from 'classnames'
import { Notification } from '../actions/NotifyActions' import { Notification } from '../actions/NotifyActions'
@ -22,19 +23,21 @@ extends React.PureComponent<NotificationProps> {
const { notifications, max } = this.props const { notifications, max } = this.props
return ( return (
<div className="notifications"> <div className="notifications">
{Object.keys(notifications).slice(-max).map(id => ( <TransitionGroup>
<CSSTransition {Object.keys(notifications).slice(-max).map(id => (
key={id} <CSSTransition
classNames='fade' key={id}
timeout={transitionTimeout} classNames='fade'
> timeout={transitionTimeout}
<div
className={classnames(notifications[id].type, 'notification')}
> >
{notifications[id].message} <div
</div> className={classnames(notifications[id].type, 'notification')}
</CSSTransition> >
))} {notifications[id].message}
</div>
</CSSTransition>
))}
</TransitionGroup>
</div> </div>
) )
} }