From 7c6182cc4e92ff7495c63dacb930e8c74ea207cb Mon Sep 17 00:00:00 2001 From: lebaudantoine Date: Mon, 11 Aug 2025 16:01:55 +0200 Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B(frontend)=20fix=20default=20device?= =?UTF-8?q?=20ID=20mismatch=20with=20actual=20preview=20track?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Update default device IDs when preview track starts to match the actual device being used. LiveKit returns 'default' string which may not exist in device list, causing ID mismatch. Prevents misleading situation where default device ID doesn't correspond to the device actually used by the preview track. Now synchronizes IDs once preview starts for accurate device tracking. --- .../src/features/rooms/components/Join.tsx | 6 ++++++ .../livekit/hooks/useResolveDefaultDevice.ts | 18 ++++++++++++++++++ 2 files changed, 24 insertions(+) create mode 100644 src/frontend/src/features/rooms/livekit/hooks/useResolveDefaultDevice.ts diff --git a/src/frontend/src/features/rooms/components/Join.tsx b/src/frontend/src/features/rooms/components/Join.tsx index 6bc5e111..b97d3e0e 100644 --- a/src/frontend/src/features/rooms/components/Join.tsx +++ b/src/frontend/src/features/rooms/components/Join.tsx @@ -30,6 +30,7 @@ import { useSnapshot } from 'valtio' import { openPermissionsDialog, permissionsStore } from '@/stores/permissions' import { ToggleDevice } from './join/ToggleDevice' import { SelectDevice } from './join/SelectDevice' +import { useResolveDefaultDeviceId } from '../livekit/hooks/useResolveDefaultDevice' const onError = (e: Error) => console.error('ERROR', e) @@ -140,6 +141,11 @@ export const Join = ({ [tracks] ) + // LiveKit by default populates device choices with "default" value. + // Instead, use the current device id used by the preview track as a default + useResolveDefaultDeviceId(audioDeviceId, audioTrack, saveAudioInputDeviceId) + useResolveDefaultDeviceId(videoDeviceId, videoTrack, saveVideoInputDeviceId) + const videoEl = useRef(null) const isVideoInitiated = useRef(false) diff --git a/src/frontend/src/features/rooms/livekit/hooks/useResolveDefaultDevice.ts b/src/frontend/src/features/rooms/livekit/hooks/useResolveDefaultDevice.ts new file mode 100644 index 00000000..673b65fc --- /dev/null +++ b/src/frontend/src/features/rooms/livekit/hooks/useResolveDefaultDevice.ts @@ -0,0 +1,18 @@ +import { useEffect } from 'react' + +export const useResolveDefaultDeviceId = < + T extends { getDeviceId(): Promise }, +>( + currentId: string, + track: T | undefined, + save: (id: string) => void +) => { + useEffect(() => { + if (currentId !== 'default' || !track) return + const resolveDefaultDeviceId = async () => { + const actualDeviceId = await track.getDeviceId() + if (actualDeviceId && actualDeviceId !== 'default') save(actualDeviceId) + } + resolveDefaultDeviceId() + }, [currentId, track, save]) +}