feat: Add a new setting to remove individual sharing features from UI (#8660)

* Added new config to enable individual sharing features

* make config values url friendly

* Add new setting to whitelist

* Fixed some linter issues

* Fixed more linter issues

* Fixed merge error

* Check if interfaceConfig is defined

* Only show more numbers link if there is more than one number

interface_config.js

@@ -168,6 +168,13 @@ var interfaceConfig = {
     REMOTE_THUMBNAIL_RATIO: 1, // 1:1
 
     SETTINGS_SECTIONS: [ 'devices', 'language', 'moderator', 'profile', 'calendar' ],
+
+    /**
+     * Specify which sharing features should be displayed. If the value is not set
+     * all sharing features will be shown. You can set [] to disable all.
+     */
+    // SHARING_FEATURES: ['email', 'url', 'dial-in', 'embed'],
+
     SHOW_BRAND_WATERMARK: false,
 
     /**

react/features/base/config/interfaceConfigWhitelist.js

@@ -43,6 +43,7 @@ export default [
     'RECENT_LIST_ENABLED',
     'REMOTE_THUMBNAIL_RATIO',
     'SETTINGS_SECTIONS',
+    'SHARING_FEATURES',
     'SHOW_CHROME_EXTENSION_BANNER',
     'SHOW_DEEP_LINKING_IMAGE',
     'SHOW_POWERED_BY',

react/features/base/premeeting/components/web/PreMeetingScreen.js

@@ -4,6 +4,7 @@ import React, { PureComponent } from 'react';
 
 import { AudioSettingsButton, VideoSettingsButton } from '../../../../toolbox/components/web';
 import { Avatar } from '../../../avatar';
+import { allowUrlSharing } from '../../functions';
 
 import ConnectionStatus from './ConnectionStatus';
 import CopyMeetingUrl from './CopyMeetingUrl';
@@ -79,6 +80,7 @@ export default class PreMeetingScreen extends PureComponent<Props> {
      */
     render() {
         const { name, showAvatar, showConferenceInfo, title, videoMuted, videoTrack } = this.props;
+        const showSharingButton = allowUrlSharing();
 
         return (
             <div
@@ -103,7 +105,7 @@ export default class PreMeetingScreen extends PureComponent<Props> {
                             <div className = 'title'>
                                 { title }
                             </div>
-                            <CopyMeetingUrl />
+                            {showSharingButton ? <CopyMeetingUrl /> : null}
                         </>
                     )}
                     { this.props.children }

react/features/base/premeeting/functions.js

@@ -4,6 +4,8 @@ import { findIndex } from 'lodash';
 
 import { CONNECTION_TYPE } from './constants';
 
+declare var interfaceConfig: Object;
+
 const LOSS_AUDIO_THRESHOLDS = [ 0.33, 0.05 ];
 const LOSS_VIDEO_THRESHOLDS = [ 0.33, 0.1, 0.05 ];
 
@@ -211,3 +213,14 @@ export function getConnectionData(state: Object) {
         connectionDetails: []
     };
 }
+
+/**
+ * Returns if url sharing is enabled in interface configuration.
+ *
+ * @returns {boolean}
+ */
+export function allowUrlSharing() {
+    return typeof interfaceConfig === 'undefined'
+        || typeof interfaceConfig.SHARING_FEATURES === 'undefined'
+        || (interfaceConfig.SHARING_FEATURES.length && interfaceConfig.SHARING_FEATURES.indexOf('url') > -1);
+}

react/features/invite/components/add-people-dialog/web/AddPeopleDialog.js

@@ -12,7 +12,14 @@ import { isVpaasMeeting } from '../../../../billing-counter/functions';
 import EmbedMeetingTrigger from '../../../../embed-meeting/components/EmbedMeetingTrigger';
 import { getActiveSession } from '../../../../recording';
 import { updateDialInNumbers } from '../../../actions';
-import { _getDefaultPhoneNumber, getInviteText, isAddPeopleEnabled, isDialOutEnabled } from '../../../functions';
+import {
+    _getDefaultPhoneNumber,
+    getInviteText,
+    isAddPeopleEnabled,
+    isDialOutEnabled,
+    sharingFeatures,
+    isSharingEnabled
+} from '../../../functions';
 
 import CopyMeetingLinkSection from './CopyMeetingLinkSection';
 import DialInSection from './DialInSection';
@@ -34,6 +41,21 @@ type Props = {
      */
     _embedMeetingVisible: boolean,
 
+    /**
+     * Whether or not dial in number should be visible.
+     */
+    _dialInVisible: boolean,
+
+    /**
+     * Whether or not url sharing button should be visible.
+     */
+    _urlSharingVisible: boolean,
+
+    /**
+     * Whether or not email sharing features should be visible.
+     */
+    _emailSharingVisible: boolean,
+
     /**
      * The meeting invitation text.
      */
@@ -78,6 +100,9 @@ type Props = {
 function AddPeopleDialog({
     _dialIn,
     _embedMeetingVisible,
+    _dialInVisible,
+    _urlSharingVisible,
+    _emailSharingVisible,
     _invitationText,
     _inviteContactsVisible,
     _inviteUrl,
@@ -123,10 +148,14 @@ function AddPeopleDialog({
             width = { 'small' }>
             <div className = 'invite-more-dialog'>
                 { _inviteContactsVisible && <InviteContactsSection /> }
-                <CopyMeetingLinkSection url = { _inviteUrl } />
-                <InviteByEmailSection
+                {_urlSharingVisible ? <CopyMeetingLinkSection url = { _inviteUrl } /> : null}
+                {
+                    _emailSharingVisible
+                        ? <InviteByEmailSection
                             inviteSubject = { inviteSubject }
                             inviteText = { _invitationText } />
+                        : null
+                }
                 { _embedMeetingVisible && <EmbedMeetingTrigger /> }
                 <div className = 'invite-more-dialog separator' />
                 {
@@ -134,7 +163,8 @@ function AddPeopleDialog({
                         && <LiveStreamSection liveStreamViewURL = { _liveStreamViewURL } />
                 }
                 {
-                    _dialIn.numbers
+                    _phoneNumber
+                        && _dialInVisible
                         && <DialInSection phoneNumber = { _phoneNumber } />
                 }
             </div>
@@ -163,7 +193,10 @@ function mapStateToProps(state, ownProps) {
 
     return {
         _dialIn: dialIn,
-        _embedMeetingVisible: !isVpaasMeeting(state),
+        _embedMeetingVisible: !isVpaasMeeting(state) && isSharingEnabled(sharingFeatures.embed),
+        _dialInVisible: isSharingEnabled(sharingFeatures.dialIn),
+        _urlSharingVisible: isSharingEnabled(sharingFeatures.url),
+        _emailSharingVisible: isSharingEnabled(sharingFeatures.email),
         _invitationText: getInviteText({ state,
             phoneNumber,
             t: ownProps.t }),

react/features/invite/components/add-people-dialog/web/DialInSection.js

@@ -51,13 +51,13 @@ function DialInSection({
             <DialInNumber
                 conferenceID = { _dialIn.conferenceID }
                 phoneNumber = { phoneNumber } />
-            <a
+            {_dialIn.numbers && _dialIn.numbers.length > 1 ? <a
                 className = 'more-numbers'
                 href = { _dialInfoPageUrl }
                 rel = 'noopener noreferrer'
                 target = '_blank'>
                 { t('info.moreNumbers') }
-            </a>
+            </a> : null}
         </div>
     );
 }

react/features/invite/functions.js

@@ -720,3 +720,22 @@ export async function executeDialOutStatusRequest(url: string, reqId: string) {
 
     return res.ok ? json : Promise.reject(json);
 }
+
+export const sharingFeatures = {
+    email: 'email',
+    url: 'url',
+    dialIn: 'dial-in',
+    embed: 'embed'
+};
+
+/**
+ * Returns true if a specific sharing feature is enabled in interface configuration.
+ *
+ * @param {string} sharingFeature - The sharing feature to check.
+ * @returns {boolean}
+ */
+export function isSharingEnabled(sharingFeature: string) {
+    return typeof interfaceConfig === 'undefined'
+        || typeof interfaceConfig.SHARING_FEATURES === 'undefined'
+        || (interfaceConfig.SHARING_FEATURES.length && interfaceConfig.SHARING_FEATURES.indexOf(sharingFeature) > -1);
+}