refactor: Updates in Certificates

Author: ChrisChV

src/CourseAuthoringRoutes.jsx

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

src/certificates/Certificates.test.jsx

@@ -9,12 +9,17 @@ import { fetchCertificates } from './data/thunks';
 import { certificatesDataMock } from './__mocks__';
 import Certificates from './Certificates';
 import messages from './messages';
+import { CourseAuthoringProvider } from '@src/CourseAuthoringContext';
 
 let axiosMock;
 let store;
 const courseId = 'course-123';
 
-const renderComponent = (props) => render(<Certificates courseId={courseId} {...props} />);
+const renderComponent = (props) => render(
+  <CourseAuthoringProvider courseId={courseId}>
+    <Certificates {...props} />
+  </CourseAuthoringProvider>
+);
 
 describe('Certificates', () => {
   beforeEach(async () => {

src/certificates/Certificates.jsx src/certificates/Certificates.tsxsrc/certificates/Certificates.jsx renamed to src/certificates/Certificates.tsx

@@ -1,6 +1,6 @@
 import { Helmet } from 'react-helmet';
-import PropTypes from 'prop-types';
 
+import { useCourseAuthoringContext } from '@src/CourseAuthoringContext';
 import Placeholder from '../editors/Placeholder';
 import { RequestStatus } from '../data/constants';
 import Loading from '../generic/Loading';
@@ -21,7 +21,8 @@ const MODE_COMPONENTS = {
   [MODE_STATES.editAll]: CertificateEditForm,
 };
 
-const Certificates = ({ courseId }) => {
+const Certificates = () => {
+  const { courseId } = useCourseAuthoringContext();
   const {
     certificates, componentMode, isLoading, loadingStatus, pageHeadTitle, hasCertificateModes,
   } = useCertificates({ courseId });
@@ -50,8 +51,4 @@ const Certificates = ({ courseId }) => {
   );
 };
 
-Certificates.propTypes = {
-  courseId: PropTypes.string.isRequired,
-};
-
 export default Certificates;