fix: Runtime config support for feature flags

This makes sure the following feature flags work with dynamic runtime configuration: * ENABLE_NEW_EDITOR_PAGES * ENABLE_UNIT_PAGE * ENABLE_VIDEO_UPLOAD_PAGE_LINK_IN_CONTENT_DROPDOWN * ENABLE_TAGGING_TAXONOMY_PAGES We also remove flags from the `.env*` files that are no longer in use.
eduNEXT · Feb 6, 2024 · 4850302 · 4850302
1 parent 815ddbe
commit 4850302
Show file tree

Hide file tree

Showing 8 changed files with 32 additions and 22 deletions.
diff --git a/.env b/.env
@@ -32,11 +32,9 @@ ENABLE_ACCESSIBILITY_PAGE=false
 ENABLE_PROGRESS_GRAPH_SETTINGS=false
 ENABLE_TEAM_TYPE_SETTING=false
 ENABLE_NEW_EDITOR_PAGES=true
-ENABLE_NEW_COURSE_OUTLINE_PAGE = false
-ENABLE_NEW_VIDEO_UPLOAD_PAGE = false
-ENABLE_UNIT_PAGE = false
-ENABLE_VIDEO_UPLOAD_PAGE_LINK_IN_CONTENT_DROPDOWN = false
-ENABLE_TAGGING_TAXONOMY_PAGES = false
+ENABLE_UNIT_PAGE=false
+ENABLE_VIDEO_UPLOAD_PAGE_LINK_IN_CONTENT_DROPDOWN=false
+ENABLE_TAGGING_TAXONOMY_PAGES=false
 BBB_LEARN_MORE_URL=''
 HOTJAR_APP_ID=''
 HOTJAR_VERSION=6

diff --git a/.env.development b/.env.development
@@ -33,9 +33,9 @@ ENABLE_ACCESSIBILITY_PAGE=false
 ENABLE_PROGRESS_GRAPH_SETTINGS=false
 ENABLE_TEAM_TYPE_SETTING=false
 ENABLE_NEW_EDITOR_PAGES=true
-ENABLE_NEW_VIDEO_UPLOAD_PAGE = false
-ENABLE_VIDEO_UPLOAD_PAGE_LINK_IN_CONTENT_DROPDOWN = false
-ENABLE_TAGGING_TAXONOMY_PAGES = true
+ENABLE_UNIT_PAGE=false
+ENABLE_VIDEO_UPLOAD_PAGE_LINK_IN_CONTENT_DROPDOWN=false
+ENABLE_TAGGING_TAXONOMY_PAGES=true
 BBB_LEARN_MORE_URL=''
 HOTJAR_APP_ID=''
 HOTJAR_VERSION=6

diff --git a/.env.test b/.env.test
@@ -30,10 +30,8 @@ USER_INFO_COOKIE_NAME='edx-user-info'
 ENABLE_PROGRESS_GRAPH_SETTINGS=false
 ENABLE_TEAM_TYPE_SETTING=false
 ENABLE_NEW_EDITOR_PAGES=true
-ENABLE_NEW_COURSE_OUTLINE_PAGE = true
-ENABLE_NEW_VIDEO_UPLOAD_PAGE = true
-ENABLE_UNIT_PAGE = true
-ENABLE_VIDEO_UPLOAD_PAGE_LINK_IN_CONTENT_DROPDOWN = true
-ENABLE_TAGGING_TAXONOMY_PAGES = true
+ENABLE_UNIT_PAGE=true
+ENABLE_VIDEO_UPLOAD_PAGE_LINK_IN_CONTENT_DROPDOWN=true
+ENABLE_TAGGING_TAXONOMY_PAGES=true
 BBB_LEARN_MORE_URL=''
 INVITE_STUDENTS_EMAIL_TO="[email protected]"
diff --git a/src/CourseAuthoringRoutes.jsx b/src/CourseAuthoringRoutes.jsx
@@ -2,6 +2,7 @@ import React from 'react';
 import {
   Navigate, Routes, Route, useParams,
 } from 'react-router-dom';
+import { getConfig } from '@edx/frontend-platform';
 import { PageWrap } from '@edx/frontend-platform/react';
 import CourseAuthoringPage from './CourseAuthoringPage';
 import { PagesAndResources } from './pages-and-resources';
@@ -55,7 +56,7 @@ const CourseAuthoringRoutes = () => {
         />
         <Route
           path="videos"
-          element={process.env.ENABLE_VIDEO_UPLOAD_PAGE_LINK_IN_CONTENT_DROPDOWN === 'true' ? <PageWrap><VideosPage courseId={courseId} /></PageWrap> : null}
+          element={getConfig().ENABLE_VIDEO_UPLOAD_PAGE_LINK_IN_CONTENT_DROPDOWN === 'true' ? <PageWrap><VideosPage courseId={courseId} /></PageWrap> : null}
         />
         <Route
           path="pages-and-resources/*"
@@ -75,11 +76,11 @@ const CourseAuthoringRoutes = () => {
         />
         <Route
           path="editor/course-videos/:blockId"
-          element={process.env.ENABLE_NEW_EDITOR_PAGES === 'true' ? <PageWrap><VideoSelectorContainer courseId={courseId} /></PageWrap> : null}
+          element={getConfig().ENABLE_NEW_EDITOR_PAGES === 'true' ? <PageWrap><VideoSelectorContainer courseId={courseId} /></PageWrap> : null}
         />
         <Route
           path="editor/:blockType/:blockId?"
-          element={process.env.ENABLE_NEW_EDITOR_PAGES === 'true' ? <PageWrap><EditorContainer courseId={courseId} /></PageWrap> : null}
+          element={getConfig().ENABLE_NEW_EDITOR_PAGES === 'true' ? <PageWrap><EditorContainer courseId={courseId} /></PageWrap> : null}
         />
         <Route
           path="settings/details"

diff --git a/src/course-outline/hooks.jsx b/src/course-outline/hooks.jsx
@@ -99,15 +99,15 @@ const useCourseOutline = ({ courseId }) => {
   };
 
   const getUnitUrl = (locator) => {
-    if (process.env.ENABLE_UNIT_PAGE === 'true') {
+    if (getConfig().ENABLE_UNIT_PAGE === 'true') {
       return `/course/container/${locator}`;
     }
     return `${getConfig().STUDIO_BASE_URL}/container/${locator}`;
   };
 
   const openUnitPage = (locator) => {
     const url = getUnitUrl(locator);
-    if (process.env.ENABLE_UNIT_PAGE === 'true') {
+    if (getConfig().ENABLE_UNIT_PAGE === 'true') {
       navigate(url);
     } else {
       window.location.assign(url);

diff --git a/src/header/utils.js b/src/header/utils.js
@@ -1,3 +1,4 @@
+import { getConfig } from '@edx/frontend-platform';
 import { getPagePath } from '../utils';
 import messages from './messages';
 
@@ -20,7 +21,7 @@ export const getContentMenuItems = ({ studioBaseUrl, courseId, intl }) => {
       title: intl.formatMessage(messages['header.links.filesAndUploads']),
     },
   ];
-  if (process.env.ENABLE_VIDEO_UPLOAD_PAGE_LINK_IN_CONTENT_DROPDOWN === 'true') {
+  if (getConfig().ENABLE_VIDEO_UPLOAD_PAGE_LINK_IN_CONTENT_DROPDOWN === 'true') {
     items.push({
       href: `${studioBaseUrl}/videos/${courseId}`,
       title: intl.formatMessage(messages['header.links.videoUploads']),

diff --git a/src/header/utils.test.js b/src/header/utils.test.js
@@ -1,3 +1,4 @@
+import { getConfig, setConfig } from '@edx/frontend-platform';
 import { getContentMenuItems } from './utils';
 
 const props = {
@@ -11,11 +12,18 @@ const props = {
 describe('header utils', () => {
   describe('getContentMenuItems', () => {
     it('should include Video Uploads option', () => {
+      setConfig({
+        ...getConfig(),
+        ENABLE_VIDEO_UPLOAD_PAGE_LINK_IN_CONTENT_DROPDOWN: 'true',
+      });
       const actualItems = getContentMenuItems(props);
       expect(actualItems).toHaveLength(5);
     });
     it('should not include Video Uploads option', () => {
-      process.env.ENABLE_VIDEO_UPLOAD_PAGE_LINK_IN_CONTENT_DROPDOWN = 'false';
+      setConfig({
+        ...getConfig(),
+        ENABLE_VIDEO_UPLOAD_PAGE_LINK_IN_CONTENT_DROPDOWN: 'false',
+      });
       const actualItems = getContentMenuItems(props);
       expect(actualItems).toHaveLength(4);
     });

diff --git a/src/index.jsx b/src/index.jsx
@@ -53,7 +53,7 @@ const App = () => {
         <Route path="/home" element={<StudioHome />} />
         <Route path="/course/:courseId/*" element={<CourseAuthoringRoutes />} />
         <Route path="/course_rerun/:courseId" element={<CourseRerun />} />
-        {process.env.ENABLE_TAGGING_TAXONOMY_PAGES === 'true' && (
+        {getConfig().ENABLE_TAGGING_TAXONOMY_PAGES === 'true' && (
           <>
             {/* TODO: remove this redirect once Studio's link is updated */}
             <Route path="/taxonomy-list" element={<Navigate to="/taxonomies" />} />
@@ -114,8 +114,12 @@ initialize({
         STUDIO_SHORT_NAME: process.env.STUDIO_SHORT_NAME || null,
         TERMS_OF_SERVICE_URL: process.env.TERMS_OF_SERVICE_URL || null,
         PRIVACY_POLICY_URL: process.env.PRIVACY_POLICY_URL || null,
-        SHOW_ACCESSIBILITY_PAGE: process.env.SHOW_ACCESSIBILITY_PAGE || false,
+        SHOW_ACCESSIBILITY_PAGE: process.env.SHOW_ACCESSIBILITY_PAGE || 'false',
         NOTIFICATION_FEEDBACK_URL: process.env.NOTIFICATION_FEEDBACK_URL || null,
+        ENABLE_NEW_EDITOR_PAGES: process.env.ENABLE_NEW_EDITOR_PAGES || 'false',
+        ENABLE_UNIT_PAGE: process.env.ENABLE_UNIT_PAGE || 'false',
+        ENABLE_VIDEO_UPLOAD_PAGE_LINK_IN_CONTENT_DROPDOWN: process.env.ENABLE_VIDEO_UPLOAD_PAGE_LINK_IN_CONTENT_DROPDOWN || 'false',
+        ENABLE_TAGGING_TAXONOMY_PAGES: process.env.ENABLE_TAGGING_TAXONOMY_PAGES || 'false',
       }, 'CourseAuthoringConfig');
     },
   },