Participant list is now animated on events, fixes #302
parent
136037d83f
commit
feac3f069d
|
|
@ -27,6 +27,7 @@
|
|||
"react": "^16.10.2",
|
||||
"react-cookie-consent": "^2.5.0",
|
||||
"react-dom": "^16.10.2",
|
||||
"react-flip-toolkit": "^7.0.9",
|
||||
"react-intl": "^3.4.0",
|
||||
"react-redux": "^7.1.1",
|
||||
"react-router-dom": "^5.1.2",
|
||||
|
|
|
|||
|
|
@ -7,6 +7,7 @@ import classnames from 'classnames';
|
|||
import { withStyles } from '@material-ui/core/styles';
|
||||
import { withRoomContext } from '../../../RoomContext';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Flipper, Flipped } from 'react-flip-toolkit';
|
||||
import { FormattedMessage } from 'react-intl';
|
||||
import ListPeer from './ListPeer';
|
||||
import ListMe from './ListMe';
|
||||
|
|
@ -110,7 +111,11 @@ class ParticipantList extends React.PureComponent
|
|||
defaultMessage='Participants'
|
||||
/>
|
||||
</li>
|
||||
<Flipper
|
||||
flipKey={participants}
|
||||
>
|
||||
{ participants.map((peer) => (
|
||||
<Flipped key={peer.id} flipId={peer.id}>
|
||||
<li
|
||||
key={peer.id}
|
||||
className={classnames(classes.listItem, {
|
||||
|
|
@ -135,7 +140,9 @@ class ParticipantList extends React.PureComponent
|
|||
/>
|
||||
}
|
||||
</li>
|
||||
</Flipped>
|
||||
))}
|
||||
</Flipper>
|
||||
</ul>
|
||||
</div>
|
||||
);
|
||||
|
|
|
|||
Loading…
Reference in New Issue