haskal
/
jiti-meet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(breakout-rooms) make sure participants in breakout rooms have a display name

This commit is contained in:
Saúl Ibarra Corretgé 2021-12-01 17:29:47 +01:00 committed by Saúl Ibarra Corretgé
parent d9f71ee238
commit 591eab7c97
3 changed files with 19 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
react/features/breakout-rooms/components/native/BreakoutRoomParticipantItem.js
View File

@ -1,6 +1,7 @@
// @flow // @flow
import React from 'react'; import React from 'react';
import { useSelector } from 'react-redux';
import { isParticipantModerator } from '../../../base/participants'; import { isParticipantModerator } from '../../../base/participants';
import ParticipantItem from '../../../participants-pane/components/native/ParticipantItem'; import ParticipantItem from '../../../participants-pane/components/native/ParticipantItem';
@ -11,15 +12,19 @@ type Props = {
* Participant to be displayed. * Participant to be displayed.
*/ */
item: Object item: Object
} };
const BreakoutRoomParticipantItem = ({ item }: Props) => ( const BreakoutRoomParticipantItem = ({ item }: Props) => {
<ParticipantItem const { defaultRemoteDisplayName } = useSelector(state => state['features/base/config']);
displayName = { item.displayName }
isKnockingParticipant = { false } return (
isModerator = { isParticipantModerator(item) } <ParticipantItem
key = { item.jid } displayName = { item.displayName || defaultRemoteDisplayName }
participantID = { item.jid } /> isKnockingParticipant = { false }
); isModerator = { isParticipantModerator(item) }
key = { item.jid }
participantID = { item.jid } />
);
};
export default BreakoutRoomParticipantItem; export default BreakoutRoomParticipantItem;

3
react/features/breakout-rooms/components/native/CollapsibleRoom.js
View File

@ -64,7 +64,8 @@ export const CollapsibleRoom = ({ room }: Props) => {
data = { Object.values(room.participants || {}) } data = { Object.values(room.participants || {}) }
horizontal = { false } horizontal = { false }
keyExtractor = { _keyExtractor } keyExtractor = { _keyExtractor }
renderItem = { BreakoutRoomParticipantItem } // eslint-disable-next-line react/jsx-no-bind
renderItem = { item => <BreakoutRoomParticipantItem item = { item } /> }
showsHorizontalScrollIndicator = { false } showsHorizontalScrollIndicator = { false }
windowSize = { 2 } />} windowSize = { 2 } />}
</View> </View>

4
react/features/breakout-rooms/components/web/CollapsibleRoom.js
View File

@ -4,6 +4,7 @@ import { makeStyles } from '@material-ui/styles';
import clsx from 'clsx'; import clsx from 'clsx';
import React, { useCallback, useState } from 'react'; import React, { useCallback, useState } from 'react';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import { useSelector } from 'react-redux';
import { ListItem } from '../../../base/components'; import { ListItem } from '../../../base/components';
import { Icon, IconArrowDown, IconArrowUp } from '../../../base/icons'; import { Icon, IconArrowDown, IconArrowUp } from '../../../base/icons';
@ -88,6 +89,7 @@ export const CollapsibleRoom = ({
const raiseMenu = useCallback(target => { const raiseMenu = useCallback(target => {
onRaiseMenu(target); onRaiseMenu(target);
}, [ onRaiseMenu ]); }, [ onRaiseMenu ]);
const { defaultRemoteDisplayName } = useSelector(state => state['features/base/config']);
const arrow = (<div className = { styles.arrowContainer }> const arrow = (<div className = { styles.arrowContainer }>
<Icon <Icon
@ -116,7 +118,7 @@ export const CollapsibleRoom = ({
{!collapsed && room?.participants {!collapsed && room?.participants
&& Object.values(room?.participants || {}).map((p: Object) => ( && Object.values(room?.participants || {}).map((p: Object) => (
<ParticipantItem <ParticipantItem
displayName = { p.displayName } displayName = { p.displayName || defaultRemoteDisplayName }
key = { p.jid } key = { p.jid }
local = { false } local = { false }
participantID = { p.jid } /> participantID = { p.jid } />