chore: update with latest master

Author: bradenmacdonald

.env

@@ -34,6 +34,7 @@ ENABLE_UNIT_PAGE=false
 ENABLE_ASSETS_PAGE=false
 ENABLE_VIDEO_UPLOAD_PAGE_LINK_IN_CONTENT_DROPDOWN=false
 ENABLE_TAGGING_TAXONOMY_PAGES=true
+ENABLE_CERTIFICATE_PAGE=true
 BBB_LEARN_MORE_URL=''
 HOTJAR_APP_ID=''
 HOTJAR_VERSION=6

.env.development

@@ -35,6 +35,7 @@ ENABLE_TEAM_TYPE_SETTING=false
 ENABLE_UNIT_PAGE=false
 ENABLE_ASSETS_PAGE=false
 ENABLE_VIDEO_UPLOAD_PAGE_LINK_IN_CONTENT_DROPDOWN=true
+ENABLE_CERTIFICATE_PAGE=true
 ENABLE_NEW_VIDEO_UPLOAD_PAGE=true
 ENABLE_TAGGING_TAXONOMY_PAGES=true
 BBB_LEARN_MORE_URL=''

.env.test

@@ -31,6 +31,7 @@ ENABLE_TEAM_TYPE_SETTING=false
 ENABLE_UNIT_PAGE=true
 ENABLE_ASSETS_PAGE=false
 ENABLE_VIDEO_UPLOAD_PAGE_LINK_IN_CONTENT_DROPDOWN=true
+ENABLE_CERTIFICATE_PAGE=true
 ENABLE_TAGGING_TAXONOMY_PAGES=true
 BBB_LEARN_MORE_URL=''
 INVITE_STUDENTS_EMAIL_TO="[email protected]"

.github/workflows/validate.yml

@@ -9,13 +9,16 @@ on:
 jobs:
   tests:
     runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        node: [18, 20]
+    continue-on-error: ${{ matrix.node == 20 }}
+
     steps:
     - uses: actions/checkout@v4
-    - name: Setup Nodejs Env
-      run: echo "NODE_VER=`cat .nvmrc`" >> $GITHUB_ENV
-    - uses: actions/setup-node@v3
+    - uses: actions/setup-node@v4
       with:
-        node-version: ${{ env.NODE_VER }}
+        node-version: ${{ matrix.node }}
     - run: make validate.ci
     - name: Upload coverage
       uses: codecov/codecov-action@v4

src/CourseAuthoringRoutes.jsx

@@ -124,7 +124,7 @@ const CourseAuthoringRoutes = () => {
         />
         <Route
           path="certificates"
-          element={<PageWrap><Certificates courseId={courseId} /></PageWrap>}
+          element={getConfig().ENABLE_CERTIFICATE_PAGE === 'true' ? <PageWrap><Certificates courseId={courseId} /></PageWrap> : null}
         />
         <Route
           path="textbooks"

src/generic/processing-notification/index.jsx

@@ -5,8 +5,6 @@ import { Badge, Icon } from '@openedx/paragon';
 import { Settings as IconSettings } from '@openedx/paragon/icons';
 import { capitalize } from 'lodash';
 
-import { NOTIFICATION_MESSAGES } from '../../constants';
-
 const ProcessingNotification = ({ isShow, title }) => (
   <Badge
     className={classNames('processing-notification', {
@@ -24,7 +22,7 @@ const ProcessingNotification = ({ isShow, title }) => (
 
 ProcessingNotification.propTypes = {
   isShow: PropTypes.bool.isRequired,
-  title: PropTypes.oneOf(Object.values(NOTIFICATION_MESSAGES)).isRequired,
+  title: PropTypes.string.isRequired,
 };
 
 export default ProcessingNotification;

src/generic/toast-context/index.test.tsx

@@ -50,6 +50,7 @@ describe('<ToastProvider />', () => {
       },
     });
     store = initializeStore();
+    jest.useFakeTimers();
   });
 
   afterEach(() => {
@@ -61,6 +62,13 @@ describe('<ToastProvider />', () => {
     expect(await screen.findByText('This is the toast!')).toBeInTheDocument();
   });
 
+  it('should close toast after 5000ms', async () => {
+    render(<RootWrapper><TestComponentToShow /></RootWrapper>);
+    expect(await screen.findByText('This is the toast!')).toBeInTheDocument();
+    jest.advanceTimersByTime(6000);
+    expect(screen.queryByText('This is the toast!')).not.toBeInTheDocument();
+  });
+
   it('should close toast', async () => {
     render(<RootWrapper><TestComponentToClose /></RootWrapper>);
     expect(await screen.findByText('Content')).toBeInTheDocument();

src/generic/toast-context/index.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
-import { Toast } from '@openedx/paragon';
+
+import ProcessingNotification from '../processing-notification';
 
 export interface ToastContextData {
   toastMessage: string | null;
@@ -35,7 +36,13 @@ export const ToastProvider = (props: ToastProviderProps) => {
     setToastMessage(null);
   }, []);
 
-  const showToast = React.useCallback((message) => setToastMessage(message), [setToastMessage]);
+  const showToast = React.useCallback((message) => {
+    setToastMessage(message);
+    // Close the toast after 5 seconds
+    setTimeout(() => {
+      setToastMessage(null);
+    }, 5000);
+  }, [setToastMessage]);
   const closeToast = React.useCallback(() => setToastMessage(null), [setToastMessage]);
 
   const context = React.useMemo(() => ({
@@ -48,9 +55,7 @@ export const ToastProvider = (props: ToastProviderProps) => {
     <ToastContext.Provider value={context}>
       {props.children}
       { toastMessage && (
-        <Toast show={toastMessage !== null} onClose={closeToast}>
-          {toastMessage}
-        </Toast>
+        <ProcessingNotification isShow={toastMessage !== null} title={toastMessage} />
       )}
     </ToastContext.Provider>
   );

src/header/utils.js

@@ -31,32 +31,37 @@ export const getContentMenuItems = ({ studioBaseUrl, courseId, intl }) => {
   return items;
 };
 
-export const getSettingMenuItems = ({ studioBaseUrl, courseId, intl }) => ([
-  {
-    href: `${studioBaseUrl}/settings/details/${courseId}`,
-    title: intl.formatMessage(messages['header.links.scheduleAndDetails']),
-  },
-  {
-    href: `${studioBaseUrl}/settings/grading/${courseId}`,
-    title: intl.formatMessage(messages['header.links.grading']),
-  },
-  {
-    href: `${studioBaseUrl}/course_team/${courseId}`,
-    title: intl.formatMessage(messages['header.links.courseTeam']),
-  },
-  {
-    href: `${studioBaseUrl}/group_configurations/${courseId}`,
-    title: intl.formatMessage(messages['header.links.groupConfigurations']),
-  },
-  {
-    href: `${studioBaseUrl}/settings/advanced/${courseId}`,
-    title: intl.formatMessage(messages['header.links.advancedSettings']),
-  },
-  {
-    href: `${studioBaseUrl}/certificates/${courseId}`,
-    title: intl.formatMessage(messages['header.links.certificates']),
-  },
-]);
+export const getSettingMenuItems = ({ studioBaseUrl, courseId, intl }) => {
+  const items = [
+    {
+      href: `${studioBaseUrl}/settings/details/${courseId}`,
+      title: intl.formatMessage(messages['header.links.scheduleAndDetails']),
+    },
+    {
+      href: `${studioBaseUrl}/settings/grading/${courseId}`,
+      title: intl.formatMessage(messages['header.links.grading']),
+    },
+    {
+      href: `${studioBaseUrl}/course_team/${courseId}`,
+      title: intl.formatMessage(messages['header.links.courseTeam']),
+    },
+    {
+      href: `${studioBaseUrl}/group_configurations/${courseId}`,
+      title: intl.formatMessage(messages['header.links.groupConfigurations']),
+    },
+    {
+      href: `${studioBaseUrl}/settings/advanced/${courseId}`,
+      title: intl.formatMessage(messages['header.links.advancedSettings']),
+    },
+  ];
+  if (getConfig().ENABLE_CERTIFICATE_PAGE === 'true') {
+    items.push({
+      href: `${studioBaseUrl}/certificates/${courseId}`,
+      title: intl.formatMessage(messages['header.links.certificates']),
+    });
+  }
+  return items;
+};
 
 export const getToolsMenuItems = ({ studioBaseUrl, courseId, intl }) => ([
   {

src/header/utils.test.js

@@ -1,5 +1,5 @@
 import { getConfig, setConfig } from '@edx/frontend-platform';
-import { getContentMenuItems, getToolsMenuItems } from './utils';
+import { getContentMenuItems, getToolsMenuItems, getSettingMenuItems } from './utils';
 
 const props = {
   studioBaseUrl: 'UrLSTuiO',
@@ -29,6 +29,25 @@ describe('header utils', () => {
     });
   });
 
+  describe('getSettingsMenuitems', () => {
+    it('should include certificates option', () => {
+      setConfig({
+        ...getConfig(),
+        ENABLE_CERTIFICATE_PAGE: 'true',
+      });
+      const actualItems = getSettingMenuItems(props);
+      expect(actualItems).toHaveLength(6);
+    });
+    it('should not include certificates option', () => {
+      setConfig({
+        ...getConfig(),
+        ENABLE_CERTIFICATE_PAGE: 'false',
+      });
+      const actualItems = getSettingMenuItems(props);
+      expect(actualItems).toHaveLength(5);
+    });
+  });
+
   describe('getToolsMenuItems', () => {
     it('should include export tags option', () => {
       setConfig({