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

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

import * as React from 'react';
import { Keyboard, ScrollView, StyleSheet, Text, TouchableOpacity, View } from 'react-native';
import { useSelector } from 'react-redux';
import { CreatePoll } from './CreatePoll';
import { PreviousPollsAndQuizzesList } from './PreviousPollsAndQuizzesList';
import { BottomSheet } from './BottomSheet';
import { CloseIcon } from '../Icons';
import { useHMSRoomStyleSheet } from '../hooks-util';
export const PollsConfigAndList = ({
  dismissModal
}) => {
  const hmsRoomStyles = useHMSRoomStyleSheet((theme, typography) => ({
    container: {
      backgroundColor: theme.palette.surface_dim
    },
    headerText: {
      color: theme.palette.on_surface_high,
      fontFamily: `${typography.font_family}-SemiBold`
    }
  }));
  const canCreateOrEndPoll = useSelector(state => {
    var _state$hmsStates$loca;
    const permissions = (_state$hmsStates$loca = state.hmsStates.localPeer) === null || _state$hmsStates$loca === void 0 || (_state$hmsStates$loca = _state$hmsStates$loca.role) === null || _state$hmsStates$loca === void 0 ? void 0 : _state$hmsStates$loca.permissions;
    return permissions === null || permissions === void 0 ? void 0 : permissions.pollWrite;
  });
  const canVoteOnPoll = useSelector(state => {
    var _state$hmsStates$loca2;
    const permissions = (_state$hmsStates$loca2 = state.hmsStates.localPeer) === null || _state$hmsStates$loca2 === void 0 || (_state$hmsStates$loca2 = _state$hmsStates$loca2.role) === null || _state$hmsStates$loca2 === void 0 ? void 0 : _state$hmsStates$loca2.permissions;
    return permissions === null || permissions === void 0 ? void 0 : permissions.pollRead;
  });
  const handleClosePress = () => {
    Keyboard.dismiss();
    dismissModal();
  };
  return /*#__PURE__*/React.createElement(View, {
    style: hmsRoomStyles.container
  }, /*#__PURE__*/React.createElement(View, {
    style: styles.header
  }, /*#__PURE__*/React.createElement(Text, {
    style: [styles.headerText, hmsRoomStyles.headerText]
  }, "Polls and Quizzes"), /*#__PURE__*/React.createElement(TouchableOpacity, {
    onPress: handleClosePress,
    hitSlop: styles.closeIconHitSlop,
    style: {
      marginLeft: 16
    }
  }, /*#__PURE__*/React.createElement(CloseIcon, null))), /*#__PURE__*/React.createElement(BottomSheet.Divider, {
    style: styles.halfDivider
  }), /*#__PURE__*/React.createElement(ScrollView, {
    contentContainerStyle: {
      paddingBottom: 24
    }
  }, canCreateOrEndPoll ? /*#__PURE__*/React.createElement(CreatePoll, null) : null, canVoteOnPoll || canCreateOrEndPoll ? /*#__PURE__*/React.createElement(PreviousPollsAndQuizzesList, null) : null));
};
const styles = StyleSheet.create({
  // Utilities
  fullView: {
    flex: 1
  },
  // Header
  header: {
    flexDirection: 'row',
    alignItems: 'center',
    justifyContent: 'space-between',
    marginTop: 24,
    marginHorizontal: 24
  },
  headerControls: {
    flexDirection: 'row',
    alignItems: 'center',
    flexShrink: 1
  },
  headerText: {
    fontSize: 20,
    lineHeight: 24,
    letterSpacing: 0.15
  },
  closeIconHitSlop: {
    bottom: 16,
    left: 16,
    right: 16,
    top: 16
  },
  backIcon: {
    marginRight: 8
  },
  // Divider
  halfDivider: {
    marginHorizontal: 24,
    // marginVertical: 0,
    // marginTop: 24,
    width: undefined
  },
  divider: {
    marginHorizontal: 24,
    marginVertical: 24,
    width: undefined
  }
});
//# sourceMappingURL=PollsConfigAndList.js.map