tmp: Debug show device id in display name if devtool

src/room/InCallView.tsx

@@ -96,6 +96,7 @@ import { ReactionsOverlay } from "./ReactionsOverlay";
 import { CallEventAudioRenderer } from "./CallEventAudioRenderer";
 import {
   debugTileLayout as debugTileLayoutSetting,
+  developerMode,
   useExperimentalToDeviceTransportSetting,
   useSetting,
 } from "../settings/settings";
@@ -134,6 +135,7 @@ export const ActiveCall: FC<ActiveCallProps> = (props) => {
     };
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
+  const [showDeveloperModeDebugOptions] = useSetting(developerMode);
 
   useEffect(() => {
     if (livekitRoom !== undefined) {
@@ -145,6 +147,7 @@ export const ActiveCall: FC<ActiveCallProps> = (props) => {
         connStateObservable$,
         reactionsReader.raisedHands$,
         reactionsReader.reactions$,
+        showDeveloperModeDebugOptions,
       );
       setVm(vm);
       return (): void => {
@@ -152,7 +155,13 @@ export const ActiveCall: FC<ActiveCallProps> = (props) => {
         reactionsReader.destroy();
       };
     }
-  }, [props.rtcSession, livekitRoom, props.e2eeSystem, connStateObservable$]);
+  }, [
+    props.rtcSession,
+    livekitRoom,
+    props.e2eeSystem,
+    connStateObservable$,
+    showDeveloperModeDebugOptions,
+  ]);
 
   if (livekitRoom === undefined || vm === null) return null;
 

src/state/CallViewModel.test.ts

@@ -268,6 +268,7 @@ function withCallViewModel(
     connectionState$,
     raisedHands$,
     new BehaviorSubject({}),
+    false,
   );
 
   onTestFinished(() => {

src/state/CallViewModel.ts

@@ -251,6 +251,7 @@ class UserMedia {
 
   public readonly speaker$: Observable<boolean>;
   public readonly presenter$: Observable<boolean>;
+
   public constructor(
     public readonly id: string,
     member: RoomMember | undefined,
@@ -487,7 +488,11 @@ export class CallViewModel extends ViewModel {
         const disambiguate = shouldDisambiguate(member, memberships, room);
         displaynameMap.set(
           matrixIdentifier,
-          calculateDisplayName(member, disambiguate),
+          this.showDeveloperModeDebugOptions
+            ? calculateDisplayName(member, disambiguate) +
+                " | " +
+                rtcMember.deviceId
+            : calculateDisplayName(member, disambiguate),
         );
       }
       return displaynameMap;
@@ -1344,6 +1349,7 @@ export class CallViewModel extends ViewModel {
     private readonly reactionsSubject$: Observable<
       Record<string, ReactionInfo>
     >,
+    private readonly showDeveloperModeDebugOptions: boolean,
   ) {
     super();
   }

src/utils/test-viewmodel.ts

@@ -138,6 +138,7 @@ export function getBasicCallViewModelEnvironment(
     of(ConnectionState.Connected),
     handRaisedSubject$,
     reactionsSubject$,
+    false,
   );
   return {
     vm,