diff --git a/src/course-home/outline-tab/OutlineTab.test.jsx b/src/course-home/outline-tab/OutlineTab.test.jsx index f9485421..f6b45b3c 100644 --- a/src/course-home/outline-tab/OutlineTab.test.jsx +++ b/src/course-home/outline-tab/OutlineTab.test.jsx @@ -748,7 +748,8 @@ describe('Outline Tab', () => { ], }); await fetchAndRender(); - expect(screen.queryByText('Congratulations! Your certificate is ready.')).not.toBeInTheDocument(); + expect(screen.queryByText('Congratulations! Your certificate is ready.')).toBeInTheDocument(); + expect(screen.queryByRole('link', { name: 'Download my certificate' })).toBeInTheDocument(); }); }); diff --git a/src/course-home/outline-tab/alerts/certificate-status-alert/CertificateStatusAlert.jsx b/src/course-home/outline-tab/alerts/certificate-status-alert/CertificateStatusAlert.jsx index 8063eaa8..ea993e18 100644 --- a/src/course-home/outline-tab/alerts/certificate-status-alert/CertificateStatusAlert.jsx +++ b/src/course-home/outline-tab/alerts/certificate-status-alert/CertificateStatusAlert.jsx @@ -23,6 +23,7 @@ function CertificateStatusAlert({ intl, payload }) { certStatusType, courseEndDate, certURL, + isWebCert, userTimezone, } = payload; @@ -35,6 +36,7 @@ function CertificateStatusAlert({ intl, payload }) { let body = ''; let buttonVisible = false; let buttonMessage = ''; + if (certStatusType === CERT_STATUS_TYPE.EARNED_NOT_AVAILABLE) { const timezoneFormatArgs = userTimezone ? { timeZone: userTimezone } : {}; const certificateAvailableDateFormatted = ; @@ -57,13 +59,17 @@ function CertificateStatusAlert({ intl, payload }) { ); } else if (certStatusType === CERT_STATUS_TYPE.DOWNLOADABLE) { header = intl.formatMessage(certMessages.certStatusDownloadableHeader); - buttonMessage = intl.formatMessage(certStatusMessages.viewableButton); + if (isWebCert) { + buttonMessage = intl.formatMessage(certStatusMessages.viewableButton); + } else { + buttonMessage = intl.formatMessage(certStatusMessages.downloadableButton); + } buttonVisible = true; } return (
-
+
{header} {body} @@ -90,6 +96,7 @@ CertificateStatusAlert.propTypes = { certStatusType: PropTypes.string, courseEndDate: PropTypes.string, certURL: PropTypes.string, + isWebCert: PropTypes.bool, userTimezone: PropTypes.string, }).isRequired, }; diff --git a/src/course-home/outline-tab/alerts/certificate-status-alert/hooks.js b/src/course-home/outline-tab/alerts/certificate-status-alert/hooks.js index 7764fc70..99c6b241 100644 --- a/src/course-home/outline-tab/alerts/certificate-status-alert/hooks.js +++ b/src/course-home/outline-tab/alerts/certificate-status-alert/hooks.js @@ -41,20 +41,26 @@ function useCertificateStatusAlert(courseId) { const endBlock = courseDateBlocks.find(b => b.dateType === 'course-end-date'); const certStatusType = verifyCertStatusType(certStatus); - const certURL = `${getConfig().LMS_BASE_URL}${certWebViewUrl}`; - const hasCertStatus = certStatusType !== ''; const isWebCert = downloadUrl === null; - // only show if there is a known cert status that we want to alert on. - // TODO Temporarily only show this for WebCertificates while we update the messaging - // in follow on work MICROBA-678 - const isVisible = isEnrolled && hasCertStatus && isWebCert; + let certURL = ''; + if (certWebViewUrl) { + certURL = `${getConfig().LMS_BASE_URL}${certWebViewUrl}`; + } else if (downloadUrl) { + // PDF Certificate + certURL = downloadUrl; + } + const hasCertStatus = certStatusType !== ''; + + // Only show if there is a known cert status that we want provide status on. + const isVisible = isEnrolled && hasCertStatus; const payload = { certificateAvailableDate, certURL, certStatusType, courseEndDate: endBlock && endBlock.date, userTimezone, + isWebCert, }; useAlert(isVisible, {