Add connection quality indicator to the tile
This commit is contained in:
parent
786c584ae2
commit
274b5b66aa
1 changed files with 6 additions and 1 deletions
|
@ -19,7 +19,11 @@ import { animated } from "@react-spring/web";
|
|||
import classNames from "classnames";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { LocalParticipant, RemoteParticipant, Track } from "livekit-client";
|
||||
import { VideoTrack, useMediaTrack } from "@livekit/components-react";
|
||||
import {
|
||||
ConnectionQualityIndicator,
|
||||
VideoTrack,
|
||||
useMediaTrack,
|
||||
} from "@livekit/components-react";
|
||||
|
||||
import styles from "./VideoTile.module.css";
|
||||
import { ReactComponent as MicMutedIcon } from "../icons/MicMuted.svg";
|
||||
|
@ -73,6 +77,7 @@ export const VideoTile = forwardRef<HTMLDivElement, Props>(
|
|||
{microphoneMuted && <MicMutedIcon />}
|
||||
{!sfuParticipant.isCameraEnabled && <VideoMutedIcon />}
|
||||
<span title={name}>{name}</span>
|
||||
<ConnectionQualityIndicator participant={sfuParticipant} />
|
||||
</div>
|
||||
))}
|
||||
<VideoTrack participant={sfuParticipant} source={Track.Source.Camera} />
|
||||
|
|
Loading…
Reference in a new issue