@100mslive/react-native-room-kit/lib/module/components/PollsAndQuizzesCard.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 { View, Text, StyleSheet } from 'react-native';
import { batch, useDispatch } from 'react-redux';
import { useHMSRoomStyleSheet } from '../hooks-util';
import { HMSPrimaryButton } from './HMSPrimaryButton';
import { pushToNavigationStack, setSelectedPollId } from '../redux/actions';
import { CreatePollStages } from '../redux/actionTypes';
import { PollAndQuizzStateLabel } from './PollAndQuizzStateLabel';
export const PollsAndQuizzesCard = ({
  poll
}) => {
  const dispatch = useDispatch();
  const hmsRoomStyles = useHMSRoomStyleSheet((theme, typography) => ({
    surfaceHighSemiBoldText: {
      color: theme.palette.on_surface_high,
      fontFamily: `${typography.font_family}-SemiBold`
    },
    container: {
      backgroundColor: theme.palette.surface_default
    },
    liveStateLabelWrapper: {
      backgroundColor: theme.palette.alert_error_default
    },
    stateLabelWrapper: {
      backgroundColor: theme.palette.surface_brighter
    }
  }));
  const viewPoll = () => {
    batch(() => {
      dispatch(pushToNavigationStack(CreatePollStages.POLL_VOTING));
      dispatch(setSelectedPollId(poll.pollId));
    });
  };
  return /*#__PURE__*/React.createElement(View, {
    style: [hmsRoomStyles.container, styles.container]
  }, /*#__PURE__*/React.createElement(View, {
    style: styles.row
  }, /*#__PURE__*/React.createElement(Text, {
    numberOfLines: 4,
    style: [styles.pollTitle, hmsRoomStyles.surfaceHighSemiBoldText]
  }, poll.title), typeof poll.state === 'number' ? /*#__PURE__*/React.createElement(PollAndQuizzStateLabel, {
    state: poll.state
  }) : null), /*#__PURE__*/React.createElement(View, {
    style: styles.spacer
  }), /*#__PURE__*/React.createElement(View, {
    style: styles.rightRow
  }, /*#__PURE__*/React.createElement(HMSPrimaryButton, {
    loading: false,
    onPress: viewPoll,
    title: "View"
  })));
};
const styles = StyleSheet.create({
  container: {
    padding: 16,
    borderRadius: 8,
    marginBottom: 24
  },
  spacer: {
    height: 16
  },
  row: {
    flexDirection: 'row',
    alignItems: 'center',
    justifyContent: 'space-between'
  },
  rightRow: {
    flexDirection: 'row',
    justifyContent: 'flex-end'
  },
  pollTitle: {
    flexShrink: 1,
    fontSize: 16,
    lineHeight: 24,
    letterSpacing: 0.15
  },
  stateLabelWrapper: {
    paddingVertical: 4,
    paddingHorizontal: 8,
    borderRadius: 4
  },
  stateLabel: {
    fontSize: 10,
    lineHeight: 16,
    letterSpacing: 1.5
  }
});
//# sourceMappingURL=PollsAndQuizzesCard.js.map