@100mslive/roomkit-react 0.3.19-alpha.11 → 0.3.19-alpha.13

package/package.json

@@ -10,7 +10,7 @@
     "prebuilt",
     "roomkit"
   ],
-  "version": "0.3.19-alpha.11",
+  "version": "0.3.19-alpha.13",
   "author": "100ms",
   "license": "MIT",
   "repository": {
@@ -75,12 +75,12 @@
     "react": ">=17.0.2 <19.0.0"
   },
   "dependencies": {
-    "@100mslive/hls-player": "0.3.19-alpha.11",
+    "@100mslive/hls-player": "0.3.19-alpha.13",
     "@100mslive/hms-noise-cancellation": "0.0.1",
-    "@100mslive/hms-virtual-background": "1.13.19-alpha.11",
-    "@100mslive/hms-whiteboard": "0.0.9-alpha.11",
-    "@100mslive/react-icons": "0.10.19-alpha.11",
-    "@100mslive/react-sdk": "0.10.19-alpha.11",
+    "@100mslive/hms-virtual-background": "1.13.19-alpha.13",
+    "@100mslive/hms-whiteboard": "0.0.9-alpha.13",
+    "@100mslive/react-icons": "0.10.19-alpha.13",
+    "@100mslive/react-sdk": "0.10.19-alpha.13",
     "@100mslive/types-prebuilt": "0.12.12",
     "@emoji-mart/data": "^1.0.6",
     "@emoji-mart/react": "^1.0.1",
@@ -117,5 +117,5 @@
     "uuid": "^8.3.2",
     "worker-timers": "^7.0.40"
   },
-  "gitHead": "6e9b1939c2268c0bd556fb3cc2f6905c79a48d8d"
+  "gitHead": "b1b838678870a5de5aec4c96716a3198564cab4c"
 }

package/src/Prebuilt/components/VirtualBackground/VBPicker.tsx

@@ -64,6 +64,17 @@ export const VBPicker = ({ backgroundMedia = [] }: { backgroundMedia: VirtualBac
   const showVideoTile = isVideoOn && isLargeRoom && !inPreview;
 
   useEffect(() => {
+    const addHMSVBPlugin = async () => {
+      setLoadingEffects(false);
+      if (!role) {
+        return;
+      }
+      await VBHandler.initialisePlugin();
+      await hmsActions.addPluginToVideoTrack(
+        VBHandler.getVBObject() as HMSVBPlugin,
+        Math.floor(role.publishParams.video.frameRate / 2),
+      );
+    };
     const initializeVirtualBackground = async () => {
       if (!track?.id || pluginLoadingRef.current || isPluginAdded) {
         return;
@@ -79,17 +90,14 @@ export const VBPicker = ({ backgroundMedia = [] }: { backgroundMedia: VirtualBac
           await VBHandler.initialisePlugin(effectsKey, () => {
             setLoadingEffects(false);
           });
-          hmsActions.addPluginsToVideoStream([VBHandler.getVBObject() as HMSMediaStreamPlugin]);
-        } else {
-          setLoadingEffects(false);
-          if (!role) {
-            return;
+          const vbInstance = VBHandler.getVBObject();
+          if (vbInstance.getName() === 'HMSEffects') {
+            hmsActions.addPluginsToVideoStream([VBHandler.getVBObject() as HMSMediaStreamPlugin]);
+          } else {
+            await addHMSVBPlugin();
           }
-          await VBHandler.initialisePlugin();
-          await hmsActions.addPluginToVideoTrack(
-            VBHandler.getVBObject() as HMSVBPlugin,
-            Math.floor(role.publishParams.video.frameRate / 2),
-          );
+        } else {
+          await addHMSVBPlugin();
         }
 
         const handleDefaultBackground = async () => {