You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

ContextMenuMore.js 2.0KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. // @flow
  2. import React, { useCallback } from 'react';
  3. import { useTranslation } from 'react-i18next';
  4. import { TouchableOpacity } from 'react-native';
  5. import { Text } from 'react-native-paper';
  6. import { useDispatch } from 'react-redux';
  7. import { hideDialog } from '../../../base/dialog';
  8. import BottomSheet from '../../../base/dialog/components/native/BottomSheet';
  9. import {
  10. Icon, IconMicDisabledHollow,
  11. IconVideoOff
  12. } from '../../../base/icons';
  13. import { MEDIA_TYPE } from '../../../base/media';
  14. import { muteAllParticipants } from '../../../video-menu/actions.any';
  15. import styles from './styles';
  16. type Props = {
  17. /**
  18. * Array of participant IDs to not mute
  19. */
  20. exclude: Array<string>,
  21. /**
  22. * Participant reference
  23. */
  24. participant: Object
  25. };
  26. export const ContextMenuMore = ({ exclude }: Props) => {
  27. const dispatch = useDispatch();
  28. const cancel = useCallback(() => dispatch(hideDialog()), [ dispatch ]);
  29. const muteEveryoneVideo = useCallback(() => dispatch(muteAllParticipants(exclude, MEDIA_TYPE.VIDEO)), [ dispatch ]);
  30. const { t } = useTranslation();
  31. return (
  32. <BottomSheet
  33. onCancel = { cancel }
  34. style = { styles.contextMenuMore }>
  35. <TouchableOpacity
  36. onPress = { muteEveryoneVideo }
  37. style = { styles.contextMenuItemMuteVideo }>
  38. <Icon
  39. size = { 24 }
  40. src = { IconVideoOff } />
  41. <Text style = { styles.contextMenuItemText }>{t('participantsPane.actions.stopEveryonesVideo')}</Text>
  42. </TouchableOpacity>
  43. <TouchableOpacity
  44. style = { styles.contextMenuItemDontAllowUnmute }>
  45. <Icon
  46. size = { 24 }
  47. src = { IconMicDisabledHollow }
  48. style = { styles.contextMenuIcon } />
  49. <Text style = { styles.contextMenuItemText }>{t('participantsPane.actions.dontAllowUnmute')}</Text>
  50. </TouchableOpacity>
  51. </BottomSheet>
  52. );
  53. };