legba-core0.1.0
⌘K
Référence API/@legba-core/ui/LegbaModerationPanel

LegbaModerationPanel

expérimentaldepuis 0.1.0@legba-core/ui
Aperçu en direct — vrai composant, pas une image

LegbaModerationPanel

Ce que ça fait

Panneau de modération (<legba-moderation-panel for="id" endpoint="...">) qui liste les participants d’une salle et permet à l’hôte de couper/réactiver le micro ou la caméra d’un participant précis, ou de toute la salle d’un coup (utile pour économiser la bande passante, LGB-059). Réutilise la connexion RTC d’un <legba-call> référencé par id uniquement pour lister les participants et déterminer si l’utilisateur local est hôte — l’action elle-même passe toujours par endpoint (requête POST en JSON), jamais un appel LiveKit direct depuis le navigateur : couper un micro ou une caméra à distance exige la clé API LiveKit, qui ne doit jamais atteindre le client (même raison que token-endpoint sur <legba-call>).

Signature

class LegbaModerationPanel extends LegbaElement {
  for: string;
  endpoint: string;
}

Tag : legba-moderation-panel.

Paramètres

PropriétéAttributTypeRequisDéfautDescription
forforstringoui""id de l’élément <legba-call> référencé
endpointendpointstringoui""URL HTTP qui applique réellement l’action (voir ci-dessous)

Contrat de endpoint

Une requête POST avec un corps JSON :

{
  action: "mute-microphone" | "mute-camera" | "mute-all-microphones" | "mute-all-cameras";
  roomName: string;
  requesterIdentity: string; // identité de l'appelant — l'endpoint DOIT relire son vrai rôle côté serveur, jamais faire confiance à un rôle transmis par le client.
  muted: boolean;
  targetIdentity?: string; // absent pour une action "-all-".
}

Réponse attendue : { ok: true } ou { ok: false, error: string }.

Retour

N/A — un élément DOM. Aucun événement propre émis.

Erreurs

Aucune exception côté composant : un for invalide produit un console.error explicite ; un échec de fetch ou une réponse { ok: false } affiche le message d’erreur dans le panneau (role="alert"), jamais une exception qui casse le rendu.

Exemple minimal

<legba-call id="salle-1" room="salle-demo" token-endpoint="/api/token"></legba-call>
<legba-call-button for="salle-1"></legba-call-button>
<legba-moderation-panel for="salle-1" endpoint="/moderate"></legba-moderation-panel>

Exemple complet

import type { LegbaModerationPanel } from "@legba-core/ui";

// endpoint pointe vers une route de l'application consommatrice, qui
// relit le VRAI rôle du participant demandeur (via ParticipantService,
// jamais en faisant confiance au requesterIdentity transmis) avant
// d'appeler muteParticipantMicrophone/muteParticipantCamera/
// muteAllMicrophones/disableAllCameras de @legba-core/realtime.
function mountPanel(): void {
  const panel = document.querySelector<LegbaModerationPanel>("#moderation")!;
  panel.for = "salle-1";
  panel.endpoint = "/api/moderate";
}

Pièges

  • Rien ne s’affiche pour un non-hôte : le panneau se réduit à un message « réservé à l’hôte » — jamais les contrôles eux-mêmes, même désactivés. Le VRAI contrôle d’accès reste cependant côté serveur (endpoint), pas ce masquage côté client.
  • endpoint ne doit jamais faire confiance à requesterIdentity seul : cette identité doit servir à relire le rôle réel du participant côté serveur (ParticipantService.getParticipant), jamais être acceptée telle quelle comme preuve d’autorisation.
  • Les actions groupées (-all-) sont best-effort : un participant sans la piste concernée est silencieusement ignoré, jamais une erreur qui interromprait l’opération pour tous les autres (voir ParticipantService.muteAllMicrophones/disableAllCameras, @legba-core/realtime).
  • L’état micro/caméra affiché est optimiste, pas relu depuis le serveur : le panneau bascule son propre libellé dès le clic, sans attendre de confirmation serveur — cohérent avec l’écho local de <legba-chat>.
  • Consomme les jetons --legba-* comme tout composant @legba-core/ui : ne redéclare jamais un jeton public directement, voir LegbaElement.

Voir aussi