export default function RemoteVideo()

in src/components/RemoteVideo.tsx [27:69]

41 lines of code
4 McCabe index (conditional complexity)


export default function RemoteVideo(props: Props) {
  const {
    isLive = false,
    enabled,
    className,
    videoElementRef,
    name = '',
    tileId,
    fullScreenVideo,
    bindVideoElement,
    unbindVideoElement,
    nameplatePosition = 'bottom',
  } = props;
  const containerRef = createRef<HTMLDivElement>();
  const videoRef = React.createRef<HTMLVideoElement>();
  const fontSize = useDynamicFontSize(containerRef);

  useEffect(() => {
    bindVideoElement && bindVideoElement(videoRef.current);
    return unbindVideoElement;
  }, [tileId]);

  return (
    <div
      ref={containerRef}
      className={cx('remoteVideo', className, {
        enabled,
        fullScreenVideo,
      })}
    >
      <video muted ref={videoElementRef || videoRef} className={styles.video} />
      {name && (
        <div
          style={{ fontSize }}
          className={cx('nameplate', `nameplate--${nameplatePosition}`)}
        >
          {name}
        </div>
      )}
      {isLive && <LiveIndicator />}
    </div>
  );
}