diff --git a/src/componets/AudioVideo/AudioVideoFullScreenView/AudioVideoFullScreenView.js b/src/componets/AudioVideo/AudioVideoFullScreenView/AudioVideoFullScreenView.js index c0af20b505c7de9e3ce97add99feae11684d2d94..619b7c4669c571c732151b915b7d284f4089ef6e 100644 --- a/src/componets/AudioVideo/AudioVideoFullScreenView/AudioVideoFullScreenView.js +++ b/src/componets/AudioVideo/AudioVideoFullScreenView/AudioVideoFullScreenView.js @@ -51,15 +51,15 @@ class AudioVideoFullScreenView extends Component { componentDidUpdate(prevProps) { const { membersWithVideo } = this.props; const { feedData } = this.state; - const oldSpeekers = prevProps.callData.activeSpeakers ? prevProps.callData.activeSpeakers.join(', ') : ''; - const newSpeekers = this.props.callData.activeSpeakers ? this.props.callData.activeSpeakers.join(', ') : ''; + const oldSpeekers = JSON.stringify(prevProps.callData.activeSpeakers); + const newSpeekers = JSON.stringify(this.props.callData.activeSpeakers); const prevLen = prevProps.membersWithVideo.length; const newLen = membersWithVideo.length; const changed = []; membersWithVideo.forEach(m => { - const { phone_id, isAudioMuted } = m; - const memberInState = feedData.find(d => d.phone_id === phone_id); + const { participantId, isAudioMuted } = m; + const memberInState = feedData.find(d => d.participantId === participantId); if (memberInState && memberInState.isAudioMuted !== isAudioMuted) { changed.push(m); } @@ -68,7 +68,7 @@ class AudioVideoFullScreenView extends Component { if (changed.length > 0) { const result = feedData.map(item => ({ ...item, - ...changed.find(({ phone_id }) => phone_id === item.phone_id), + ...changed.find(({ participantId }) => participantId === item.participantId), })); this.setState({ feedData: result }); @@ -167,9 +167,9 @@ class AudioVideoFullScreenView extends Component { orderFeedsInit = () => { const { fullScreenData, membersWithVideo } = this.props; const { member } = fullScreenData; - const memberOnFullscreenId = member ? member.phone_id : ''; + const memberOnFullscreenId = member ? member.participantId : ''; - this.setState({ feedData: membersWithVideo.filter(m => m.phone_id !== memberOnFullscreenId) }); + this.setState({ feedData: membersWithVideo.filter(m => m.participantId !== memberOnFullscreenId) }); } reorderFeedsChangedActiveSpeakers = () => { @@ -178,15 +178,16 @@ class AudioVideoFullScreenView extends Component { const { member } = fullScreenData; const { activeSpeakers } = callData; const newSpeakers = activeSpeakers ? activeSpeakers : []; - const newTopSpeakerName = newSpeakers[newSpeakers.length - 1]; - const memberOnFullscreenName = member ? member.displayName : ''; + const newTopSpeakerObj = newSpeakers.length ? newSpeakers[newSpeakers.length - 1] : null; + const memberOnFullscreenPartId = member ? member.participantId : ''; - if (newTopSpeakerName) { + if (newTopSpeakerObj) { const currentTopSpeaker = feedData[0]; - if (currentTopSpeaker && currentTopSpeaker.displayName !== newTopSpeakerName && memberOnFullscreenName !== newTopSpeakerName) { - const newTopSpeaker = membersWithVideo.find(m => m.displayName === newTopSpeakerName); + if (currentTopSpeaker && currentTopSpeaker.participantId !== newTopSpeakerObj.participantId + && memberOnFullscreenPartId !== newTopSpeakerObj.participantId) { + const newTopSpeaker = membersWithVideo.find(m => m.participantId === newTopSpeakerObj.participantId); if (newTopSpeaker) { - const newFeedData = [newTopSpeaker, ...feedData.filter(d => d.displayName !== newTopSpeakerName)]; + const newFeedData = [newTopSpeaker, ...feedData.filter(d => d.participantId !== newTopSpeakerObj.participantId)]; this.throttleFunc(newFeedData); } } @@ -202,15 +203,15 @@ class AudioVideoFullScreenView extends Component { */ reorderFeedsChangedMembers = (oldList, newList, prevLen, newLen) => { const { member } = this.props; - const memberOnFullscreenId = member ? member.phone_id : ''; + const memberOnFullscreenId = member ? member.participantId : ''; if (newLen > prevLen) { this.setState({ feedData: [ ...differenceBy( - newList.filter(d => d.phone_id !== memberOnFullscreenId), + newList.filter(d => d.participantId !== memberOnFullscreenId), oldList, - 'phone_id', + 'participantId', ), ...oldList], }); @@ -302,7 +303,7 @@ class AudioVideoFullScreenView extends Component { } {feedData.map(data => { return ( -