fix: trasmitting audio and video stream

Author: freddysundowner

client/packages/lowcoder/src/comps/comps/meetingComp/videoMeetingControllerComp.tsx

@@ -308,15 +308,40 @@ let MTComp = (function () {
         [dispatch, isTopBom]
       );
       const [userIds, setUserIds] = useState<any>([]);
+      const [updateVolume, setUpdateVolume] = useState<any>({
+        update: false,
+        userid: null,
+      });
       const [rtmMessages, setRtmMessages] = useState<any>([]);
 
       useEffect(() => {
-        console.log(userIds);
         dispatch(
           changeChildAction("participants", getData(userIds).data, false)
         );
       }, [userIds]);
 
+      useEffect(() => {
+        if (updateVolume.userid) {
+          console.log("userIds ", props.participants);
+          let prevUsers: [] = props.participants as [];
+
+          const updatedItems = prevUsers.map((userInfo: any) => {
+            if (
+              userInfo.user === updateVolume.userid &&
+              userInfo.speaking != updateVolume.update
+            ) {
+              return { ...userInfo, speaking: updateVolume.update };
+            }
+            return userInfo;
+          });
+          console.log("updatedItems", updatedItems);
+
+          dispatch(
+            changeChildAction("participants", getData(updatedItems).data, false)
+          );
+        }
+      }, [updateVolume]);
+
       useEffect(() => {
         if (props.endCall.value) {
           let newUsers = userIds.filter((item: any) => item.user !== userId);
@@ -397,16 +422,16 @@ let MTComp = (function () {
             if (volumeInfos.length == 0) return;
             volumeInfos.map((volumeInfo: any) => {
               const speaking = volumeInfo.level >= 30;
-              if (volumeInfo.uid == userId) {
+              if (
+                volumeInfo.uid == userId &&
+                props.localUser.value.speaking != speaking
+              ) {
                 props.localUser.onChange({
                   ...props.localUser.value,
                   speaking,
                 });
               } else {
-                const userInfo = userIds.find(
-                  (info: any) => info.user === volumeInfo.uid
-                );
-                setUserIds([...userIds, { ...userInfo, speaking }]);
+                setUpdateVolume({ update: speaking, userid: volumeInfo.uid });
               }
             });
           });
@@ -582,6 +607,12 @@ MTComp = withMethodExposing(MTComp, [
       } else {
         await turnOnCamera(value);
       }
+      comp.children.localUser.change({
+        user: userId + "",
+        streamingVideo: value,
+        audiostatus: false,
+        speaking: false,
+      });
       comp.children.videoControl.change(value);
     },
   },

client/packages/lowcoder/src/comps/comps/meetingComp/videoMeetingStreamComp.tsx

@@ -187,18 +187,17 @@ let VideoCompBuilder = (function (props) {
     useEffect(() => {
       if (props.userId.value !== "") {
         let userData = JSON.parse(props.userId?.value);
-        if (
-          userData.user == userId &&
-          userData.streamingVideo == false &&
-          videoRef.current &&
-          videoRef.current?.id == userId + ""
-        ) {
-          videoRef.current.srcObject = null;
+        if (userData.user == userId && userData.streamingVideo == false && videoRef.current && videoRef.current?.id == userId + "") {
+          if (videoRef.current && videoRef.current?.id == userId + "") {
+            videoRef.current.srcObject = null;
+          }
         }
         client.on(
           "user-published",
           async (user: IAgoraRTCRemoteUser, mediaType: "video" | "audio") => {
             if (mediaType === "video") {
+              console.log("user-published",user.uid);
+              
               const remoteTrack = await client.subscribe(user, mediaType);
               let userId = user.uid + "";
               if (
@@ -242,7 +241,7 @@ let VideoCompBuilder = (function (props) {
               }
             }
             if (mediaType === "video") {
-              console.log("user-unpublished video");
+              console.log("user-unpublished video", user.uid);
               if (videoRef.current && videoRef.current?.id == user.uid + "") {
                 videoRef.current.srcObject = null;
               }