more proper fix

This comes with the issue, that if
 - the user opens the settings once
 before approving the device permisions
 - the device names will not be updated.
 - closing and opening the settings does NOT fix this...

Signed-off-by: Timo K <toger5@hotmail.de>
This commit is contained in:
Timo K
2023-09-18 14:11:57 +02:00
parent cf431b1675
commit 5fa98f0afa
2 changed files with 26 additions and 9 deletions

View File

@@ -33,6 +33,8 @@ import {
useVideoInput,
} from "../settings/useSetting";
import { logger } from "matrix-js-sdk/src/logger";
export interface MediaDevice {
available: MediaDeviceInfo[];
selectedId: string | undefined;
@@ -200,8 +202,20 @@ export const useMediaDevices = () => useContext(MediaDevicesContext);
* default because it may involve requesting additional permissions from the
* user.
*/
export const useMediaDeviceNames = (context: MediaDevices) =>
export const useMediaDeviceNames = (context: MediaDevices, isOpen: boolean) =>
useEffect(() => {
context.startUsingDeviceNames();
navigator.mediaDevices.enumerateDevices().then((devices) => {
const devicesHaveIds = devices.every((d) => d.deviceId.length > 0);
if (devicesHaveIds) {
// If all the devices have an id permissions we know that the permissions have been granted.
// We only start using the device names then. Otherwise additional tracks would be created.
// Those additional tracks result in audio/echo issue because multiple tracks are allowed in LK.
context.startUsingDeviceNames();
} else {
logger.warn(
"device names were requested but permissions are not yet granted."
);
}
});
return context.stopUsingDeviceNames;
}, [context]);
}, [context, isOpen]);

View File

@@ -44,7 +44,11 @@ import { AnalyticsNotice } from "../analytics/AnalyticsNotice";
import { ProfileSettingsTab } from "./ProfileSettingsTab";
import { FeedbackSettingsTab } from "./FeedbackSettingsTab";
import { useUrlParams } from "../UrlParams";
import { useMediaDevices, MediaDevice } from "../livekit/MediaDevicesContext";
import {
useMediaDevices,
MediaDevice,
useMediaDeviceNames,
} from "../livekit/MediaDevicesContext";
interface Props {
isOpen: boolean;
@@ -115,11 +119,10 @@ export const SettingsModal = (props: Props) => {
);
const devices = useMediaDevices();
// We skip useMediaDeviceNames, since it will create a track in the background
// and might be the source for echo cancellation issues on firefox.
// TODO this should be put behind a condition.
// we should only call useMediaDeviceNames if enumerateDevices fails.
// useMediaDeviceNames(devices);
// we pass isOpen so that the hook is calling enumerate devices whenever we open the settings.
// It would be desirable if this hook would get updated as soon as the permissions are granted
// Is there a state storing an approval of the device permissions triggered by the livekit room/lobby?
useMediaDeviceNames(devices, props.isOpen);
const audioTab = (
<TabItem