feat: Add certificate status component to the new progress page (#415)

Much of the logic is copied from the course exit certificate states.
AA-719

src/courseware/course/course-exit/CourseCelebration.jsx

@@ -26,6 +26,7 @@ import DashboardFootnote from './DashboardFootnote';
 import UpgradeFootnote from './UpgradeFootnote';
 import SocialIcons from '../../social-share/SocialIcons';
 import { logClick, logVisit } from './utils';
+import { DashboardLink, IdVerificationSupportLink, ProfileLink } from '../../../shared/links';
 import CourseRecommendations from './CourseRecommendationsExp/CourseRecommendations.exp';
 
 const LINKEDIN_BLUE = '#2867B2';
@@ -65,35 +66,11 @@ function CourseCelebration({ intl }) {
   const [showWS1681, setShowWS1681] = useState(window.experiment__courseware_celebration_bShowWS1681);
   useEffect(() => { setShowWS1681(window.experiment__courseware_celebration_bShowWS1681); });
 
-  const { administrator, username } = getAuthenticatedUser();
+  const { administrator } = getAuthenticatedUser();
 
-  const dashboardLink = (
-    <Hyperlink
-      className="text-gray-700"
-      style={{ textDecoration: 'underline' }}
-      destination={`${getConfig().LMS_BASE_URL}/dashboard`}
-    >
-      {intl.formatMessage(messages.dashboardLink)}
-    </Hyperlink>
-  );
-  const idVerificationSupportLink = getConfig().SUPPORT_URL_ID_VERIFICATION && (
-    <Hyperlink
-      className="text-gray-700"
-      style={{ textDecoration: 'underline' }}
-      destination={getConfig().SUPPORT_URL_ID_VERIFICATION}
-    >
-      {intl.formatMessage(messages.idVerificationSupportLink)}
-    </Hyperlink>
-  );
-  const profileLink = (
-    <Hyperlink
-      className="text-gray-700"
-      style={{ textDecoration: 'underline' }}
-      destination={`${getConfig().LMS_BASE_URL}/u/${username}`}
-    >
-      {intl.formatMessage(messages.profileLink)}
-    </Hyperlink>
-  );
+  const dashboardLink = <DashboardLink />;
+  const idVerificationSupportLink = <IdVerificationSupportLink />;
+  const profileLink = <ProfileLink />;
 
   let buttonPrefix = null;
   let buttonLocation;

src/courseware/course/course-exit/CourseExit.jsx

@@ -12,9 +12,25 @@ import CourseNonPassing from './CourseNonPassing';
 import { COURSE_EXIT_MODES, getCourseExitMode } from './utils';
 import messages from './messages';
 
+import { useModel } from '../../../generic/model-store';
+
 function CourseExit({ intl }) {
   const { courseId } = useSelector(state => state.courseware);
-  const mode = getCourseExitMode(courseId);
+  const {
+    certificateData,
+    hasScheduledContent,
+    isEnrolled,
+    userHasPassingGrade,
+    courseExitPageIsActive,
+  } = useModel('coursewareMeta', courseId);
+
+  const mode = getCourseExitMode(
+    certificateData,
+    hasScheduledContent,
+    isEnrolled,
+    userHasPassingGrade,
+    courseExitPageIsActive,
+  );
 
   let body = null;
   if (mode === COURSE_EXIT_MODES.nonPassing) {

src/courseware/course/course-exit/utils.js

@@ -1,9 +1,8 @@
 import { sendTrackEvent } from '@edx/frontend-platform/analytics';
 import { getAuthenticatedUser } from '@edx/frontend-platform/auth';
 
-import { useModel } from '../../../generic/model-store';
-
 import messages from './messages';
+import { useModel } from '../../../generic/model-store';
 
 const COURSE_EXIT_MODES = {
   disabled: 0,
@@ -26,18 +25,16 @@ const NON_CERTIFICATE_STATUSES = [ // no certificate will be given, though a val
   'honor_passing', // provided when honor is configured to not give a certificate
 ];
 
-function getCourseExitMode(courseId) {
-  const {
-    certificateData,
-    courseExitPageIsActive,
-    hasScheduledContent,
-    isEnrolled,
-    userHasPassingGrade,
-  } = useModel('coursewareMeta', courseId);
-
+function getCourseExitMode(
+  certificateData,
+  hasScheduledContent,
+  isEnrolled,
+  userHasPassingGrade,
+  courseExitPageIsActive = null,
+) {
   const authenticatedUser = getAuthenticatedUser();
 
-  if (!courseExitPageIsActive || !authenticatedUser || !isEnrolled) {
+  if (courseExitPageIsActive === false || !authenticatedUser || !isEnrolled) {
     return COURSE_EXIT_MODES.disabled;
   }
 
@@ -69,7 +66,20 @@ function getCourseExitMode(courseId) {
 
 // Returns null in order to render the default navigation text
 function getCourseExitNavigation(courseId, intl) {
-  const exitMode = getCourseExitMode(courseId);
+  const {
+    certificateData,
+    hasScheduledContent,
+    isEnrolled,
+    userHasPassingGrade,
+    courseExitPageIsActive,
+  } = useModel('coursewareMeta', courseId);
+  const exitMode = getCourseExitMode(
+    certificateData,
+    hasScheduledContent,
+    isEnrolled,
+    userHasPassingGrade,
+    courseExitPageIsActive,
+  );
   const exitActive = exitMode !== COURSE_EXIT_MODES.disabled;
 
   let exitText;