Fix auth flow for livekit

client/src/main.ts

@@ -1498,10 +1498,10 @@ function disconnect(): void {
 /** Connects to the LiveKit room and ensures peers exist for roster members. */
 async function connectLiveKit(url: string, token: string): Promise<void> {
   try {
-    await peerManager.connectToRoom(url, token);
     for (const peer of state.peers.values()) {
       peerManager.ensurePeer(peer.id, peer);
     }
+    await peerManager.connectToRoom(url, token);
   } catch (error) {
     console.error('LiveKit connect failed:', error);
     updateStatus('LiveKit connection failed.');

client/src/network/messageHandlers.ts

@@ -162,19 +162,20 @@ export function createOnMessageHandler(deps: MessageHandlerDeps): (message: Inco
           deps.state.player.y = message.y;
           break;
         }
-        const peer = deps.state.peers.get(message.id);
-        const prevX = peer?.x ?? message.x;
-        const prevY = peer?.y ?? message.y;
-        if (peer) {
-          peer.x = message.x;
-          peer.y = message.y;
+        let peer = deps.state.peers.get(message.id);
+        if (!peer) {
+          peer = { id: message.id, nickname: 'user...', x: message.x, y: message.y };
+          deps.state.peers.set(message.id, peer);
+          deps.peerManager.ensurePeer(message.id, peer);
         }
+        const prevX = peer.x;
+        const prevY = peer.y;
+        peer.x = message.x;
+        peer.y = message.y;
         deps.peerManager.setPeerPosition(message.id, message.x, message.y);
-        if (peer) {
-          const movementDelta = Math.hypot(message.x - prevX, message.y - prevY);
-          if (movementDelta <= 1.5 && deps.getAudioLayers().world) {
-            deps.playRemoteSpatialStepOrTeleport(deps.randomFootstepUrl(), peer.x, peer.y);
-          }
+        const movementDelta = Math.hypot(message.x - prevX, message.y - prevY);
+        if (movementDelta <= 1.5 && deps.getAudioLayers().world) {
+          deps.playRemoteSpatialStepOrTeleport(deps.randomFootstepUrl(), peer.x, peer.y);
         }
         break;
       }

client/src/webrtc/peerManager.ts

@@ -24,6 +24,7 @@ export class PeerManager {
   private outputDeviceId = '';
   private room: Room | null = null;
   private localTrack: LocalAudioTrack | null = null;
+  private pendingOutboundStream: MediaStream | null = null;
 
   constructor(
     private readonly audio: AudioEngine,
@@ -100,6 +101,11 @@ export class PeerManager {
 
     await room.connect(url, token);
     this.room = room;
+    if (this.pendingOutboundStream) {
+      const pending = this.pendingOutboundStream;
+      this.pendingOutboundStream = null;
+      await this.replaceOutgoingTrack(pending);
+    }
   }
 
   /** Ensure a peer entry exists for a given user (called when roster arrives). */
@@ -124,7 +130,11 @@ export class PeerManager {
     const newTrack = stream.getAudioTracks()[0];
     if (!newTrack) return;
 
-    if (!this.room) return;
+    if (!this.room) {
+      this.pendingOutboundStream = stream;
+      return;
+    }
+    this.pendingOutboundStream = null;
 
     if (this.localTrack) {
       // Replace the underlying MediaStreamTrack on the existing LiveKit track.
@@ -159,6 +169,7 @@ export class PeerManager {
       this.room = null;
     }
     this.localTrack = null;
+    this.pendingOutboundStream = null;
   }
 
   setPeerPosition(id: string, x: number, y: number): void {
@@ -215,8 +226,13 @@ export class PeerManager {
     if (!mediaStreamTrack) return;
 
     const stream = new MediaStream([mediaStreamTrack]);
-    const peer = this.peers.get(participant.identity);
-    if (!peer) return;
+    let peer = this.peers.get(participant.identity);
+    if (!peer) {
+      peer = this.ensurePeer(participant.identity, {
+        id: participant.identity,
+        nickname: participant.name ?? 'user...',
+      });
+    }
 
     peer.remoteStream = stream;
     if (this.audio.isVoiceLayerEnabled()) {