Configs for themes in `Display Settings`: hide themes options, hide custom themes, specific list of themes (#7173)

* Add configuration to enable or disable choosing themes in Display Settings. Only for Licensed servers.

* Add configuration to enable or disable choosing custom themes in Display Settings. Only for Licensed servers.

* Add configuration to enable or disable a specific list of themes to choose in Display Settings. Only for Licensed servers.

* Added config value and logic for "DefaultTheme"

* Fix problem with undefined values when the server is not licensed

1 files changed, 13 insertions, 6 deletions

diff --git a/webapp/components/user_settings/user_settings_display.jsx b/webapp/components/user_settings/user_settings_display.jsx
index 74a939994..f10b29900 100644
--- a/webapp/components/user_settings/user_settings_display.jsx
+++ b/webapp/components/user_settings/user_settings_display.jsx
@@ -595,6 +595,18 @@ export default class UserSettingsDisplay extends React.Component {
             );
         }
 
+        let themeSection;
+        if (global.mm_config.EnableThemeSelection !== 'false') {
+            themeSection = (
+                <ThemeSetting
+                    selected={this.props.activeSection === 'theme'}
+                    updateSection={this.updateSection}
+                    setRequireConfirm={this.props.setRequireConfirm}
+                    setEnforceFocus={this.props.setEnforceFocus}
+                />
+            );
+        }
+
         return (
             <div>
                 <div className='modal-header'>
@@ -632,12 +644,7 @@ export default class UserSettingsDisplay extends React.Component {
                         />
                     </h3>
                     <div className='divider-dark first'/>
-                    <ThemeSetting
-                        selected={this.props.activeSection === 'theme'}
-                        updateSection={this.updateSection}
-                        setRequireConfirm={this.props.setRequireConfirm}
-                        setEnforceFocus={this.props.setEnforceFocus}
-                    />
+                    {themeSection}
                     <div className='divider-dark'/>
                     {clockSection}
                     <div className='divider-dark'/>