diff --git a/examples/prebuilt-react-integration/package.json b/examples/prebuilt-react-integration/package.json index 6eb2489186..551387c1d6 100644 --- a/examples/prebuilt-react-integration/package.json +++ b/examples/prebuilt-react-integration/package.json @@ -10,7 +10,7 @@ "preview": "vite preview" }, "dependencies": { - "@100mslive/roomkit-react": "0.3.31", + "@100mslive/roomkit-react": "0.3.32", "react": "^18.2.0", "react-dom": "^18.2.0" }, diff --git a/examples/prebuilt-react-integration/vite.config.js b/examples/prebuilt-react-integration/vite.config.js index 09395b4901..245d4cd4c3 100644 --- a/examples/prebuilt-react-integration/vite.config.js +++ b/examples/prebuilt-react-integration/vite.config.js @@ -23,5 +23,5 @@ export default defineConfig({ plugins: [react(), mediapipe_workaround()], define: { 'process.env': {}, - }, + } }); diff --git a/packages/hls-player/package.json b/packages/hls-player/package.json index 4b4dfe51f0..aed6dd0888 100644 --- a/packages/hls-player/package.json +++ b/packages/hls-player/package.json @@ -1,6 +1,6 @@ { "name": "@100mslive/hls-player", - "version": "0.3.31", + "version": "0.3.32", "description": "HLS client library which uses HTML5 Video element and Media Source Extension for playback", "main": "dist/index.cjs.js", "module": "dist/index.js", @@ -36,7 +36,7 @@ "author": "100ms", "license": "MIT", "dependencies": { - "@100mslive/hls-stats": "0.4.31", + "@100mslive/hls-stats": "0.4.32", "eventemitter2": "^6.4.9", "hls.js": "1.4.12" }, diff --git a/packages/hls-stats/package.json b/packages/hls-stats/package.json index f7df205e39..87ca2aaf20 100644 --- a/packages/hls-stats/package.json +++ b/packages/hls-stats/package.json @@ -1,6 +1,6 @@ { "name": "@100mslive/hls-stats", - "version": "0.4.31", + "version": "0.4.32", "description": "A simple library that provides stats for your hls stream", "main": "dist/index.cjs.js", "module": "dist/index.js", diff --git a/packages/hms-video-store/package.json b/packages/hms-video-store/package.json index cb237e7dc5..d95a0642e8 100644 --- a/packages/hms-video-store/package.json +++ b/packages/hms-video-store/package.json @@ -1,5 +1,5 @@ { - "version": "0.12.31", + "version": "0.12.32", "license": "MIT", "repository": { "type": "git", diff --git a/packages/hms-video-store/src/device-manager/DeviceManager.ts b/packages/hms-video-store/src/device-manager/DeviceManager.ts index 7f6021e858..db52b01917 100644 --- a/packages/hms-video-store/src/device-manager/DeviceManager.ts +++ b/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); } diff --git a/packages/hms-video-store/src/diagnostics/ConnectivityCheck.ts b/packages/hms-video-store/src/diagnostics/ConnectivityCheck.ts index ca5a2353bd..5cb8f043be 100644 --- a/packages/hms-video-store/src/diagnostics/ConnectivityCheck.ts +++ b/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 { diff --git a/packages/hms-video-store/src/diagnostics/HMSDiagnostics.ts b/packages/hms-video-store/src/diagnostics/HMSDiagnostics.ts index 3af667bd98..aabce9cc78 100644 --- a/packages/hms-video-store/src/diagnostics/HMSDiagnostics.ts +++ b/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(); diff --git a/packages/hms-video-store/src/diagnostics/interfaces.ts b/packages/hms-video-store/src/diagnostics/interfaces.ts index 8be0202847..3fd8453462 100644 --- a/packages/hms-video-store/src/diagnostics/interfaces.ts +++ b/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; stopConnectivityCheck(): Promise; } diff --git a/packages/hms-video-store/src/interfaces/devices.ts b/packages/hms-video-store/src/interfaces/devices.ts index 44b0defac4..b3e09539ae 100644 --- a/packages/hms-video-store/src/interfaces/devices.ts +++ b/packages/hms-video-store/src/interfaces/devices.ts @@ -5,6 +5,7 @@ export interface HMSDeviceChangeEvent { error?: HMSException; devices?: DeviceMap; selection?: Partial; + internal?: boolean; type: 'audioOutput' | 'audioInput' | 'video'; } diff --git a/packages/hms-video-store/src/reactive-store/HMSSDKActions.ts b/packages/hms-video-store/src/reactive-store/HMSSDKActions.ts index 2d82826750..b1ed3a60de 100644 --- a/packages/hms-video-store/src/reactive-store/HMSSDKActions.ts +++ b/packages/hms-video-store/src/reactive-store/HMSSDKActions.ts @@ -917,7 +917,7 @@ export class HMSSDKActions=16.8 <19.0.0" }, "dependencies": { - "@100mslive/hms-video-store": "0.12.31", + "@100mslive/hms-video-store": "0.12.32", "react-resize-detector": "^7.0.0", "zustand": "^3.6.2" } diff --git a/packages/roomkit-react/package.json b/packages/roomkit-react/package.json index 54397c464e..8050953b5c 100644 --- a/packages/roomkit-react/package.json +++ b/packages/roomkit-react/package.json @@ -10,7 +10,7 @@ "prebuilt", "roomkit" ], - "version": "0.3.31", + "version": "0.3.32", "author": "100ms", "license": "MIT", "repository": { @@ -75,12 +75,12 @@ "react": ">=17.0.2 <19.0.0" }, "dependencies": { - "@100mslive/hls-player": "0.3.31", + "@100mslive/hls-player": "0.3.32", "@100mslive/hms-noise-cancellation": "0.0.1", - "@100mslive/hms-virtual-background": "1.13.31", - "@100mslive/hms-whiteboard": "0.0.21", - "@100mslive/react-icons": "0.10.31", - "@100mslive/react-sdk": "0.10.31", + "@100mslive/hms-virtual-background": "1.13.32", + "@100mslive/hms-whiteboard": "0.0.22", + "@100mslive/react-icons": "0.10.32", + "@100mslive/react-sdk": "0.10.32", "@100mslive/types-prebuilt": "0.12.12", "@emoji-mart/data": "^1.0.6", "@emoji-mart/react": "^1.0.1", diff --git a/packages/roomkit-react/src/Prebuilt/components/Settings/DeviceSettings.jsx b/packages/roomkit-react/src/Prebuilt/components/Settings/DeviceSettings.jsx index d3182b1d40..679a43609a 100644 --- a/packages/roomkit-react/src/Prebuilt/components/Settings/DeviceSettings.jsx +++ b/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 diff --git a/packages/roomkit-web/package.json b/packages/roomkit-web/package.json index a1c46dc7ff..29607e2acf 100644 --- a/packages/roomkit-web/package.json +++ b/packages/roomkit-web/package.json @@ -1,6 +1,6 @@ { "name": "@100mslive/roomkit-web", - "version": "0.2.31", + "version": "0.2.32", "description": "A web component implementation of 100ms Prebuilt component", "keywords": [ "web-components", @@ -33,7 +33,7 @@ "build": "rm -rf dist && node ../../scripts/build-webapp" }, "dependencies": { - "@100mslive/roomkit-react": "0.3.31", + "@100mslive/roomkit-react": "0.3.32", "@r2wc/react-to-web-component": "2.0.2" } }