Release - 0.12.32

examples/prebuilt-react-integration/vite.config.js

@@ -23,5 +23,5 @@ export default defineConfig({
   plugins: [react(), mediapipe_workaround()],
   define: {
     'process.env': {},
-  },
+  }
 });

packages/hms-video-store/src/device-manager/DeviceManager.ts

@@ -47,16 +47,16 @@ export class DeviceManager implements HMSDeviceManager {
   constructor(private store: Store, private eventBus: EventBus) {
     const isLocalTrackEnabled = ({ enabled, track }: { enabled: boolean; track: HMSLocalTrack }) =>
       enabled && track.source === 'regular';
-    this.eventBus.localVideoEnabled.waitFor(isLocalTrackEnabled).then(async () => {
-      await this.enumerateDevices();
-      if (this.videoInputChanged) {
-        this.eventBus.deviceChange.publish({ devices: this.getDevices() } as HMSDeviceChangeEvent);
+    this.eventBus.localVideoEnabled.waitFor(isLocalTrackEnabled).then(() => {
+      // Do this only if length is 0 i.e. when permissions are denied
+      if (this.videoInput.length === 0) {
+        this.init(true);
       }
     });
-    this.eventBus.localAudioEnabled.waitFor(isLocalTrackEnabled).then(async () => {
-      await this.enumerateDevices();
-      if (this.audioInputChanged) {
-        this.eventBus.deviceChange.publish({ devices: this.getDevices() } as HMSDeviceChangeEvent);
+    this.eventBus.localAudioEnabled.waitFor(isLocalTrackEnabled).then(() => {
+      // Do this only if length is 0 i.e. when permissions are denied
+      if (this.audioInput.length === 0) {
+        this.init(true);
       }
     });
 
@@ -108,6 +108,7 @@ export class DeviceManager implements HMSDeviceManager {
       await this.updateToActualDefaultDevice();
       this.startPollingForDevices();
     }
+    await this.autoSelectAudioOutput();
     this.logDevices('Init');
     await this.setOutputDevice();
     this.eventBus.deviceChange.publish({
@@ -464,9 +465,10 @@ export class DeviceManager implements HMSDeviceManager {
     return { bluetoothDevice, speakerPhone, wired, earpiece };
   }
 
-  private startPollingForDevices = () => {
+  private startPollingForDevices = async () => {
+    const { earpiece } = this.categorizeAudioInputDevices();
     // device change supported, no polling needed
-    if ('ondevicechange' in navigator.mediaDevices) {
+    if (!earpiece) {
       return;
     }
     this.timer = setTimeout(() => {
@@ -483,10 +485,6 @@ export class DeviceManager implements HMSDeviceManager {
    */
   // eslint-disable-next-line complexity
   public autoSelectAudioOutput = async () => {
-    // do this only after join so the earpiece would be selected at the right time
-    if ('ondevicechange' in navigator.mediaDevices || !this.store.getLocalPeer()?.joinedAt) {
-      return;
-    }
     const { bluetoothDevice, earpiece, speakerPhone, wired } = this.categorizeAudioInputDevices();
     const localAudioTrack = this.store.getLocalPeer()?.audioTrack;
     if (!localAudioTrack || !earpiece) {
@@ -495,7 +493,6 @@ export class DeviceManager implements HMSDeviceManager {
     const manualSelection = this.getManuallySelectedAudioDevice();
     const externalDeviceID =
       manualSelection?.deviceId || bluetoothDevice?.deviceId || wired?.deviceId || speakerPhone?.deviceId;
-    HMSLogger.d(this.TAG, 'externalDeviceID', externalDeviceID);
     // already selected appropriate device
     if (localAudioTrack.settings.deviceId === externalDeviceID && this.earpieceSelected) {
       return;
@@ -507,6 +504,7 @@ export class DeviceManager implements HMSDeviceManager {
           this.earpieceSelected = true;
           return;
         }
+
         await localAudioTrack.setSettings({ deviceId: earpiece?.deviceId }, true);
         this.earpieceSelected = true;
       }
@@ -516,6 +514,17 @@ export class DeviceManager implements HMSDeviceManager {
         },
         true,
       );
+      const groupId = this.audioInput.find(input => input.deviceId === externalDeviceID)?.groupId;
+      this.eventBus.deviceChange.publish({
+        isUserSelection: false,
+        type: 'audioInput',
+        selection: {
+          deviceId: externalDeviceID,
+          groupId: groupId,
+        },
+        devices: this.getDevices(),
+        internal: true,
+      });
     } catch (error) {
       this.eventBus.error.publish(error as HMSException);
     }

packages/hms-video-store/src/diagnostics/ConnectivityCheck.ts

@@ -53,6 +53,7 @@ export class ConnectivityCheck implements HMSDiagnosticsConnectivityListener {
     private sdkListener: HMSUpdateListener,
     private progressCallback: (state: ConnectivityState) => void,
     private completionCallback: (state: ConnectivityCheckResult) => void,
+    private connectivityDuration = CONNECTIVITY_TEST_DURATION,
   ) {
     this.statsCollector = new DiagnosticsStatsCollector(sdk);
     this.state = ConnectivityState.STARTING;
@@ -140,7 +141,7 @@ export class ConnectivityCheck implements HMSDiagnosticsConnectivityListener {
     this.sdk.getWebrtcInternals()?.start();
     this.cleanupTimer = window.setTimeout(() => {
       this.cleanupAndReport();
-    }, CONNECTIVITY_TEST_DURATION);
+    }, this.connectivityDuration);
   }
 
   onError(error: HMSException): void {

packages/hms-video-store/src/diagnostics/HMSDiagnostics.ts

@@ -162,12 +162,13 @@ export class Diagnostics implements HMSDiagnosticsInterface {
     progress: (state: ConnectivityState) => void,
     completed: (result: ConnectivityCheckResult) => void,
     region?: string,
+    duration?: number,
   ) {
     if (!this.sdk) {
       throw new Error('SDK not found');
     }
 
-    this.connectivityCheck = new ConnectivityCheck(this.sdk, this.sdkListener, progress, completed);
+    this.connectivityCheck = new ConnectivityCheck(this.sdk, this.sdkListener, progress, completed, duration);
 
     const authToken = await this.getAuthToken(region);
     await this.sdk.leave();

packages/hms-video-store/src/diagnostics/interfaces.ts

@@ -44,6 +44,10 @@ export interface HMSDiagnosticsInterface {
     progress: (state: ConnectivityState) => void,
     completed: (result: ConnectivityCheckResult) => void,
     region?: string,
+    /**
+     * Number in milliseconds to stop the connectivity check
+     */
+    duration?: number,
   ): Promise<void>;
   stopConnectivityCheck(): Promise<void>;
 }

packages/hms-video-store/src/interfaces/devices.ts

@@ -5,6 +5,7 @@ export interface HMSDeviceChangeEvent {
   error?: HMSException;
   devices?: DeviceMap;
   selection?: Partial<MediaDeviceInfo>;
+  internal?: boolean;
   type: 'audioOutput' | 'audioInput' | 'video';
 }
 

packages/hms-video-store/src/reactive-store/HMSSDKActions.ts

@@ -917,7 +917,7 @@ export class HMSSDKActions<T extends HMSGenericTypes = { sessionStore: Record<st
       }
     }, 'deviceChange');
     // send notification only on device change - selection is present
-    if (event.selection) {
+    if (event.selection && !event.internal) {
       const notification = SDKToHMS.convertDeviceChangeUpdate(event);
       this.hmsNotifications.sendDeviceChange(notification);
     }

packages/hms-video-store/src/sdk/index.ts

@@ -679,7 +679,6 @@ export class HMSSdk implements HMSInterface {
       await this.notifyJoin();
       this.sdkState.isJoinInProgress = false;
       await this.publish(config.settings, previewRole);
-      await this.deviceManager.autoSelectAudioOutput();
     } catch (error) {
       this.analyticsTimer.end(TimedEvent.JOIN);
       this.sdkState.isJoinInProgress = false;
@@ -1360,6 +1359,7 @@ export class HMSSdk implements HMSInterface {
 
   private async getAndPublishTracks(initialSettings?: InitialSettings) {
     const tracks = await this.localTrackManager.getTracksToPublish(initialSettings);
+    await this.initDeviceManagers();
     await this.setAndPublishTracks(tracks);
     this.localPeer?.audioTrack?.initAudioLevelMonitor();
     this.sdkState.published = true;
@@ -1388,17 +1388,17 @@ export class HMSSdk implements HMSInterface {
         );
         this.listener?.onError(error);
       }
-      this.setLocalPeerTrack(track);
+      await this.setLocalPeerTrack(track);
       this.listener?.onTrackUpdate(HMSTrackUpdate.TRACK_ADDED, track, this.localPeer!);
     }
-    await this.initDeviceManagers();
   }
 
-  private setLocalPeerTrack(track: HMSLocalTrack) {
+  private async setLocalPeerTrack(track: HMSLocalTrack) {
     track.peerId = this.localPeer?.peerId;
     switch (track.type) {
       case HMSTrackType.AUDIO:
         this.localPeer!.audioTrack = track as HMSLocalAudioTrack;
+        await this.deviceManager.autoSelectAudioOutput();
         break;
 
       case HMSTrackType.VIDEO:

packages/roomkit-react/src/Prebuilt/components/Settings/DeviceSettings.jsx

@@ -1,17 +1,14 @@
-import React, { Fragment, useEffect, useRef, useState } from 'react';
-import { useMedia } from 'react-use';
+import React, { Fragment, useRef, useState } from 'react';
 import {
   DeviceType,
   selectIsLocalVideoEnabled,
   selectLocalVideoTrackID,
   selectVideoTrackByID,
   useDevices,
-  useHMSActions,
   useHMSStore,
 } from '@100mslive/react-sdk';
 import { MicOnIcon, SpeakerIcon, VideoOnIcon } from '@100mslive/react-icons';
 import { Box, Button, Dropdown, Flex, StyledVideoTile, Text, Video } from '../../../';
-import { config as cssConfig } from '../../../Theme';
 import { DialogDropdownTrigger } from '../../primitives/DropdownTrigger';
 import { useUISettings } from '../AppData/useUISettings';
 import { useAudioOutputTest } from '../hooks/useAudioOutputTest';
@@ -34,15 +31,7 @@ const Settings = ({ setHide }) => {
   const shouldShowAudioOutput = 'setSinkId' in HTMLMediaElement.prototype;
   const mirrorLocalVideo = useUISettings(UI_SETTINGS.mirrorLocalVideo);
   const trackSelector = selectVideoTrackByID(videoTrackId);
-  const hmsActions = useHMSActions();
   const track = useHMSStore(trackSelector);
-  const isMobile = useMedia(cssConfig.media.md);
-
-  useEffect(() => {
-    if (isMobile) {
-      hmsActions.refreshDevices();
-    }
-  }, [hmsActions, isMobile]);
 
   /**
    * Chromium browsers return an audioOutput with empty label when no permissions are given