fix(toolbox) Disable screensharing button on mobile for video sender limit.

Also, ignore the toggle screenshare shortcut when the video sender limit is reached.
This commit is contained in:
Jaya Allamsetty 2022-01-05 15:27:42 -05:00
parent b8469545f3
commit 29eb9452c0
5 changed files with 49 additions and 13 deletions

View File

@ -4,6 +4,7 @@ import React from 'react';
import { Platform } from 'react-native';
import { connect } from '../../../base/redux';
import { isDesktopShareButtonDisabled } from '../../functions';
import ScreenSharingAndroidButton from './ScreenSharingAndroidButton.js';
import ScreenSharingIosButton from './ScreenSharingIosButton.js';
@ -30,7 +31,7 @@ const ScreenSharingButton = props => (
* }}
*/
function _mapStateToProps(state): Object {
const disabled = state['features/base/audio-only'].enabled;
const disabled = state['features/base/audio-only'].enabled || isDesktopShareButtonDisabled(state);
return {
_disabled: disabled

View File

@ -5,7 +5,8 @@ import { IconShareDesktop } from '../../../base/icons';
import JitsiMeetJS from '../../../base/lib-jitsi-meet/_';
import { connect } from '../../../base/redux';
import { AbstractButton, type AbstractButtonProps } from '../../../base/toolbox/components';
import { isScreenMediaShared, isScreenVideoShared } from '../../../screen-share';
import { isScreenVideoShared } from '../../../screen-share';
import { isDesktopShareButtonDisabled } from '../../functions';
type Props = AbstractButtonProps & {
@ -97,15 +98,8 @@ class ShareDesktopButton extends AbstractButton<Props, *> {
* @returns {Object}
*/
const mapStateToProps = state => {
const { muted, unmuteBlocked } = state['features/base/media'].video;
const videoOrShareInProgress = isScreenMediaShared(state) || !muted;
// Disable the screenshare button if the video sender limit is reached and there is no video or media share in
// progress.
let desktopSharingEnabled = JitsiMeetJS.isDesktopSharingEnabled()
&& !(unmuteBlocked && !videoOrShareInProgress);
let desktopSharingEnabled = JitsiMeetJS.isDesktopSharingEnabled();
const { enableFeaturesBasedOnToken } = state['features/base/config'];
let desktopSharingDisabledTooltipKey;
if (enableFeaturesBasedOnToken) {
@ -115,6 +109,10 @@ const mapStateToProps = state => {
desktopSharingDisabledTooltipKey = 'dialog.shareYourScreenDisabled';
}
// Disable the screenshare button if the video sender limit is reached and there is no video or media share in
// progress.
desktopSharingEnabled = desktopSharingEnabled && !isDesktopShareButtonDisabled(state);
return {
_desktopSharingDisabledTooltipKey: desktopSharingDisabledTooltipKey,
_desktopSharingEnabled: desktopSharingEnabled,

View File

@ -77,7 +77,7 @@ import {
showToolbox
} from '../../actions';
import { THRESHOLDS, NOT_APPLICABLE, DRAWER_MAX_HEIGHT, NOTIFY_CLICK_MODE } from '../../constants';
import { isToolboxVisible } from '../../functions';
import { isDesktopShareButtonDisabled, isToolboxVisible } from '../../functions';
import DownloadButton from '../DownloadButton';
import HangupButton from '../HangupButton';
import HelpButton from '../HelpButton';
@ -123,6 +123,11 @@ type Props = {
*/
_conference: Object,
/**
* Whether or not screensharing button is disabled.
*/
_desktopSharingButtonDisabled: boolean,
/**
* The tooltip key to use when screensharing is disabled. Or undefined
* if non to be shown and the button to be hidden.
@ -537,6 +542,7 @@ class Toolbox extends Component<Props> {
_doToggleScreenshare() {
const {
_backgroundType,
_desktopSharingButtonDisabled,
_desktopSharingEnabled,
_localVideo,
_virtualSource,
@ -558,7 +564,7 @@ class Toolbox extends Component<Props> {
return;
}
if (_desktopSharingEnabled) {
if (_desktopSharingEnabled && !_desktopSharingButtonDisabled) {
dispatch(startScreenShareFlow());
}
}
@ -1059,6 +1065,10 @@ class Toolbox extends Component<Props> {
* @returns {void}
*/
_onShortcutToggleScreenshare() {
// Ignore the shortcut if the button is disabled.
if (this.props._desktopSharingButtonDisabled) {
return;
}
sendAnalytics(createShortcutEvent(
'toggle.screen.sharing',
ACTION_SHORTCUT_TRIGGERED,
@ -1377,6 +1387,7 @@ function _mapStateToProps(state, ownProps) {
_clientWidth: clientWidth,
_conference: conference,
_desktopSharingEnabled: desktopSharingEnabled,
_desktopSharingButtonDisabled: isDesktopShareButtonDisabled(state),
_desktopSharingDisabledTooltipKey: desktopSharingDisabledTooltipKey,
_dialog: Boolean(state['features/base/dialog'].component),
_feedbackConfigured: Boolean(callStatsID),

View File

@ -53,6 +53,19 @@ export function getMovableButtons(width: number): Set<string> {
return new Set(buttons);
}
/**
* Indicates if the desktop share button is disabled or not.
*
* @param {Object} state - The state from the Redux store.
* @returns {boolean}
*/
export function isDesktopShareButtonDisabled(state: Object) {
const { muted, unmuteBlocked } = state['features/base/media'].video;
const videoOrShareInProgress = !muted || isLocalVideoTrackDesktop(state);
return unmuteBlocked && !videoOrShareInProgress;
}
/**
* Returns true if the toolbox is visible.
*

View File

@ -1,7 +1,7 @@
// @flow
import { getToolbarButtons } from '../base/config';
import { hasAvailableDevices } from '../base/devices';
import { isScreenMediaShared } from '../screen-share/functions';
import { TOOLBAR_TIMEOUT } from './constants';
@ -66,6 +66,19 @@ export function isAudioSettingsButtonDisabled(state: Object) {
|| state['features/base/config'].startSilent;
}
/**
* Indicates if the desktop share button is disabled or not.
*
* @param {Object} state - The state from the Redux store.
* @returns {boolean}
*/
export function isDesktopShareButtonDisabled(state: Object) {
const { muted, unmuteBlocked } = state['features/base/media'].video;
const videoOrShareInProgress = !muted || isScreenMediaShared(state);
return unmuteBlocked && !videoOrShareInProgress;
}
/**
* Indicates if the video settings button is disabled or not.
*