diff --git a/src/App.jsx b/src/App.jsx index 00816c3..af30720 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -241,6 +241,17 @@ export default function App() { sdp: answer.sdp }); + // Update host connection status to show answer was received + setHostConnections(prev => { + const updated = { ...prev }; + for (const key in updated) { + if (updated[key].offerId === answer.offerId) { + updated[key] = { ...updated[key], status: 'answered' }; + } + } + return updated; + }); + // Update last answer timestamp setLastAnswerTimestamp(prev => Math.max(prev, answer.answeredAt)); @@ -437,6 +448,33 @@ export default function App() { offerMapping[offer.offerId] = conn.pc; hostConnMap[`host-${idx}`] = { pc: conn.pc, dc: conn.dc, offerId: offer.offerId, status: 'waiting' }; + // Track connection state changes + conn.pc.onconnectionstatechange = () => { + console.log(`[Host] Connection state for offer ${offer.offerId}:`, conn.pc.connectionState); + + if (conn.pc.connectionState === 'connecting') { + setHostConnections(prev => { + const updated = { ...prev }; + for (const key in updated) { + if (updated[key].offerId === offer.offerId) { + updated[key] = { ...updated[key], status: 'connecting' }; + } + } + return updated; + }); + } else if (conn.pc.connectionState === 'connected') { + setHostConnections(prev => { + const updated = { ...prev }; + for (const key in updated) { + if (updated[key].offerId === offer.offerId) { + updated[key] = { ...updated[key], status: 'connected' }; + } + } + return updated; + }); + } + }; + // Send buffered ICE candidates if (conn.candidateBuffer && conn.candidateBuffer.length > 0) { console.log(`[Host] Sending ${conn.candidateBuffer.length} buffered ICE candidates for offer ${offer.offerId}`); @@ -989,6 +1027,40 @@ export default function App() { + {/* Connection Pool Status */} + {myServicePublished && Object.keys(hostConnections).length > 0 && ( +