From 20f6ba17367f2f5a30749d6145b444c39a49694d Mon Sep 17 00:00:00 2001
From: Horatiu Muresan <horatiu.muresan@8x8.com>
Date: Tue, 19 Apr 2022 17:31:58 +0300
Subject: [PATCH] fix(premeeting) Detach premeeting toolbar buttons visibility
 - if hiddenPremeetingButtons is undefined, toolbarButtons overwrite decides
 what buttons to show - if hiddenPremeetingButtons is empty array, all buttons
 are show on premeeting screen regardless of toolbarButtons - if
 hiddenPremeetingButtons hides some buttons, only those buttons will be hidden
 regardless of toolbarButtons overwrite

---
 .../components/web/PreMeetingScreen.js         | 18 ++++++++++++++----
 .../features/toolbox/components/web/Toolbox.js |  9 +--------
 2 files changed, 15 insertions(+), 12 deletions(-)

diff --git a/react/features/base/premeeting/components/web/PreMeetingScreen.js b/react/features/base/premeeting/components/web/PreMeetingScreen.js
index 6d7c3f42b..34e8dbe88 100644
--- a/react/features/base/premeeting/components/web/PreMeetingScreen.js
+++ b/react/features/base/premeeting/components/web/PreMeetingScreen.js
@@ -6,6 +6,7 @@ import { connect } from '../../../../base/redux';
 import DeviceStatus from '../../../../prejoin/components/preview/DeviceStatus';
 import { Toolbox } from '../../../../toolbox/components/web';
 import { PREMEETING_BUTTONS, THIRD_PARTY_PREJOIN_BUTTONS } from '../../../config/constants';
+import { getToolbarButtons, isToolbarButtonEnabled } from '../../../config/functions.web';
 
 import ConnectionStatus from './ConnectionStatus';
 import Preview from './Preview';
@@ -147,14 +148,23 @@ class PreMeetingScreen extends PureComponent<Props> {
  * @returns {Object}
  */
 function mapStateToProps(state, ownProps): Object {
-    const hideButtons = state['features/base/config'].hiddenPremeetingButtons || [];
-    const premeetingButtons = ownProps.thirdParty
+    const { hiddenPremeetingButtons } = state['features/base/config'];
+    const toolbarButtons = getToolbarButtons(state);
+    const premeetingButtons = (ownProps.thirdParty
         ? THIRD_PARTY_PREJOIN_BUTTONS
-        : PREMEETING_BUTTONS;
+        : PREMEETING_BUTTONS).filter(b => !(hiddenPremeetingButtons || []).includes(b));
+
     const { premeetingBackground } = state['features/dynamic-branding'];
 
     return {
-        _buttons: premeetingButtons.filter(b => !hideButtons.includes(b)),
+        // For keeping backwards compat.: if we pass an empty hiddenPremeetingButtons
+        // array through external api, we have all prejoin buttons present on premeeting
+        // screen regardless of passed values into toolbarButtons config overwrite.
+        // If hiddenPremeetingButtons is missing, we hide the buttons according to
+        // toolbarButtons config overwrite.
+        _buttons: hiddenPremeetingButtons
+            ? premeetingButtons
+            : premeetingButtons.filter(b => isToolbarButtonEnabled(b, toolbarButtons)),
         _premeetingBackground: premeetingBackground
     };
 }
diff --git a/react/features/toolbox/components/web/Toolbox.js b/react/features/toolbox/components/web/Toolbox.js
index 49f68613c..4fd1d8709 100644
--- a/react/features/toolbox/components/web/Toolbox.js
+++ b/react/features/toolbox/components/web/Toolbox.js
@@ -1430,14 +1430,7 @@ function _mapStateToProps(state, ownProps) {
         }
     }
 
-    let { toolbarButtons } = ownProps;
-    const stateToolbarButtons = getToolbarButtons(state);
-
-    if (toolbarButtons) {
-        toolbarButtons = toolbarButtons.filter(name => isToolbarButtonEnabled(name, stateToolbarButtons));
-    } else {
-        toolbarButtons = stateToolbarButtons;
-    }
+    const toolbarButtons = ownProps.toolbarButtons || getToolbarButtons(state);
 
     return {
         _backgroundType: state['features/virtual-background'].backgroundType,