bigbluebutton-Github/bigbluebutton-html5/imports/ui/components/video-provider/container.jsx
Ramón Souza 7514066fc3
fix: Client can't load in certain cases (#20336)
* move settings

* remove meteor cache files
2024-05-29 09:26:11 -04:00

131 lines
3.7 KiB
JavaScript
Executable File

import React from 'react';
import { withTracker } from 'meteor/react-meteor-data';
import { useMutation, useSubscription } from '@apollo/client';
import VideoProvider from './component';
import VideoService from './service';
import { sortVideoStreams } from '/imports/ui/components/video-provider/stream-sorting';
import { CAMERA_BROADCAST_START, CAMERA_BROADCAST_STOP } from './mutations';
import { getVideoData, getVideoDataGrid } from './queries';
import useMeeting from '/imports/ui/core/hooks/useMeeting';
import Auth from '/imports/ui/services/auth';
import useCurrentUser from '../../core/hooks/useCurrentUser';
import VideoProviderContainerGraphql from './video-provider-graphql/container';
const VideoProviderContainer = ({ children, ...props }) => {
const { streams, isGridEnabled } = props;
const [cameraBroadcastStart] = useMutation(CAMERA_BROADCAST_START);
const [cameraBroadcastStop] = useMutation(CAMERA_BROADCAST_STOP);
const sendUserShareWebcam = (cameraId) => {
cameraBroadcastStart({ variables: { cameraId } });
};
const sendUserUnshareWebcam = (cameraId) => {
cameraBroadcastStop({ variables: { cameraId } });
};
const playStart = (cameraId) => {
if (VideoService.isLocalStream(cameraId)) {
sendUserShareWebcam(cameraId);
VideoService.joinedVideo();
}
};
return (
!streams.length && !isGridEnabled
? null
: (
<VideoProvider
{...props}
playStart={playStart}
sendUserUnshareWebcam={sendUserUnshareWebcam}
>
{children}
</VideoProvider>
)
);
};
withTracker(({ swapLayout, ...rest }) => {
const isGridLayout = Session.get('isGridEnabled');
const graphqlQuery = isGridLayout ? getVideoDataGrid : getVideoData;
const currUserId = Auth.userID;
const { data: currentMeeting } = useMeeting((m) => ({
usersPolicies: m.usersPolicies,
}));
const { data: currentUser } = useCurrentUser((user) => ({
locked: user.locked,
}));
const fetchedStreams = VideoService.fetchVideoStreams();
const variables = isGridLayout
? {}
: {
userIds: fetchedStreams.map((stream) => stream.userId) || [],
};
const {
data: videoUserSubscription,
} = useSubscription(graphqlQuery, { variables });
const users = videoUserSubscription?.user || [];
let streams = [];
let gridUsers = [];
let totalNumberOfStreams = 0;
if (isGridLayout) {
streams = fetchedStreams;
gridUsers = VideoService.getGridUsers(videoUserSubscription?.user, fetchedStreams);
totalNumberOfStreams = fetchedStreams.length;
} else {
const {
streams: s,
totalNumberOfStreams: ts,
} = VideoService.getVideoStreams();
streams = s;
totalNumberOfStreams = ts;
}
let usersVideo = streams;
const {
defaultSorting: DEFAULT_SORTING,
} = window.meetingClientSettings.public.kurento.cameraSortingModes;
if (gridUsers.length > 0) {
const items = usersVideo.concat(gridUsers);
usersVideo = sortVideoStreams(items, DEFAULT_SORTING);
}
if (currentMeeting?.usersPolicies?.webcamsOnlyForModerator
&& currentUser?.locked) {
if (users.length > 0) {
usersVideo = usersVideo.filter((uv) => {
if (uv.userId === currUserId) {
return true;
}
const user = users.find((u) => u.userId === uv.userId);
return user?.isModerator;
});
}
}
return {
swapLayout,
streams: usersVideo,
totalNumberOfStreams,
isUserLocked: VideoService.isUserLocked(),
currentVideoPageIndex: VideoService.getCurrentVideoPageIndex(),
isMeteorConnected: Meteor.status().connected,
users,
...rest,
};
})(VideoProviderContainer);
export default VideoProviderContainerGraphql;