Merge pull request #19748 from Tainan404/refactor-voice-user

Refactor: move voice users to graphql

bigbluebutton-html5/client/main.tsx

@@ -10,6 +10,7 @@ import LoadingScreenHOC from '/imports/ui/components/common/loading-screen/loadi
 import IntlLoaderContainer from '/imports/startup/client/intlLoader';
 import LocatedErrorBoundary from '/imports/ui/components/common/error-boundary/located-error-boundary/component';
 import StartupDataFetch from '/imports/ui/components/connection-manager/startup-data-fetch/component';
+import VoiceUserGrapQlMiniMongoAdapter from '/imports/ui/components/components-data/voiceUserGraphQlMiniMongoAdapter/component';
 
 const Main: React.FC = () => {
   return (
@@ -22,6 +23,7 @@ const Main: React.FC = () => {
               <ConnectionManager>
                 <PresenceManager>
                   <SettingsLoader />
+                  <VoiceUserGrapQlMiniMongoAdapter />
                 </PresenceManager>
               </ConnectionManager>
             </LocatedErrorBoundary>

bigbluebutton-html5/imports/ui/components/audio/service.js

@@ -73,7 +73,7 @@ const init = (messages, intl, toggleVoice) => {
 
 const muteMicrophone = (toggleVoice) => {
   const user = VoiceUsers.findOne({
-    meetingId: Auth.meetingID, intId: Auth.userID,
+    userId: Auth.userID,
   }, { fields: { muted: 1 } });
 
   if (!user.muted) {
@@ -87,14 +87,14 @@ const muteMicrophone = (toggleVoice) => {
 };
 
 const isVoiceUser = () => {
-  const voiceUser = VoiceUsers.findOne({ intId: Auth.userID },
+  const voiceUser = VoiceUsers.findOne({ userId: Auth.userID },
     { fields: { joined: 1 } });
   return voiceUser ? voiceUser.joined : false;
 };
 
 const toggleMuteMicrophone = throttle((toggleVoice) => {
   const user = VoiceUsers.findOne({
-    meetingId: Auth.meetingID, intId: Auth.userID,
+    userId: Auth.userID,
   }, { fields: { muted: 1 } });
 
   Storage.setItem(MUTED_KEY, !user.muted);

bigbluebutton-html5/imports/ui/components/components-data/voiceUserGraphQlMiniMongoAdapter/component.tsx

@@ -0,0 +1,41 @@
+import { useSubscription } from '@apollo/client';
+import React, { useEffect, useState } from 'react';
+import VoiceUsers from '/imports/api/voice-users/';
+import logger from '/imports/startup/client/logger';
+import { UserVoiceStreamResponse, voiceUserStream } from './queries';
+
+const VoiceUserGrapQlMiniMongoAdapter: React.FC = () => {
+  const {
+    loading,
+    error,
+    data,
+  } = useSubscription<UserVoiceStreamResponse>(voiceUserStream);
+  const [voiceUserDataSetted, setVoiceUserDataSetted] = useState(false);
+
+  useEffect(() => {
+    if (error) {
+      logger.error('Error in VoiceUserGrapQlMiniMongoAdapter', error);
+    }
+  }, [error]);
+
+  useEffect(() => {
+    if (data && data.user_voice_mongodb_adapter_stream) {
+      const usersVoice = data.user_voice_mongodb_adapter_stream;
+
+      usersVoice.forEach((userVoice) => {
+        VoiceUsers.upsert({ userId: userVoice.userId }, userVoice);
+      });
+    }
+  }, [data]);
+
+  useEffect(() => {
+    if (loading) {
+      if (!voiceUserDataSetted) {
+        setVoiceUserDataSetted(true);
+      }
+    }
+  }, [loading]);
+  return null;
+};
+
+export default VoiceUserGrapQlMiniMongoAdapter;

bigbluebutton-html5/imports/ui/components/components-data/voiceUserGraphQlMiniMongoAdapter/queries.ts

@@ -0,0 +1,67 @@
+import { gql } from '@apollo/client';
+
+interface UserVoiceStream {
+  callerName: string | null;
+  callerNum: string | null;
+  callingWith: string | null;
+  endTime: string | null;
+  endedAt: string | null;
+  floor: string | null;
+  hideTalkingIndicatorAt: string | null;
+  joined: string | null;
+  lastFloorTime: string | null;
+  lastSpeakChangedAt: number;
+  listenOnly: string | null;
+  muted: string | null;
+  showTalkingIndicator: boolean;
+  spoke: string | null;
+  startTime: string | null;
+  startedAt: string | null;
+  talking: string | null;
+  userId: string;
+  voiceConf: string | null;
+  voiceConfCallSession: string | null;
+  voiceConfCallState: string | null;
+  voiceConfClientSession: string | null;
+  voiceUpdatedAt: string | null;
+  voiceUserId: string | null;
+}
+
+export interface UserVoiceStreamResponse {
+  user_voice_mongodb_adapter_stream: UserVoiceStream[];
+}
+
+export const voiceUserStream = gql`
+  subscription voiceUserStream {
+    user_voice_mongodb_adapter_stream(cursor: {initial_value: {voiceUpdatedAt: "2020-01-01"}}, batch_size: 100) {
+      callerName
+      callerNum
+      callingWith
+      endTime
+      endedAt
+      floor
+      hideTalkingIndicatorAt
+      joined
+      lastFloorTime
+      lastSpeakChangedAt
+      listenOnly
+      muted
+      showTalkingIndicator
+      spoke
+      startTime
+      startedAt
+      talking
+      userId
+      voiceConf
+      voiceConfCallSession
+      voiceConfCallState
+      voiceConfClientSession
+      voiceUpdatedAt
+      voiceUserId
+    }
+  }
+`;
+
+export default {
+  voiceUserStream,
+};

bigbluebutton-html5/imports/ui/components/subscriptions/component.jsx

@@ -16,7 +16,7 @@ const SUBSCRIPTIONS = [
   'meetings',
   'polls',
   'captions',
-  'voiceUsers',
+  // 'voiceUsers',
   'screenshare',
   'users-settings',
   'users-infos',

bigbluebutton-html5/imports/ui/components/user-list/service.js

@@ -386,8 +386,8 @@ const getUsersProp = () => {
   };
 };
 
-const curatedVoiceUser = (intId) => {
-  const voiceUser = VoiceUsers.findOne({ intId });
+const curatedVoiceUser = (userId) => {
+  const voiceUser = VoiceUsers.findOne({ userId });
   return {
     isVoiceUser: voiceUser ? voiceUser.joined : false,
     isMuted: voiceUser ? voiceUser.muted && !voiceUser.listenOnly : false,

bigbluebutton-html5/imports/ui/components/video-provider/video-list/video-list-item/container.jsx

@@ -45,7 +45,7 @@ export default withTracker((props) => {
 
   return {
     settingsSelfViewDisable: Settings.application.selfViewDisable,
-    voiceUser: VoiceUsers.findOne({ intId: userId },
+    voiceUser: VoiceUsers.findOne({ userId },
       {
         fields: {
           muted: 1, listenOnly: 1, talking: 1, joined: 1,

bigbluebutton-html5/imports/ui/services/audio-manager/index.js

@@ -539,7 +539,7 @@ class AudioManager {
 
     // listen to the VoiceUsers changes and update the flag
     if (!this.muteHandle) {
-      const query = VoiceUsers.find({ intId: Auth.userID }, { fields: { muted: 1, talking: 1 } });
+      const query = VoiceUsers.find({ userId: Auth.userID }, { fields: { muted: 1, talking: 1 } });
       this.muteHandle = query.observeChanges({
         added: (id, fields) => this.onVoiceUserChanges(fields),
         changed: (id, fields) => this.onVoiceUserChanges(fields),