mirror of
https://gitcode.com/GitHub_Trending/ji/jitsi-meet.git
synced 2026-05-23 07:27:53 +00:00
40a485ec6c
* fix(participant-pane) Use the sorted participant list from redux instead of sorting it on every render making it better performant. Match the participant order with that of the order in the filmstrip. Also move the participants with raised hand to the top of the list. * ref(filmstrip) Move enableThumbnailReordering flag to testing section. * fix(participants) Add new selectors for getting sorted participants.
73 lines
2.4 KiB
JavaScript
73 lines
2.4 KiB
JavaScript
// @flow
|
|
|
|
import VideoLayout from '../../../modules/UI/videolayout/VideoLayout';
|
|
import { PARTICIPANT_JOINED, PARTICIPANT_LEFT } from '../base/participants';
|
|
import { MiddlewareRegistry } from '../base/redux';
|
|
import { CLIENT_RESIZED } from '../base/responsive-ui';
|
|
import { SETTINGS_UPDATED } from '../base/settings';
|
|
import {
|
|
getCurrentLayout,
|
|
LAYOUTS
|
|
} from '../video-layout';
|
|
|
|
import {
|
|
setHorizontalViewDimensions,
|
|
setTileViewDimensions,
|
|
setVerticalViewDimensions
|
|
} from './actions';
|
|
import { updateRemoteParticipants, updateRemoteParticipantsOnLeave } from './functions';
|
|
import './subscriber';
|
|
|
|
/**
|
|
* The middleware of the feature Filmstrip.
|
|
*/
|
|
MiddlewareRegistry.register(store => next => action => {
|
|
if (action.type === PARTICIPANT_LEFT) {
|
|
// This has to be executed before we remove the participant from features/base/participants state in order to
|
|
// remove the related thumbnail component before we need to re-render it. If we do this after next()
|
|
// we will be in sitation where the participant exists in the remoteParticipants array in features/filmstrip
|
|
// but doesn't exist in features/base/participants state which will lead to rendering a thumbnail for
|
|
// non-existing participant.
|
|
updateRemoteParticipantsOnLeave(store, action.participant?.id);
|
|
}
|
|
|
|
const result = next(action);
|
|
|
|
switch (action.type) {
|
|
case CLIENT_RESIZED: {
|
|
const state = store.getState();
|
|
const layout = getCurrentLayout(state);
|
|
|
|
switch (layout) {
|
|
case LAYOUTS.TILE_VIEW: {
|
|
const { gridDimensions } = state['features/filmstrip'].tileViewDimensions;
|
|
|
|
store.dispatch(setTileViewDimensions(gridDimensions));
|
|
break;
|
|
}
|
|
case LAYOUTS.HORIZONTAL_FILMSTRIP_VIEW:
|
|
store.dispatch(setHorizontalViewDimensions());
|
|
break;
|
|
|
|
case LAYOUTS.VERTICAL_FILMSTRIP_VIEW:
|
|
store.dispatch(setVerticalViewDimensions());
|
|
break;
|
|
}
|
|
break;
|
|
}
|
|
case PARTICIPANT_JOINED: {
|
|
updateRemoteParticipants(store, action.participant?.id);
|
|
break;
|
|
}
|
|
case SETTINGS_UPDATED: {
|
|
if (typeof action.settings?.localFlipX === 'boolean') {
|
|
// TODO: This needs to be removed once the large video is Reactified.
|
|
VideoLayout.onLocalFlipXChanged();
|
|
}
|
|
break;
|
|
}
|
|
}
|
|
|
|
return result;
|
|
});
|