refactor: added environment variable for email channel

.env

@@ -13,6 +13,7 @@ LOGIN_URL=''
 LOGO_TRADEMARK_URL=''
 LOGO_URL=''
 LOGO_WHITE_URL=''
+SHOW_EMAIL_CHANNEL=''
 LOGOUT_URL=''
 MARKETING_SITE_BASE_URL=''
 NODE_ENV=''

.env.development

@@ -29,6 +29,7 @@ ENABLE_COPPA_COMPLIANCE=''
 ENABLE_ACCOUNT_DELETION=''
 ENABLE_DOB_UPDATE=''
 MARKETING_EMAILS_OPT_IN=''
+SHOW_EMAIL_CHANNEL=''
 APP_ID=
 MFE_CONFIG_API_URL=
 PASSWORD_RESET_SUPPORT_LINK='mailto:support@example.com'

.env.test

@@ -26,6 +26,7 @@ SUPPORT_URL='http://localhost:18000/support'
 USER_INFO_COOKIE_NAME='edx-user-info'
 ENABLE_COPPA_COMPLIANCE=''
 ENABLE_ACCOUNT_DELETION=''
+SHOW_EMAIL_CHANNEL=''
 ENABLE_DOB_UPDATE=''
 MARKETING_EMAILS_OPT_IN=''
 APP_ID=

src/index.jsx

@@ -65,6 +65,7 @@ initialize({
         SUPPORT_URL: process.env.SUPPORT_URL,
         ENABLE_DEMOGRAPHICS_COLLECTION: (process.env.ENABLE_DEMOGRAPHICS_COLLECTION || false),
         DEMOGRAPHICS_BASE_URL: process.env.DEMOGRAPHICS_BASE_URL,
+        SHOW_EMAIL_CHANNEL: process.env.SHOW_EMAIL_CHANNEL || false,
         ENABLE_COPPA_COMPLIANCE: (process.env.ENABLE_COPPA_COMPLIANCE || false),
         ENABLE_ACCOUNT_DELETION: (process.env.ENABLE_ACCOUNT_DELETION !== 'false'),
         ENABLE_DOB_UPDATE: (process.env.ENABLE_DOB_UPDATE || false),

src/notification-preferences/NotificationPreferenceColumn.jsx

@@ -1,5 +1,6 @@
 import React, { useCallback } from 'react';
 import PropTypes from 'prop-types';
+import { getConfig } from '@edx/frontend-platform';
 import classNames from 'classnames';
 import { useDispatch, useSelector } from 'react-redux';
 import { useIntl } from '@edx/frontend-platform/i18n';
@@ -25,6 +26,7 @@ const NotificationPreferenceColumn = ({ appId, channel, appPreference }) => {
   const nonEditable = useSelector(selectNonEditablePreferences(appId));
   const updatePreferencesStatus = useSelector(selectUpdatePreferencesStatus());
   const mobileView = useIsOnMobile();
+  const showEmailChannel = getConfig().SHOW_EMAIL_CHANNEL;
 
   const onChannelToggle = useCallback((event) => {
     const { id: notificationChannel } = event.target;
@@ -82,24 +84,25 @@ const NotificationPreferenceColumn = ({ appId, channel, appPreference }) => {
     </div>
   );
 
-  return (
-    <div className={classNames('d-flex flex-column', { 'border-right': channel !== 'email' })}>
-      <NavItem
-        id={channel}
-        key={channel}
-        role="button"
-        onClick={onChannelToggle}
-        className={classNames('mb-3 header-label column-padding', {
-          'pr-0': channel === 'email',
-          'pl-0': channel === 'web' && mobileView,
-        })}
-      >
-        {intl.formatMessage(messages.notificationChannel, { text: channel })}
-      </NavItem>
-      {appPreference
-        ? renderPreference(appPreference)
-        : appPreferences.map((preference) => (renderPreference(preference)))}
-    </div>
+  return ((showEmailChannel === 'true' || channel === 'web') && (
+  <div className={classNames('d-flex flex-column', { 'border-right': channel !== 'email' && showEmailChannel === 'true' })}>
+    <NavItem
+      id={channel}
+      key={channel}
+      role="button"
+      onClick={onChannelToggle}
+      className={classNames('mb-3 header-label column-padding', {
+        'pr-0': channel === 'email',
+        'pl-0': channel === 'web' && mobileView,
+      })}
+    >
+      {intl.formatMessage(messages.notificationChannel, { text: channel })}
+    </NavItem>
+    {appPreference
+      ? renderPreference(appPreference)
+      : appPreferences.map((preference) => (renderPreference(preference)))}
+  </div>
+  )
   );
 };