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.

RoomLockButton.js 2.7KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101
  1. // @flow
  2. import { MEETING_PASSWORD_ENABLED, getFeatureFlag } from '../../base/flags';
  3. import { translate } from '../../base/i18n';
  4. import { IconRoomLock, IconRoomUnlock } from '../../base/icons';
  5. import { isLocalParticipantModerator } from '../../base/participants';
  6. import { connect } from '../../base/redux';
  7. import { AbstractButton, type AbstractButtonProps } from '../../base/toolbox/components';
  8. import { beginRoomLockRequest, unlockRoom } from '../actions';
  9. type Props = AbstractButtonProps & {
  10. /**
  11. * Whether the current local participant is a moderator, therefore is
  12. * allowed to lock or unlock the conference.
  13. */
  14. _localParticipantModerator: boolean,
  15. /**
  16. * Whether the current conference is locked or not.
  17. */
  18. _locked: boolean,
  19. /**
  20. * The redux {@code dispatch} function.
  21. */
  22. dispatch: Function
  23. };
  24. /**
  25. * An implementation of a button for locking / unlocking a room.
  26. */
  27. class RoomLockButton extends AbstractButton<Props, *> {
  28. accessibilityLabel = 'toolbar.accessibilityLabel.lockRoom';
  29. icon = IconRoomLock;
  30. label = 'dialog.lockRoom';
  31. toggledIcon = IconRoomUnlock;
  32. toggledLabel = 'dialog.unlockRoom';
  33. /**
  34. * Handles clicking / pressing the button.
  35. *
  36. * @override
  37. * @protected
  38. * @returns {void}
  39. */
  40. _handleClick() {
  41. const { dispatch, _locked } = this.props;
  42. if (_locked) {
  43. dispatch(unlockRoom());
  44. } else {
  45. dispatch(beginRoomLockRequest());
  46. }
  47. }
  48. /**
  49. * Indicates whether this button is disabled or not.
  50. *
  51. * @override
  52. * @protected
  53. * @returns {boolean}
  54. */
  55. _isDisabled() {
  56. return !this.props._localParticipantModerator;
  57. }
  58. /**
  59. * Indicates whether this button is in toggled state or not.
  60. *
  61. * @override
  62. * @protected
  63. * @returns {boolean}
  64. */
  65. _isToggled() {
  66. return this.props._locked;
  67. }
  68. }
  69. /**
  70. * Maps (parts of) the redux state to the associated props for the
  71. * {@code RoomLockButton} component.
  72. *
  73. * @param {Object} state - The Redux state.
  74. * @param {Object} ownProps - The properties explicitly passed to the component instance.
  75. * @private
  76. * @returns {Props}
  77. */
  78. function _mapStateToProps(state, ownProps): Object {
  79. const { conference, locked } = state['features/base/conference'];
  80. const enabled = getFeatureFlag(state, MEETING_PASSWORD_ENABLED, true);
  81. const { visible = enabled } = ownProps;
  82. return {
  83. _localParticipantModerator: Boolean(conference && isLocalParticipantModerator(state)),
  84. _locked: Boolean(conference && locked),
  85. visible
  86. };
  87. }
  88. export default translate(connect(_mapStateToProps)(RoomLockButton));