Disable buttons only when token features is enabled. Fixes #3355. (#3443)

* Disable buttons only when token features is enabled. Fixes #3355.

* squash: update disabled check.

* squash: update disabled and disabledByFeatures.

react/features/recording/components/LiveStream/AbstractLiveStreamButton.js

@@ -109,6 +109,10 @@ export default class AbstractLiveStreamButton<P: Props>
 export function _mapStateToProps(state: Object, ownProps: Props) {
     let { visible } = ownProps;
 
+    // a button can be disabled/enabled only if enableFeaturesBasedOnToken
+    // is on
+    let disabledByFeatures;
+
     if (typeof visible === 'undefined') {
         // If the containing component provides the visible prop, that is one
         // above all, but if not, the button should be autonomus and decide on
@@ -119,14 +123,18 @@ export function _mapStateToProps(state: Object, ownProps: Props) {
         } = state['features/base/config'];
         const { features = {} } = getLocalParticipant(state);
 
-        visible = liveStreamingEnabled
-            && (!enableFeaturesBasedOnToken
-                || String(features.livestreaming) === 'true');
+        visible = liveStreamingEnabled;
+
+        if (enableFeaturesBasedOnToken) {
+            visible = visible && String(features.livestreaming) === 'true';
+            disabledByFeatures = String(features.livestreaming) === 'disabled';
+        }
     }
 
     return {
         _isLiveStreamRunning: Boolean(
             getActiveSession(state, JitsiRecordingConstants.mode.STREAM)),
+        disabledByFeatures,
         visible
     };
 }

react/features/recording/components/LiveStream/LiveStreamButton.web.js

@@ -3,7 +3,6 @@
 import { connect } from 'react-redux';
 
 import { translate } from '../../../base/i18n';
-import { getLocalParticipant } from '../../../base/participants';
 
 import AbstractLiveStreamButton, {
     _mapStateToProps as _abstractMapStateToProps,
@@ -85,15 +84,14 @@ class LiveStreamButton extends AbstractLiveStreamButton<Props> {
  */
 function _mapStateToProps(state: Object, ownProps: Props) {
     const abstractProps = _abstractMapStateToProps(state, ownProps);
-    const localParticipant = getLocalParticipant(state);
-    const { features = {} } = localParticipant;
     let { visible } = ownProps;
 
+    const _disabledByFeatures = abstractProps.disabledByFeatures;
     let _disabled = false;
     let _liveStreamDisabledTooltipKey;
 
     if (!abstractProps.visible
-            && String(features.livestreaming) !== 'disabled') {
+            && _disabledByFeatures !== undefined && !_disabledByFeatures) {
         _disabled = true;
 
         // button and tooltip
@@ -108,7 +106,8 @@ function _mapStateToProps(state: Object, ownProps: Props) {
 
     if (typeof visible === 'undefined') {
         visible = interfaceConfig.TOOLBAR_BUTTONS.includes('livestreaming')
-            && (abstractProps.visible || _liveStreamDisabledTooltipKey);
+            && (abstractProps.visible
+                    || Boolean(_liveStreamDisabledTooltipKey));
     }
 
     return {

react/features/recording/components/Recording/AbstractRecordButton.js

@@ -113,6 +113,10 @@ export default class AbstractRecordButton<P: Props>
 export function _mapStateToProps(state: Object, ownProps: Props): Object {
     let { visible } = ownProps;
 
+    // a button can be disabled/enabled only if enableFeaturesBasedOnToken
+    // is on
+    let disabledByFeatures;
+
     if (typeof visible === 'undefined') {
         // If the containing component provides the visible prop, that is one
         // above all, but if not, the button should be autonomus and decide on
@@ -127,14 +131,18 @@ export function _mapStateToProps(state: Object, ownProps: Props): Object {
 
         visible = isModerator
             && fileRecordingsEnabled
-            && (!enableFeaturesBasedOnToken
-                || String(features.recording) === 'true')
             && typeof dropbox.clientId === 'string';
+
+        if (enableFeaturesBasedOnToken) {
+            visible = visible && String(features.recording) === 'true';
+            disabledByFeatures = String(features.recording) === 'disabled';
+        }
     }
 
     return {
         _isRecordingRunning:
             Boolean(getActiveSession(state, JitsiRecordingConstants.mode.FILE)),
+        disabledByFeatures,
         visible
     };
 }

react/features/recording/components/Recording/RecordButton.web.js

@@ -3,7 +3,6 @@
 import { connect } from 'react-redux';
 
 import { translate } from '../../../base/i18n';
-import { getLocalParticipant } from '../../../base/participants';
 
 import AbstractRecordButton, {
     _mapStateToProps as _abstractMapStateToProps,
@@ -85,15 +84,14 @@ class RecordButton extends AbstractRecordButton<Props> {
  */
 export function _mapStateToProps(state: Object, ownProps: Props): Object {
     const abstractProps = _abstractMapStateToProps(state, ownProps);
-    const localParticipant = getLocalParticipant(state);
-    const { features = {} } = localParticipant;
     let { visible } = ownProps;
 
+    const _disabledByFeatures = abstractProps.disabledByFeatures;
     let _disabled = false;
     let _fileRecordingsDisabledTooltipKey;
 
     if (!abstractProps.visible
-            && String(features.recording) !== 'disabled') {
+            && _disabledByFeatures !== undefined && !_disabledByFeatures) {
         _disabled = true;
 
         // button and tooltip
@@ -108,7 +106,8 @@ export function _mapStateToProps(state: Object, ownProps: Props): Object {
 
     if (typeof visible === 'undefined') {
         visible = interfaceConfig.TOOLBAR_BUTTONS.includes('recording')
-            && (abstractProps.visible || _fileRecordingsDisabledTooltipKey);
+            && (abstractProps.visible
+                    || Boolean(_fileRecordingsDisabledTooltipKey));
     }
 
     return {