Update publish-alpha (#3267)

100mslive · Sep 13, 2024 · c63f8ca · c63f8ca
2 parents 1772ffc + 06d9ae9
commit c63f8ca
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 3 deletions.
diff --git a/packages/roomkit-react/src/Prebuilt/components/VirtualBackground/VBHandler.tsx b/packages/roomkit-react/src/Prebuilt/components/VirtualBackground/VBHandler.tsx
@@ -2,7 +2,7 @@
 // eslint-disable-next-line
 import { HMSVBPlugin, HMSVirtualBackgroundTypes } from '@100mslive/hms-virtual-background/hmsvbplugin';
 import { parsedUserAgent } from '@100mslive/react-sdk';
-import { isSafari } from '../../common/constants';
+import { isIOS, isSafari } from '../../common/constants';
 export class VBPlugin {
   private hmsPlugin?: HMSVBPlugin;
   private effectsPlugin?: any;
@@ -103,6 +103,18 @@ export class VBPlugin {
     this.hmsPlugin = undefined;
   };
 
+  isBlurSupported = () => {
+    if ((isSafari || isIOS) && this.hmsPlugin) {
+      return false;
+    }
+
+    if (this.effectsPlugin) {
+      return true;
+    }
+
+    return false;
+  };
+
   isEffectsSupported = () => {
     if (!isSafari) {
       return true;

diff --git a/packages/roomkit-react/src/Prebuilt/components/VirtualBackground/VBPicker.tsx b/packages/roomkit-react/src/Prebuilt/components/VirtualBackground/VBPicker.tsx
@@ -57,6 +57,7 @@ export const VBPicker = ({ backgroundMedia = [] }: { backgroundMedia: VirtualBac
   const background = useHMSStore(selectAppData(APP_DATA.background));
   const mediaList = backgroundMedia.map((media: VirtualBackgroundMedia) => media.url || '');
   const pluginLoadingRef = useRef(false);
+  const isBlurSupported = VBHandler?.isBlurSupported();
 
   const inPreview = roomState === HMSRoomState.Preview;
   // Hidden in preview as the effect will be visible in the preview tile
@@ -190,15 +191,15 @@ export const VBPicker = ({ backgroundMedia = [] }: { backgroundMedia: VirtualBac
                 await VBHandler?.setBlur(blurAmount);
                 hmsActions.setAppData(APP_DATA.background, HMSVirtualBackgroundTypes.BLUR);
               },
-              supported: isEffectsSupported && isEffectsEnabled,
+              supported: isBlurSupported,
             },
           ]}
           activeBackground={background}
         />
 
         {/* Slider */}
         <Flex direction="column" css={{ w: '100%', gap: '$8', mt: '$8' }}>
-          {background === HMSVirtualBackgroundTypes.BLUR && isEffectsEnabled && effectsKey ? (
+          {background === HMSVirtualBackgroundTypes.BLUR && isBlurSupported ? (
             <Box>
               <Text variant="sm" css={{ color: '$on_surface_high', fontWeight: '$semiBold', mb: '$4' }}>
                 Blur intensity