Compare commits
4 Commits
v0.0.24
...
3847476798
| Author | SHA1 | Date | |
|---|---|---|---|
| 3847476798 | |||
| a895782250 | |||
| fa8270c156 | |||
| a9e24f6692 |
@@ -122,7 +122,7 @@ SMTP_TIMEOUT_S=30
|
|||||||
# --- Версия инстанса (релиз v0.0.1) ---
|
# --- Версия инстанса (релиз v0.0.1) ---
|
||||||
# install.sh копирует значение из корневого файла VERSION при каждой
|
# install.sh копирует значение из корневого файла VERSION при каждой
|
||||||
# установке/обновлении — руками менять не нужно.
|
# установке/обновлении — руками менять не нужно.
|
||||||
VIDCONF_VERSION=0.0.24
|
VIDCONF_VERSION=0.0.25
|
||||||
|
|
||||||
# --- Профили compose. Дефолт ниже (`media,monitoring`) — только для ручного
|
# --- Профили compose. Дефолт ниже (`media,monitoring`) — только для ручного
|
||||||
# `docker compose up` БЕЗ install.sh: медиа (LiveKit+coturn) + мониторинг,
|
# `docker compose up` БЕЗ install.sh: медиа (LiveKit+coturn) + мониторинг,
|
||||||
|
|||||||
36
CHANGELOG.md
36
CHANGELOG.md
@@ -3,6 +3,42 @@
|
|||||||
Формат основан на [Keep a Changelog](https://keepachangelog.com/ru/1.1.0/),
|
Формат основан на [Keep a Changelog](https://keepachangelog.com/ru/1.1.0/),
|
||||||
проект придерживается [семантического версионирования](https://semver.org/lang/ru/).
|
проект придерживается [семантического версионирования](https://semver.org/lang/ru/).
|
||||||
|
|
||||||
|
## [0.0.25] — 2026-08-03
|
||||||
|
|
||||||
|
Два дефекта мини-окна конференции (Document PiP), оба видны только в Chrome.
|
||||||
|
|
||||||
|
### Исправлено
|
||||||
|
- В Chrome пропадал звук других участников после возврата сцены из
|
||||||
|
мини-окна в основное. `RoomAudioRenderer` жил внутри `RoomStage` и
|
||||||
|
рендерился в обеих её ветках, поэтому скрытые `<audio>` с чужими
|
||||||
|
аудиотреками физически переезжали в документ PiP-окна и обратно.
|
||||||
|
После такого переезда Chrome теряет аудиовыход у remote-трека: пакеты
|
||||||
|
продолжают приходить (`packetsReceived` растёт), а
|
||||||
|
`totalSamplesDuration` и `totalAudioEnergy` замирают, и трек молчит
|
||||||
|
даже в свежесозданном `<audio>` со свежим `MediaStream`. Тот же цикл
|
||||||
|
detach/attach в пределах одного документа безвреден — дело именно в
|
||||||
|
переезде между документами. Рендерер вынесен в `RoomPage`: один
|
||||||
|
экземпляр, всегда в основном документе, в PiP-окне аудиоэлементов нет
|
||||||
|
вовсе. В Safari бага не было — там Document PiP не используется
|
||||||
|
(video-фолбэк), сцена из основного окна не уезжает.
|
||||||
|
- В мини-окне не действовало закрепление участника, а демонстрация
|
||||||
|
экрана слетала на говорящего от любой чужой реплики. Мини-плеер
|
||||||
|
намеренно ходил с упрощёнными правилами выбора фокуса (без
|
||||||
|
`holdScreenShare`, без приоритета говорящего с камерой, без
|
||||||
|
антидребезга) и с собственным локальным состоянием закрепления.
|
||||||
|
Теперь `pickStageFocus` получает одинаковые правила в обоих вариантах
|
||||||
|
сцены, а закрепление переезжает между окнами тем же мостиком через
|
||||||
|
`RoomPage`, что и фокус. Сознательно оставлено одно отличие —
|
||||||
|
фолбэк «показать себя» (`localKey`) только у мини-плеера: это защита
|
||||||
|
от дефекта 0.0.11, когда мини-окно открывалось на самом пользователе.
|
||||||
|
- Закрепление сбрасывалось при каждом монтировании сцены: на первом
|
||||||
|
рендере `useTracks` отдаёт пустой набор треков, и правило «закреплённый
|
||||||
|
вышел из комнаты» принимало это за уход участника.
|
||||||
|
|
||||||
|
### Изменено
|
||||||
|
- Кнопка-булавка на плитке подписана «Закрепить» вместо «Закрепить в
|
||||||
|
основном окне» — закрепление больше не ограничено основным окном.
|
||||||
|
|
||||||
## [0.0.24] — 2026-08-03
|
## [0.0.24] — 2026-08-03
|
||||||
|
|
||||||
Три артефакта вёрстки, вылезающие за границы блоков (эмодзи-поповер чата,
|
Три артефакта вёрстки, вылезающие за границы блоков (эмодзи-поповер чата,
|
||||||
|
|||||||
@@ -89,7 +89,7 @@ services:
|
|||||||
MEDIA_ROOT: ${MEDIA_ROOT:-/app/media}
|
MEDIA_ROOT: ${MEDIA_ROOT:-/app/media}
|
||||||
# Версия инстанса (релиз v0.0.1) — install.sh копирует значение
|
# Версия инстанса (релиз v0.0.1) — install.sh копирует значение
|
||||||
# из файла VERSION (корень репозитория) в .env; отдаётся в GET /api/health.
|
# из файла VERSION (корень репозитория) в .env; отдаётся в GET /api/health.
|
||||||
VIDCONF_VERSION: ${VIDCONF_VERSION:-0.0.24}
|
VIDCONF_VERSION: ${VIDCONF_VERSION:-0.0.25}
|
||||||
# Число процессов uvicorn (см. backend/Dockerfile). Дефолт 2 рассчитан
|
# Число процессов uvicorn (см. backend/Dockerfile). Дефолт 2 рассчитан
|
||||||
# на 4-ядерный сервер, где ядра делятся с LiveKit. Поднимая значение,
|
# на 4-ядерный сервер, где ядра делятся с LiveKit. Поднимая значение,
|
||||||
# проверьте бюджет соединений с БД: каждый воркер держит свой пул
|
# проверьте бюджет соединений с БД: каждый воркер держит свой пул
|
||||||
|
|||||||
@@ -9,16 +9,32 @@
|
|||||||
# запускайте ПЕРЕД `docker compose up` (и после каждого изменения .env,
|
# запускайте ПЕРЕД `docker compose up` (и после каждого изменения .env,
|
||||||
# влияющего на эти конфиги) — из корня репозитория:
|
# влияющего на эти конфиги) — из корня репозитория:
|
||||||
# ./deploy/render-templates.sh
|
# ./deploy/render-templates.sh
|
||||||
|
#
|
||||||
|
# Источник значений можно подменить переменной ENV_FILE:
|
||||||
|
# ENV_FILE=.env.local ./deploy/render-templates.sh
|
||||||
|
# Это нужно для локальных стендов: корневой `.env` рабочего чекаута обычно
|
||||||
|
# держит боевые значения (LIVEKIT_NODE_IP/TURN_EXTERNAL_IP смотрят на прод), и
|
||||||
|
# рендерить конфиги из него для локального запуска нельзя. Без этой переменной
|
||||||
|
# путь был жёстко зашит, и локальные сессии повторяли логику скрипта вручную
|
||||||
|
# через envsubst — расхождение с реальным рендером ждало своего часа.
|
||||||
|
# По умолчанию — как раньше, `<корень репозитория>/.env`, поэтому install.sh
|
||||||
|
# и сервер ничего не замечают (свою переменную ENV_FILE install.sh не
|
||||||
|
# экспортирует, так что она сюда не протекает).
|
||||||
set -euo pipefail
|
set -euo pipefail
|
||||||
|
|
||||||
SCRIPT_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
|
SCRIPT_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
|
||||||
ENV_FILE="$SCRIPT_DIR/../.env"
|
# Относительный путь разрешаем от текущей директории вызова (`ENV_FILE=.env.local`
|
||||||
|
# из корня репозитория), абсолютный — как есть.
|
||||||
|
ENV_FILE="${ENV_FILE:-$SCRIPT_DIR/../.env}"
|
||||||
|
|
||||||
if [ ! -f "$ENV_FILE" ]; then
|
if [ ! -f "$ENV_FILE" ]; then
|
||||||
echo "render-templates.sh: не найден $ENV_FILE — сначала запустите ./install.sh или скопируйте .env.example в .env" >&2
|
echo "render-templates.sh: не найден $ENV_FILE — сначала запустите ./install.sh или скопируйте .env.example в .env" >&2
|
||||||
|
echo "render-templates.sh: другой файл значений можно задать так: ENV_FILE=.env.local $0" >&2
|
||||||
exit 1
|
exit 1
|
||||||
fi
|
fi
|
||||||
|
|
||||||
|
echo "[render] источник значений: $ENV_FILE"
|
||||||
|
|
||||||
# Читаем только нужные ключи через grep/cut (НЕ `source .env`) — .env содержит
|
# Читаем только нужные ключи через grep/cut (НЕ `source .env`) — .env содержит
|
||||||
# значения вроде `SMTP_FROM=VidConf <no-reply@vidconf.example>`, где `<` —
|
# значения вроде `SMTP_FROM=VidConf <no-reply@vidconf.example>`, где `<` —
|
||||||
# валидный литерал для docker-compose/pydantic, но невалидный bash-синтаксис
|
# валидный литерал для docker-compose/pydantic, но невалидный bash-синтаксис
|
||||||
|
|||||||
@@ -191,6 +191,14 @@ chmod 600 .env # секреты внутри — только root может
|
|||||||
собирает образы, поднимает `postgres`/`redis`, применяет миграции Alembic +
|
собирает образы, поднимает `postgres`/`redis`, применяет миграции Alembic +
|
||||||
seed, поднимает остальной стек (`up -d --wait`).
|
seed, поднимает остальной стек (`up -d --wait`).
|
||||||
|
|
||||||
|
По умолчанию `render-templates.sh` читает корневой `.env`. Другой файл
|
||||||
|
значений задаётся переменной окружения — это нужно, когда рядом с рабочим
|
||||||
|
`.env` (боевые адреса) поднимается локальный стенд:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
ENV_FILE=.env.local ./deploy/render-templates.sh
|
||||||
|
```
|
||||||
|
|
||||||
**Не запускайте `docker compose` вручную без `--env-file .env`** — без него
|
**Не запускайте `docker compose` вручную без `--env-file .env`** — без него
|
||||||
compose не подхватывает корневой `.env` (файл на уровень выше
|
compose не подхватывает корневой `.env` (файл на уровень выше
|
||||||
`deploy/docker-compose.yml`) и подставляет небезопасные дефолты из самого
|
`deploy/docker-compose.yml`) и подставляет небезопасные дефолты из самого
|
||||||
|
|||||||
@@ -126,8 +126,10 @@ function TileBody({
|
|||||||
const showSharingChip = Boolean(
|
const showSharingChip = Boolean(
|
||||||
onStopSharing && trackReference.source === Track.Source.ScreenShare && trackReference.participant.isLocal,
|
onStopSharing && trackReference.source === Track.Source.ScreenShare && trackReference.participant.isLocal,
|
||||||
)
|
)
|
||||||
// Кнопка закрепления — только там, где сцена умеет закрепление (основное
|
// Кнопка закрепления — только там, где сцена её даёт (основное окно передаёт
|
||||||
// окно передаёт `onTogglePin`; в мини-плеере плитка одна, закреплять нечего).
|
// `onTogglePin`; в мини-плеере своего тулбара нет и плитка одна, поэтому
|
||||||
|
// булавки там нет — само закрепление, сделанное в основном окне, с 0.0.25
|
||||||
|
// действует и в мини-плеере, см. `initialPinnedKey` в `RoomStage`).
|
||||||
// Ключ плитки берём из её собственного трека: в карусели/гриде плитки
|
// Ключ плитки берём из её собственного трека: в карусели/гриде плитки
|
||||||
// рендерятся шаблоном без пропсов, снаружи «какая это плитка» не передать.
|
// рендерятся шаблоном без пропсов, снаружи «какая это плитка» не передать.
|
||||||
const tileKey = stageTrackKey(trackReference)
|
const tileKey = stageTrackKey(trackReference)
|
||||||
@@ -200,10 +202,8 @@ function TileBody({
|
|||||||
type="button"
|
type="button"
|
||||||
className={`room-pin-toggle${isPinned ? ' is-pinned' : ''}`}
|
className={`room-pin-toggle${isPinned ? ' is-pinned' : ''}`}
|
||||||
aria-pressed={isPinned}
|
aria-pressed={isPinned}
|
||||||
title={isPinned ? 'Открепить' : 'Закрепить в основном окне'}
|
title={isPinned ? 'Открепить' : 'Закрепить'}
|
||||||
aria-label={
|
aria-label={isPinned ? `Открепить: ${displayName}` : `Закрепить: ${displayName}`}
|
||||||
isPinned ? `Открепить: ${displayName}` : `Закрепить в основном окне: ${displayName}`
|
|
||||||
}
|
|
||||||
onClick={(e) => {
|
onClick={(e) => {
|
||||||
// Иначе клик долетит до самой плитки (`onParticipantClick`
|
// Иначе клик долетит до самой плитки (`onParticipantClick`
|
||||||
// у `ParticipantTile`) — булавка не должна означать «клик по плитке».
|
// у `ParticipantTile`) — булавка не должна означать «клик по плитке».
|
||||||
|
|||||||
@@ -4,7 +4,6 @@ import { Track, type Participant } from 'livekit-client'
|
|||||||
import {
|
import {
|
||||||
CarouselLayout,
|
CarouselLayout,
|
||||||
FocusLayoutContainer,
|
FocusLayoutContainer,
|
||||||
RoomAudioRenderer,
|
|
||||||
isTrackReference,
|
isTrackReference,
|
||||||
useRoomContext,
|
useRoomContext,
|
||||||
useSpeakingParticipants,
|
useSpeakingParticipants,
|
||||||
@@ -44,9 +43,11 @@ const STAGE_TRACK_SOURCES = [
|
|||||||
]
|
]
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Удержание фокуса основного окна при смене говорящего, мс.
|
* Удержание фокуса при смене говорящего, мс. Действует в ОБОИХ вариантах
|
||||||
|
* сцены — и в основном окне, и в мини-плеере (до 0.0.25 в PiP удержания не
|
||||||
|
* было вовсе, фокус там переключался мгновенно).
|
||||||
*
|
*
|
||||||
* Основное окно следует за спикером (`followSpeaker`, задача 3.2), и без
|
* Сцена следует за спикером (`followSpeaker`, задача 3.2), и без
|
||||||
* удержания короткие реплики («ага», «угу») уводили бы большую плитку на
|
* удержания короткие реплики («ага», «угу») уводили бы большую плитку на
|
||||||
* секунду и возвращали обратно. Источник говорящих (`useSpeakingParticipants`
|
* секунду и возвращали обратно. Источник говорящих (`useSpeakingParticipants`
|
||||||
* поверх `RoomEvent.ActiveSpeakersChanged`) сам по себе не дребезжит, но
|
* поверх `RoomEvent.ActiveSpeakersChanged`) сам по себе не дребезжит, но
|
||||||
@@ -59,6 +60,10 @@ const STAGE_TRACK_SOURCES = [
|
|||||||
* фокус с задержкой, которая на глаз читается как плавность, а не как тормоз.
|
* фокус с задержкой, которая на глаз читается как плавность, а не как тормоз.
|
||||||
* Меньше (~0.6 с) — короткие «ага» всё ещё пролезают, больше (~2 с) — заметно
|
* Меньше (~0.6 с) — короткие «ага» всё ещё пролезают, больше (~2 с) — заметно
|
||||||
* запаздывает переход на нового докладчика.
|
* запаздывает переход на нового докладчика.
|
||||||
|
*
|
||||||
|
* В мини-плеере удержание тем более уместно: там плитка ОДНА, и мгновенное
|
||||||
|
* переключение читается не как «камера следует за разговором», а как мигание
|
||||||
|
* всего окна целиком.
|
||||||
*/
|
*/
|
||||||
const SPEAKER_HOLD_MS = 1200
|
const SPEAKER_HOLD_MS = 1200
|
||||||
|
|
||||||
@@ -69,8 +74,9 @@ const SPEAKER_HOLD_MS = 1200
|
|||||||
* применять уже нечего (cleanup эффекта гасит таймер, а новое значение
|
* применять уже нечего (cleanup эффекта гасит таймер, а новое значение
|
||||||
* сравнивается по ссылке с текущим).
|
* сравнивается по ссылке с текущим).
|
||||||
*
|
*
|
||||||
* `holdMs <= 0` — удержания нет, значение отдаётся как есть (режим PiP: там
|
* `holdMs <= 0` — удержания нет, значение отдаётся как есть. Сейчас этим
|
||||||
* фокус обязан следовать за говорящим мгновенно, поведение не менялось).
|
* режимом никто не пользуется (обе сцены удерживают состав), но параметр
|
||||||
|
* оставлен: он и делает функцию пригодной для повторного использования.
|
||||||
*/
|
*/
|
||||||
function useSteadySpeakers(speakers: Participant[], holdMs: number): Participant[] {
|
function useSteadySpeakers(speakers: Participant[], holdMs: number): Participant[] {
|
||||||
const [steady, setSteady] = useState(speakers)
|
const [steady, setSteady] = useState(speakers)
|
||||||
@@ -148,9 +154,9 @@ function PipMicToggle() {
|
|||||||
* `tiles` скрывать нечего (карусели нет), переключатель там заблокирован —
|
* `tiles` скрывать нечего (карусели нет), переключатель там заблокирован —
|
||||||
* см. `StageViewOptions`.
|
* см. `StageViewOptions`.
|
||||||
*
|
*
|
||||||
* ФОКУС ПЕРЕЖИВАЕТ ПЕРЕЕЗД В МИНИ-ПЛЕЕР. Сцена в мини-плеере — ОТДЕЛЬНЫЙ
|
* ФОКУС И ЗАКРЕПЛЕНИЕ ПЕРЕЖИВАЮТ ПЕРЕЕЗД В МИНИ-ПЛЕЕР. Сцена в мини-плеере —
|
||||||
* экземпляр этого компонента (портал в PiP-окно), и своё состояние фокуса он
|
* ОТДЕЛЬНЫЙ экземпляр этого компонента (портал в PiP-окно), и своё состояние
|
||||||
* начинал с нуля: демонстрации нет, никто прямо сейчас не говорит — и
|
* фокуса он начинал с нуля: демонстрации нет, никто прямо сейчас не говорит — и
|
||||||
* `pickStageFocus` доходил до последнего фолбэка `localKey`, то есть мини-окно
|
* `pickStageFocus` доходил до последнего фолбэка `localKey`, то есть мини-окно
|
||||||
* открывалось на самом пользователе вместо того, что он видел крупно. В Safari
|
* открывалось на самом пользователе вместо того, что он видел крупно. В Safari
|
||||||
* бага не было видно: там Document PiP не используется, а video-фолбэк
|
* бага не было видно: там Document PiP не используется, а video-фолбэк
|
||||||
@@ -159,6 +165,13 @@ function PipMicToggle() {
|
|||||||
* `RoomPage` → `initialFocusKey` следующего экземпляра. Работает в обе стороны
|
* `RoomPage` → `initialFocusKey` следующего экземпляра. Работает в обе стороны
|
||||||
* — возврат из мини-плеера тоже не сбрасывает фокус.
|
* — возврат из мини-плеера тоже не сбрасывает фокус.
|
||||||
*
|
*
|
||||||
|
* Ровно тем же мостиком с 0.0.25 ездит и ЗАКРЕПЛЕНИЕ (`initialPinnedKey` /
|
||||||
|
* `onPinnedKeyChange`): раньше `pinnedKey` был чисто локальным `useState`, и
|
||||||
|
* закрепление, сделанное в основном окне, в мини-плеер не попадало вовсе.
|
||||||
|
* Отдельный «общий» источник правды здесь не нужен: экземпляр сцены в каждый
|
||||||
|
* момент ровно один (пока открыт Document PiP, основное окно показывает
|
||||||
|
* заглушку — см. `RoomPage`), поэтому состояние достаточно передать по эстафете.
|
||||||
|
*
|
||||||
* Раскладка — вертикальная колонка миниатюр слева от основной сцены (не
|
* Раскладка — вертикальная колонка миниатюр слева от основной сцены (не
|
||||||
* горизонтальная лента, см. design/mockups/room.html после правки: узкая
|
* горизонтальная лента, см. design/mockups/room.html после правки: узкая
|
||||||
* колонка сбоку, скролл по вертикали). Это штатное поведение самого
|
* колонка сбоку, скролл по вертикали). Это штатное поведение самого
|
||||||
@@ -188,12 +201,21 @@ function PipMicToggle() {
|
|||||||
* показываем ТОЛЬКО одну крупную плитку активного окна — без карусели/грида;
|
* показываем ТОЛЬКО одну крупную плитку активного окна — без карусели/грида;
|
||||||
* режимы показа и скрытие остальных на мини-плеер не влияют вовсе.
|
* режимы показа и скрытие остальных на мини-плеер не влияют вовсе.
|
||||||
*
|
*
|
||||||
* Фокус следует за активным спикером в ОБОИХ вариантах (`followSpeaker` у
|
* ВЫБОР ФОКУСА ОДИНАКОВ В ОБОИХ ВАРИАНТАХ (с 0.0.25). До этого мини-плеер был
|
||||||
* `pickStageFocus`; для основного окна — с 0.0.6, задача 3.2), но по-разному:
|
* намеренно «упрощён»: без удержания говорящего, без удержания демонстрации
|
||||||
* PiP переключается мгновенно и всегда показывает говорящего, а основное окно
|
* экрана (`holdScreenShare`), без приоритета говорящего с включённой камерой и
|
||||||
* ждёт `SPEAKER_HOLD_MS` (не дёргается на коротких репликах), не уводит из
|
* без закрепления. На практике это читалось как поломка: в мини-окне
|
||||||
* фокуса живую демонстрацию экрана (`holdScreenShare`) и умеет закрепление
|
* демонстрация экрана слетала от любой чужой реплики, а закрепление,
|
||||||
* участника (`pinnedKey`, задача 3.1) — кнопка-булавка на плитке.
|
* сделанное в основном окне, не действовало. Теперь `pickStageFocus`
|
||||||
|
* получает одни и те же правила независимо от варианта — разным остаётся
|
||||||
|
* ровно одно: `localKey` (см. ниже) и то, что PiP рисует одну плитку вместо
|
||||||
|
* раскладки.
|
||||||
|
*
|
||||||
|
* Единственное сознательное отличие — `localKey`: у мини-плеера есть
|
||||||
|
* последний фолбэк «показать себя», у основного окна его нет (там фолбэк —
|
||||||
|
* первый трек по порядку, поведение не менялось). Строка из того же сюжета,
|
||||||
|
* что и `initialFocusKey`: без неё свежеоткрытое мини-окно на пустой комнате
|
||||||
|
* выбирало произвольного участника.
|
||||||
*/
|
*/
|
||||||
export function RoomStage({
|
export function RoomStage({
|
||||||
variant = 'full',
|
variant = 'full',
|
||||||
@@ -203,6 +225,8 @@ export function RoomStage({
|
|||||||
onHideOthers,
|
onHideOthers,
|
||||||
initialFocusKey = null,
|
initialFocusKey = null,
|
||||||
onFocusKeyChange,
|
onFocusKeyChange,
|
||||||
|
initialPinnedKey = null,
|
||||||
|
onPinnedKeyChange,
|
||||||
onPinFocus,
|
onPinFocus,
|
||||||
raisedHandIdentities,
|
raisedHandIdentities,
|
||||||
conferenceId,
|
conferenceId,
|
||||||
@@ -221,6 +245,10 @@ export function RoomStage({
|
|||||||
initialFocusKey?: string | null
|
initialFocusKey?: string | null
|
||||||
/** Сообщать наружу текущий фокус, чтобы его пережил переезд сцены в мини-плеер и обратно. */
|
/** Сообщать наружу текущий фокус, чтобы его пережил переезд сцены в мини-плеер и обратно. */
|
||||||
onFocusKeyChange?: (key: string | null) => void
|
onFocusKeyChange?: (key: string | null) => void
|
||||||
|
/** Чем инициализировать закрепление при монтировании — тот же мостик через `RoomPage`, что и у фокуса. */
|
||||||
|
initialPinnedKey?: string | null
|
||||||
|
/** Сообщать наружу закрепление, чтобы оно пережило переезд сцены в мини-плеер и обратно. */
|
||||||
|
onPinnedKeyChange?: (key: string | null) => void
|
||||||
/**
|
/**
|
||||||
* Участника только что закрепили (не открепили) в режиме без крупной
|
* Участника только что закрепили (не открепили) в режиме без крупной
|
||||||
* плитки — сцена сама переключиться не может (режим живёт в `RoomPage`),
|
* плитки — сцена сама переключиться не может (режим живёт в `RoomPage`),
|
||||||
@@ -245,9 +273,9 @@ export function RoomStage({
|
|||||||
// (`Room.activeSpeakers`, обновляются по `RoomEvent.ActiveSpeakersChanged`,
|
// (`Room.activeSpeakers`, обновляются по `RoomEvent.ActiveSpeakersChanged`,
|
||||||
// событие шлётся лишь при РЕАЛЬНОЙ смене состава/порядка говорящих — не
|
// событие шлётся лишь при РЕАЛЬНОЙ смене состава/порядка говорящих — не
|
||||||
// дребезжит на каждый чих, в отличие от сырого `participant.isSpeaking`).
|
// дребезжит на каждый чих, в отличие от сырого `participant.isSpeaking`).
|
||||||
// Основное окно поверх этого ещё и удерживает состав (см. `useSteadySpeakers`
|
// Поверх этого сцена ещё и удерживает состав (см. `useSteadySpeakers` и
|
||||||
// и `SPEAKER_HOLD_MS`), PiP берёт значение как есть.
|
// `SPEAKER_HOLD_MS`) — в обоих вариантах одинаково.
|
||||||
const speakingParticipants = useSteadySpeakers(useSpeakingParticipants(), variant === 'pip' ? 0 : SPEAKER_HOLD_MS)
|
const speakingParticipants = useSteadySpeakers(useSpeakingParticipants(), SPEAKER_HOLD_MS)
|
||||||
|
|
||||||
const cameraTracks = tracks.filter((t) => t.source === Track.Source.Camera)
|
const cameraTracks = tracks.filter((t) => t.source === Track.Source.Camera)
|
||||||
const screenShareTracks = tracks.filter((t) => isTrackReference(t) && t.source === Track.Source.ScreenShare)
|
const screenShareTracks = tracks.filter((t) => isTrackReference(t) && t.source === Track.Source.ScreenShare)
|
||||||
@@ -289,8 +317,10 @@ export function RoomStage({
|
|||||||
const [focusKey, setFocusKey] = useState<string | null>(initialFocusKey)
|
const [focusKey, setFocusKey] = useState<string | null>(initialFocusKey)
|
||||||
// Закрепление живёт в состоянии сцены (задача 3.1): ключ `identity:source`
|
// Закрепление живёт в состоянии сцены (задача 3.1): ключ `identity:source`
|
||||||
// плитки, которую пользователь закрепил булавкой; `null` — закрепления нет.
|
// плитки, которую пользователь закрепил булавкой; `null` — закрепления нет.
|
||||||
// Только для основного окна — в PiP плитка одна и закреплять нечего.
|
// Стартовое значение приходит от предыдущего экземпляра сцены (тот же
|
||||||
const [pinnedKey, setPinnedKey] = useState<string | null>(null)
|
// мостик через `RoomPage`, что и у фокуса), поэтому закрепление, сделанное
|
||||||
|
// в основном окне, действует и в мини-плеере.
|
||||||
|
const [pinnedKey, setPinnedKey] = useState<string | null>(initialPinnedKey)
|
||||||
const [prevPinnedKey, setPrevPinnedKey] = useState<string | null>(null)
|
const [prevPinnedKey, setPrevPinnedKey] = useState<string | null>(null)
|
||||||
|
|
||||||
const cameraKeys = cameraTracks.map(stageTrackKey)
|
const cameraKeys = cameraTracks.map(stageTrackKey)
|
||||||
@@ -299,13 +329,23 @@ export function RoomStage({
|
|||||||
// камера есть у КАЖДОГО участника хотя бы плейсхолдером, — ни среди
|
// камера есть у КАЖДОГО участника хотя бы плейсхолдером, — ни среди
|
||||||
// демонстраций) — закрепление снимаем, чтобы сцена не осталась в подвешенном
|
// демонстраций) — закрепление снимаем, чтобы сцена не осталась в подвешенном
|
||||||
// состоянии и булавка не «висела» на исчезнувшем ключе.
|
// состоянии и булавка не «висела» на исчезнувшем ключе.
|
||||||
|
//
|
||||||
|
// `tracksKnown` — обязательная охрана, а не перестраховка: на ПЕРВОМ рендере
|
||||||
|
// нового экземпляра сцены `useTracks` отдаёт ПУСТОЙ массив (реальный состав
|
||||||
|
// приезжает следующим рендером, из подписки на события комнаты). Без этой
|
||||||
|
// проверки пустой набор читается как «все вышли», и закрепление, приехавшее
|
||||||
|
// через `initialPinnedKey`, обнулялось сразу при монтировании — то есть
|
||||||
|
// мини-плеер терял его каждый раз (найдено живой отладкой при 0.0.25).
|
||||||
|
// Пустых наборов при живой комнате не бывает: камера есть у каждого
|
||||||
|
// участника хотя бы плейсхолдером.
|
||||||
|
const tracksKnown = cameraKeys.length > 0 || screenShareKeys.length > 0
|
||||||
const pinnedAlive = pinnedKey !== null && (cameraKeys.includes(pinnedKey) || screenShareKeys.includes(pinnedKey))
|
const pinnedAlive = pinnedKey !== null && (cameraKeys.includes(pinnedKey) || screenShareKeys.includes(pinnedKey))
|
||||||
|
|
||||||
const tracksChanged = tracks !== prevTracks
|
const tracksChanged = tracks !== prevTracks
|
||||||
const speakingChanged = speakingParticipants !== prevSpeakingParticipants
|
const speakingChanged = speakingParticipants !== prevSpeakingParticipants
|
||||||
const pinnedChanged = pinnedKey !== prevPinnedKey
|
const pinnedChanged = pinnedKey !== prevPinnedKey
|
||||||
|
|
||||||
if (pinnedKey !== null && !pinnedAlive) {
|
if (pinnedKey !== null && tracksKnown && !pinnedAlive) {
|
||||||
setPinnedKey(null)
|
setPinnedKey(null)
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -328,14 +368,12 @@ export function RoomStage({
|
|||||||
cameraKeys,
|
cameraKeys,
|
||||||
screenShareKeys,
|
screenShareKeys,
|
||||||
speakingCameraKeys,
|
speakingCameraKeys,
|
||||||
// Приоритет «говорящий с камерой выше говорящего без камеры» — только
|
cameraKeysWithVideo: cameraTracks.filter(hasLiveVideo).map(stageTrackKey),
|
||||||
// основному окну: PiP по договорённости ведёт себя ровно как раньше.
|
|
||||||
cameraKeysWithVideo: variant === 'pip' ? [] : cameraTracks.filter(hasLiveVideo).map(stageTrackKey),
|
|
||||||
prevKeys,
|
prevKeys,
|
||||||
prevFocusKey: focusKey,
|
prevFocusKey: focusKey,
|
||||||
pinnedKey: pinnedAlive ? pinnedKey : null,
|
pinnedKey: pinnedAlive ? pinnedKey : null,
|
||||||
followSpeaker: true,
|
followSpeaker: true,
|
||||||
holdScreenShare: variant !== 'pip',
|
holdScreenShare: true,
|
||||||
// Только для PiP — в основном окне фолбэк на «первый трек» не менялся.
|
// Только для PiP — в основном окне фолбэк на «первый трек» не менялся.
|
||||||
localKey: variant === 'pip' ? `${room.localParticipant.identity}:${Track.Source.Camera}` : null,
|
localKey: variant === 'pip' ? `${room.localParticipant.identity}:${Track.Source.Camera}` : null,
|
||||||
})
|
})
|
||||||
@@ -352,6 +390,11 @@ export function RoomStage({
|
|||||||
onFocusKeyChange?.(focusKey)
|
onFocusKeyChange?.(focusKey)
|
||||||
}, [focusKey, onFocusKeyChange])
|
}, [focusKey, onFocusKeyChange])
|
||||||
|
|
||||||
|
// То же самое для закрепления — см. `initialPinnedKey`.
|
||||||
|
useEffect(() => {
|
||||||
|
onPinnedKeyChange?.(pinnedKey)
|
||||||
|
}, [pinnedKey, onPinnedKeyChange])
|
||||||
|
|
||||||
const focusTrack = tracks.find((t) => stageTrackKey(t) === focusKey) ?? screenShareTracks[0] ?? cameraTracks[0]
|
const focusTrack = tracks.find((t) => stageTrackKey(t) === focusKey) ?? screenShareTracks[0] ?? cameraTracks[0]
|
||||||
const focusTrackKey = focusTrack ? stageTrackKey(focusTrack) : null
|
const focusTrackKey = focusTrack ? stageTrackKey(focusTrack) : null
|
||||||
// При активной демонстрации карусель — ВСЕ камеры (включая демонстратора) И
|
// При активной демонстрации карусель — ВСЕ камеры (включая демонстратора) И
|
||||||
@@ -394,13 +437,16 @@ export function RoomStage({
|
|||||||
// Мини-плеер показывает ТОЛЬКО активное окно — без карусели/
|
// Мини-плеер показывает ТОЛЬКО активное окно — без карусели/
|
||||||
// грида, одна плитка на весь контейнер (см. `.room-single-tile`,
|
// грида, одна плитка на весь контейнер (см. `.room-single-tile`,
|
||||||
// `styles/room.css`). `focusTrack` уже вычислен выше тем же `pickStageFocus`
|
// `styles/room.css`). `focusTrack` уже вычислен выше тем же `pickStageFocus`
|
||||||
// (с `followSpeaker: true` для этого варианта) — переиспользуем как есть.
|
// и по тем же правилам, что и в основном окне (закрепление, удержание
|
||||||
|
// демонстрации, антидребезг говорящего) — переиспользуем как есть.
|
||||||
|
// Булавки на плитке здесь нет намеренно: своего тулбара у мини-окна нет,
|
||||||
|
// закрепление делается в основном окне и приезжает сюда через
|
||||||
|
// `initialPinnedKey`.
|
||||||
if (variant === 'pip') {
|
if (variant === 'pip') {
|
||||||
return (
|
return (
|
||||||
<section className="stage room-single-tile">
|
<section className="stage room-single-tile">
|
||||||
{focusTrack && <RoomParticipantTile trackRef={focusTrack} onStopSharing={handleStopSharing} />}
|
{focusTrack && <RoomParticipantTile trackRef={focusTrack} onStopSharing={handleStopSharing} />}
|
||||||
<PipMicToggle />
|
<PipMicToggle />
|
||||||
<RoomAudioRenderer />
|
|
||||||
</section>
|
</section>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
@@ -496,7 +542,6 @@ export function RoomStage({
|
|||||||
<span>Показать остальных ({sideTracks.length})</span>
|
<span>Показать остальных ({sideTracks.length})</span>
|
||||||
</button>
|
</button>
|
||||||
)}
|
)}
|
||||||
<RoomAudioRenderer />
|
|
||||||
</section>
|
</section>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -62,8 +62,10 @@ export interface PickStageFocusInput {
|
|||||||
/** Ключ, что был в фокусе на предыдущем рендере; `null` — фокус ещё не выбирался. */
|
/** Ключ, что был в фокусе на предыдущем рендере; `null` — фокус ещё не выбирался. */
|
||||||
prevFocusKey: string | null
|
prevFocusKey: string | null
|
||||||
/**
|
/**
|
||||||
* Ключ трека, ЗАКРЕПЛЁННОГО пользователем в основном окне (кнопка-булавка на
|
* Ключ трека, ЗАКРЕПЛЁННОГО пользователем (кнопка-булавка на плитке
|
||||||
* плитке, состояние живёт в `RoomStage.tsx`); `null` — закрепления нет.
|
* основного окна; состояние живёт в `RoomStage.tsx` и переезжает в
|
||||||
|
* мини-плеер через `RoomPage`, см. там `initialPinnedKey`); `null` —
|
||||||
|
* закрепления нет.
|
||||||
* Закрепление держит фокус вопреки говорящим, но уступает ЛЮБОЙ активной
|
* Закрепление держит фокус вопреки говорящим, но уступает ЛЮБОЙ активной
|
||||||
* демонстрации экрана (формулировка оператора: «перебивается только чьей-либо
|
* демонстрации экрана (формулировка оператора: «перебивается только чьей-либо
|
||||||
* демонстрацией экрана») — а когда демонстрация закончилась, фокус
|
* демонстрацией экрана») — а когда демонстрация закончилась, фокус
|
||||||
@@ -79,19 +81,22 @@ export interface PickStageFocusInput {
|
|||||||
* не удерживать текущий). С 0.0.6 включено и для мини-плеера (PiP), и для
|
* не удерживать текущий). С 0.0.6 включено и для мини-плеера (PiP), и для
|
||||||
* основного окна — решение оператора (этап 3, задача 3.2). Защита от
|
* основного окна — решение оператора (этап 3, задача 3.2). Защита от
|
||||||
* дребезга — на стороне вызывающего: источник «говорящих» — throttled
|
* дребезга — на стороне вызывающего: источник «говорящих» — throttled
|
||||||
* `useSpeakingParticipants()` поверх `RoomEvent.ActiveSpeakersChanged`, а в
|
* `useSpeakingParticipants()` поверх `RoomEvent.ActiveSpeakersChanged` плюс
|
||||||
* основном окне ещё и удержание в ~1.2 с (см. `useSteadySpeakers` в
|
* удержание в ~1.2 с (см. `useSteadySpeakers` в `RoomStage.tsx`, с 0.0.25 —
|
||||||
* `RoomStage.tsx`), не сырой дребезжащий `participant.isSpeaking`.
|
* в обеих сценах), не сырой дребезжащий `participant.isSpeaking`.
|
||||||
* По умолчанию `false` — фокус удерживается (см. правило 5).
|
* По умолчанию `false` — фокус удерживается (см. правило 5).
|
||||||
*/
|
*/
|
||||||
followSpeaker?: boolean
|
followSpeaker?: boolean
|
||||||
/**
|
/**
|
||||||
* Живая демонстрация экрана в фокусе НЕ уступает заговорившему участнику
|
* Живая демонстрация экрана в фокусе НЕ уступает заговорившему участнику
|
||||||
* (правило 3). Нужно основному окну: там демонстрация — это содержательный
|
* (правило 3). Демонстрация — это содержательный центр разговора, и уводить
|
||||||
* центр разговора, и уводить её из большого окна на каждую реплику нельзя.
|
* её из фокуса на каждую реплику нельзя.
|
||||||
* Мини-плеер (PiP) показывает ровно одну плитку и намеренно ведёт себя иначе
|
*
|
||||||
* — всегда показывает того, кто говорит, поэтому там `false` (поведение
|
* С 0.0.25 включено в ОБЕИХ сценах. До этого мини-плеер (PiP) намеренно
|
||||||
* PiP не менялось с 0.0.4).
|
* ходил с `false` — «одна плитка, всегда показываем говорящего»; на практике
|
||||||
|
* это выглядело как поломка: демонстрация в мини-окне пропадала, стоило
|
||||||
|
* кому-то сказать слово. По умолчанию всё ещё `false` — это поведение
|
||||||
|
* функции без явного запроса удержания.
|
||||||
*/
|
*/
|
||||||
holdScreenShare?: boolean
|
holdScreenShare?: boolean
|
||||||
/**
|
/**
|
||||||
@@ -132,16 +137,14 @@ function pickSpeakerKey(
|
|||||||
* фокус безусловно переходит на него (последний из новых, если появилось
|
* фокус безусловно переходит на него (последний из новых, если появилось
|
||||||
* сразу несколько), даже если до этого в фокусе была камера или другая
|
* сразу несколько), даже если до этого в фокусе была камера или другая
|
||||||
* демонстрация. Так же ведут себя типовые UI конференций (Google Meet).
|
* демонстрация. Так же ведут себя типовые UI конференций (Google Meet).
|
||||||
* 2. Закрепление (`pinnedKey`, только основное окно): закреплённый участник
|
* 2. Закрепление (`pinnedKey`): закреплённый участник
|
||||||
* забирает фокус у говорящих и у удержания предыдущего фокуса, но уступает
|
* забирает фокус у говорящих и у удержания предыдущего фокуса, но уступает
|
||||||
* ЛЮБОЙ активной демонстрации экрана. Поэтому правило и стоит выше
|
* ЛЮБОЙ активной демонстрации экрана. Поэтому правило и стоит выше
|
||||||
* удержания (правило 5): как только демонстрация закончилась и
|
* удержания (правило 5): как только демонстрация закончилась и
|
||||||
* `screenShareKeys` опустел, фокус возвращается на закреплённого, а не
|
* `screenShareKeys` опустел, фокус возвращается на закреплённого, а не
|
||||||
* остаётся на том, кто был в фокусе до демонстрации.
|
* остаётся на том, кто был в фокусе до демонстрации.
|
||||||
* 3. `holdScreenShare` (только основное окно): демонстрация, уже стоящая в
|
* 3. `holdScreenShare`: демонстрация, уже стоящая в фокусе, не уступает
|
||||||
* фокусе, не уступает заговорившему — иначе большое окно уводило бы шэр на
|
* заговорившему — иначе окно уводило бы шэр на каждую реплику.
|
||||||
* каждую реплику. В PiP шаг пропускается (там одна плитка и она всегда
|
|
||||||
* показывает говорящего).
|
|
||||||
* 4. `followSpeaker`: если сейчас есть говорящий — фокус СРАЗУ переходит на
|
* 4. `followSpeaker`: если сейчас есть говорящий — фокус СРАЗУ переходит на
|
||||||
* него, даже если текущий фокус ещё жив; среди одновременно говорящих
|
* него, даже если текущий фокус ещё жив; среди одновременно говорящих
|
||||||
* предпочитаем того, у кого включена камера (`cameraKeysWithVideo`).
|
* предпочитаем того, у кого включена камера (`cameraKeysWithVideo`).
|
||||||
|
|||||||
@@ -2,7 +2,7 @@ import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
|
|||||||
import { createPortal } from 'react-dom'
|
import { createPortal } from 'react-dom'
|
||||||
import { useLocation, useNavigate, useParams } from 'react-router-dom'
|
import { useLocation, useNavigate, useParams } from 'react-router-dom'
|
||||||
import { PictureInPicture2 } from 'lucide-react'
|
import { PictureInPicture2 } from 'lucide-react'
|
||||||
import { LiveKitRoom, usePersistentUserChoices } from '@livekit/components-react'
|
import { LiveKitRoom, RoomAudioRenderer, usePersistentUserChoices } from '@livekit/components-react'
|
||||||
import type { RoomOptions } from 'livekit-client'
|
import type { RoomOptions } from 'livekit-client'
|
||||||
import '@livekit/components-styles'
|
import '@livekit/components-styles'
|
||||||
import '@/styles/room.css'
|
import '@/styles/room.css'
|
||||||
@@ -208,6 +208,12 @@ export function RoomPage() {
|
|||||||
// открывал мини-окно на самом пользователе. Подробнее — докстринг `RoomStage`.
|
// открывал мини-окно на самом пользователе. Подробнее — докстринг `RoomStage`.
|
||||||
const [stageFocusKey, setStageFocusKey] = useState<string | null>(null)
|
const [stageFocusKey, setStageFocusKey] = useState<string | null>(null)
|
||||||
|
|
||||||
|
// Закрепление участника (булавка на плитке) — по той же причине и тем же
|
||||||
|
// мостиком, что и `stageFocusKey`: экземпляр `RoomStage` при открытии
|
||||||
|
// мини-плеера пересоздаётся, и до 0.0.25 закрепление, сделанное в основном
|
||||||
|
// окне, в мини-окно не попадало вовсе (там был свой чистый `useState`).
|
||||||
|
const [stagePinnedKey, setStagePinnedKey] = useState<string | null>(null)
|
||||||
|
|
||||||
// Сохранённый выбор устройств — читаем через собственный вызов
|
// Сохранённый выбор устройств — читаем через собственный вызов
|
||||||
// usePersistentUserChoices (независимый от того, что использует
|
// usePersistentUserChoices (независимый от того, что использует
|
||||||
// DeviceSettingsDialog: там свой вызов хука со своим состоянием). ВАЖНО:
|
// DeviceSettingsDialog: там свой вызов хука со своим состоянием). ВАЖНО:
|
||||||
@@ -285,6 +291,21 @@ export function RoomPage() {
|
|||||||
options={roomOptions}
|
options={roomOptions}
|
||||||
onDisconnected={handleDisconnected}
|
onDisconnected={handleDisconnected}
|
||||||
>
|
>
|
||||||
|
{/* Звук комнаты рендерится ЗДЕСЬ, а не внутри `RoomStage`, и ровно
|
||||||
|
одним экземпляром на всю страницу. `RoomAudioRenderer` — это набор
|
||||||
|
скрытых `<audio>`, к которым LiveKit привязывает чужие аудиотреки
|
||||||
|
(`track.attach(el)`). Пока он жил в сцене, открытие мини-плеера
|
||||||
|
переносило эти элементы в ДРУГОЙ документ (Document PiP — отдельное
|
||||||
|
окно со своим `document`), а возврат — обратно, и после возврата
|
||||||
|
звук чужих участников пропадал: Chrome теряет аудиовыход у
|
||||||
|
remote-трека, переехавшего между документами. Замерено: пакеты
|
||||||
|
продолжают приходить (`packetsReceived` растёт), а
|
||||||
|
`totalSamplesDuration`/`totalAudioEnergy` замирают, и трек молчит
|
||||||
|
даже в свежесозданном `<audio>` со свежим `MediaStream`. Тот же
|
||||||
|
цикл detach/attach В ПРЕДЕЛАХ ОДНОГО документа безвреден — дело
|
||||||
|
именно в переезде. Здесь элементы живут в основном документе
|
||||||
|
непрерывно, весь цикл «открыл мини-окно → вернул» их не касается. */}
|
||||||
|
<RoomAudioRenderer />
|
||||||
<div data-lk-theme="default" className="room-shell">
|
<div data-lk-theme="default" className="room-shell">
|
||||||
<RoomTopbar title={joinState.title ?? null} slug={slug} number={joinState.number} />
|
<RoomTopbar title={joinState.title ?? null} slug={slug} number={joinState.number} />
|
||||||
<div className="room-main">
|
<div className="room-main">
|
||||||
@@ -306,6 +327,8 @@ export function RoomPage() {
|
|||||||
onHideOthers={() => setHideOthers(true)}
|
onHideOthers={() => setHideOthers(true)}
|
||||||
initialFocusKey={stageFocusKey}
|
initialFocusKey={stageFocusKey}
|
||||||
onFocusKeyChange={setStageFocusKey}
|
onFocusKeyChange={setStageFocusKey}
|
||||||
|
initialPinnedKey={stagePinnedKey}
|
||||||
|
onPinnedKeyChange={setStagePinnedKey}
|
||||||
onPinFocus={handlePinFocus}
|
onPinFocus={handlePinFocus}
|
||||||
raisedHandIdentities={raisedHandIdentities}
|
raisedHandIdentities={raisedHandIdentities}
|
||||||
conferenceId={joinState.conferenceId}
|
conferenceId={joinState.conferenceId}
|
||||||
@@ -358,10 +381,17 @@ export function RoomPage() {
|
|||||||
`variant="pip"` — мини-плеер
|
`variant="pip"` — мини-плеер
|
||||||
показывает только активное окно (одну плитку), без карусели/грида
|
показывает только активное окно (одну плитку), без карусели/грида
|
||||||
основного окна. `initialFocusKey` — то, что было крупно в основном
|
основного окна. `initialFocusKey` — то, что было крупно в основном
|
||||||
окне: без него мини-окно открывалось на самом пользователе. */}
|
окне: без него мини-окно открывалось на самом пользователе;
|
||||||
|
`initialPinnedKey` — закрепление оттуда же. */}
|
||||||
{pip.pipWindow &&
|
{pip.pipWindow &&
|
||||||
createPortal(
|
createPortal(
|
||||||
<RoomStage variant="pip" initialFocusKey={stageFocusKey} onFocusKeyChange={setStageFocusKey} />,
|
<RoomStage
|
||||||
|
variant="pip"
|
||||||
|
initialFocusKey={stageFocusKey}
|
||||||
|
onFocusKeyChange={setStageFocusKey}
|
||||||
|
initialPinnedKey={stagePinnedKey}
|
||||||
|
onPinnedKeyChange={setStagePinnedKey}
|
||||||
|
/>,
|
||||||
pip.pipWindow.document.body,
|
pip.pipWindow.document.body,
|
||||||
)}
|
)}
|
||||||
<ForcedMuteWatcher event={chat.lastForcedMute} />
|
<ForcedMuteWatcher event={chat.lastForcedMute} />
|
||||||
|
|||||||
Reference in New Issue
Block a user