Merge branch 'livekit' into new-call-layouts

src/config/ConfigOptions.ts

@@ -65,11 +65,21 @@ export interface ConfigOptions {
   };
 
   /**
-   * Allow to join a group calls without audio and video.
-   * TEMPORARY: Is a feature that's not proved and experimental
+   * TEMPORARY experimental features.
    */
   features?: {
-    feature_group_calls_without_video_and_audio: boolean;
+    /**
+     * Allow to join group calls without audio and video.
+     */
+    feature_group_calls_without_video_and_audio?: boolean;
+    /**
+     * Send device-specific call session membership state events instead of
+     * legacy user-specific call membership state events.
+     * This setting has no effect when the user joins an active call with
+     * legacy state events. For compatibility, Element Call will always join
+     * active legacy calls with legacy state events.
+     */
+    feature_use_device_session_member_events?: boolean;
   };
 
   /**

src/profile/useProfile.ts

@@ -118,7 +118,7 @@ export function useProfile(client: MatrixClient | undefined): UseProfile {
             displayName,
             avatarUrl: removeAvatar
               ? undefined
-              : mxcAvatarUrl ?? prev.avatarUrl,
+              : (mxcAvatarUrl ?? prev.avatarUrl),
             loading: false,
             success: true,
           }));

src/room/MuteStates.ts

@@ -53,7 +53,7 @@ function useMuteState(
 ): MuteState {
   const [enabled, setEnabled] = useReactiveState<boolean | undefined>(
     (prev) =>
-      device.available.length > 0 ? prev ?? enabledByDefault() : undefined,
+      device.available.length > 0 ? (prev ?? enabledByDefault()) : undefined,
     [device],
   );
   return useMemo(

src/room/useFullscreen.ts

@@ -63,7 +63,7 @@ export function useFullscreen(items: string[]): {
 } {
   const [fullscreenItem, setFullscreenItem] = useReactiveState<string | null>(
     (prevItem) =>
-      prevItem == null ? null : items.find((i) => i === prevItem) ?? null,
+      prevItem == null ? null : (items.find((i) => i === prevItem) ?? null),
     [items],
   );
 
@@ -77,7 +77,7 @@ export function useFullscreen(items: string[]): {
     (itemId: string) => {
       setFullscreenItem(
         latestFullscreenItem.current === null
-          ? latestItems.current.find((i) => i === itemId) ?? null
+          ? (latestItems.current.find((i) => i === itemId) ?? null)
           : null,
       );
     },

src/rtcSessionHelpers.ts

@@ -108,10 +108,17 @@ export async function enterRTCSession(
 
   // right now we assume everything is a room-scoped call
   const livekitAlias = rtcSession.room.roomId;
+  const useDeviceSessionMemberEvents =
+    Config.get().features?.feature_use_device_session_member_events;
   rtcSession.joinRoomSession(
     await makePreferredLivekitFoci(rtcSession, livekitAlias),
     makeActiveFocus(),
-    { manageMediaKeys: encryptMedia },
+    {
+      manageMediaKeys: encryptMedia,
+      ...(useDeviceSessionMemberEvents !== undefined && {
+        useLegacyMemberEvents: !useDeviceSessionMemberEvents,
+      }),
+    },
   );
 }
 

src/settings/ProfileSettingsTab.tsx

@@ -54,11 +54,11 @@ export const ProfileSettingsTab: FC<Props> = ({ client }) => {
         const avatar = data.get("avatar");
 
         const avatarSize =
-          typeof avatar == "string" ? avatar.length : avatar?.size ?? 0;
+          typeof avatar == "string" ? avatar.length : (avatar?.size ?? 0);
         const displayName =
           typeof displayNameDataEntry == "string"
             ? displayNameDataEntry
-            : displayNameDataEntry?.name ?? null;
+            : (displayNameDataEntry?.name ?? null);
 
         if (!displayName) {
           return;

src/widget.ts

@@ -118,13 +118,17 @@ export const widget = ((): WidgetHelpers | null => {
         "org.matrix.rageshake_request",
         EventType.CallEncryptionKeysPrefix,
       ];
+
       const sendState = [
-        {
-          eventType: EventType.GroupCallMemberPrefix,
-          stateKey: userId, // TODO: based on if we use the new format we want the key to be: `_${userId}_${deviceId}`
-        },
-      ];
+        userId, // legacy call membership events
+        `_${userId}_${deviceId}`, // session membership events
+        `${userId}_${deviceId}`, // MSC3779 session membership events
+      ].map((stateKey) => ({
+        eventType: EventType.GroupCallMemberPrefix,
+        stateKey,
+      }));
       const receiveState = [
+        { eventType: EventType.RoomCreate },
         { eventType: EventType.RoomMember },
         { eventType: EventType.RoomEncryption },
         { eventType: EventType.GroupCallMemberPrefix },