import './UserList.css'; /** * Liste des participants connectés (utilisateurs + canaux virtuels) */ export default function UserList({ participants, onToggleMute }) { if (participants.length === 0) { return (

Aucun participant ou canal

); } // Séparer canaux virtuels et utilisateurs const virtualChannels = participants.filter(p => p.isVirtual); const users = participants.filter(p => !p.isVirtual); return (
{virtualChannels.length > 0 && `${virtualChannels.length} canal${virtualChannels.length > 1 ? 'aux' : ''}`} {virtualChannels.length > 0 && users.length > 0 && ' • '} {users.length > 0 && `${users.length} utilisateur${users.length > 1 ? 's' : ''}`}
{/* Canaux virtuels en premier */} {virtualChannels.map((participant) => (
{participant.name} Canal audio
))} {/* Utilisateurs WebRTC */} {users.map((participant) => (
{participant.name.charAt(0).toUpperCase()}
{participant.name} {participant.isSpeaking && ( En train de parler )}
{participant.isSpeaking ? (
) : (
{participant.hasAudio ? ( ) : ( )}
)}
))}
); }