Fix missing tile bug

The 'connecting' tile change meant that we could have tiles right
at the start of the call where we wouldn't have before, and in fact
could have tiles for other users before we even had a tile for ourself.
This threw off the logic for ordering tiles which had a special case
for 1:1 calling which assumed that one of the tiles in a 1:1 call was
the local user. In this case, this assumption wasn't true at the very
start of the call, so the tile orders got assigned incorrectly and then
persisted for the rest of the call.

Fixes https://github.com/vector-im/element-call/issues/694

src/room/useGroupCall.ts

@@ -51,7 +51,7 @@ export interface UseGroupCallReturnType {
   requestingScreenshare: boolean;
   isScreensharing: boolean;
   screenshareFeeds: CallFeed[];
-  localDesktopCapturerSourceId: string;
+  localDesktopCapturerSourceId: string; // XXX: This looks unused?
   participants: RoomMember[];
   hasLocalParticipant: boolean;
   unencryptedEventsFromUsers: Set<string>;

src/video-grid/VideoGrid.tsx

@@ -654,9 +654,16 @@ function getSubGridPositions(
 // Sets the 'order' property on tiles based on the layout param and
 // other properties of the tiles, eg. 'focused' and 'presenter'
 function reorderTiles(tiles: Tile[], layout: Layout) {
+  // We use a special layout for 1:1 to always put the local tile first.
+  // We only do this if there are two tiles (obviously) and exactly one
+  // of them is local: during startup we can have tiles from other users
+  // but not our own, due to the order they're added, so without this we
+  // can assign multiple remote tiles order '1' and this persists through
+  // subsequent reorders because we preserve the order of the tiles.
   if (
     layout === "freedom" &&
     tiles.length === 2 &&
+    tiles.filter((t) => t.item.isLocal).length === 1 &&
     !tiles.some((t) => t.presenter || t.focused)
   ) {
     // 1:1 layout