@100mslive/react-native-room-kit/lib/module/components/PeerRTCStatsContainer.js

100ms Room Kit provides simple & easy to use UI components to build Live Streaming & Video Conferencing experiences in your apps.

import React, { memo } from 'react';
import { View, StyleSheet, ScrollView } from 'react-native';
import { useSelector } from 'react-redux';
import { HMSTrackSource } from '@100mslive/react-native-hms';
import { COLORS } from '../utils/theme';
import PeerRTCStatsView from './PeerRTCStatsView';
const PeerRTCStatsContainerUnmemo = ({
  peerId,
  trackId,
  trackSource
}) => {
  const audioTrackStats = useSelector(state => {
    const audioStatsId = !trackSource || trackSource === HMSTrackSource.REGULAR ? peerId : peerId + trackSource;
    return audioStatsId ? state.app.rtcStats[audioStatsId] : null;
  });
  const videoTrackStats = useSelector(state => {
    const videoStats = trackId ? state.app.rtcStats[trackId] : null;
    if (Array.isArray(videoStats) && videoStats.length === 1) {
      return videoStats[0];
    }
    return videoStats;
  });
  if (!Array.isArray(videoTrackStats)) {
    return /*#__PURE__*/React.createElement(View, {
      style: styles.statsContainer
    }, /*#__PURE__*/React.createElement(PeerRTCStatsView, {
      audioTrackStats: audioTrackStats,
      videoTrackStats: videoTrackStats
    }));
  }
  return /*#__PURE__*/React.createElement(ScrollView, {
    style: styles.statsContainer
  }, videoTrackStats.map(videoTrackStat => /*#__PURE__*/React.createElement(View, {
    style: styles.statsViewWrapper,
    key: videoTrackStat.layer
  }, /*#__PURE__*/React.createElement(PeerRTCStatsView, {
    audioTrackStats: audioTrackStats,
    videoTrackStats: videoTrackStat
  }))));
};
const styles = StyleSheet.create({
  statsContainer: {
    position: 'absolute',
    top: 8,
    left: 8,
    padding: 4,
    backgroundColor: COLORS.OVERLAY,
    borderRadius: 8,
    minWidth: 124,
    maxHeight: 170
  },
  statsViewWrapper: {
    marginBottom: 12
  }
});
const PeerRTCStatsContainer = /*#__PURE__*/memo(PeerRTCStatsContainerUnmemo);
PeerRTCStatsContainer.displayName = 'PeerRTCStatsContainer';
export default PeerRTCStatsContainer;
//# sourceMappingURL=PeerRTCStatsContainer.js.map