\n {children}\n
\n \n {topicMessages.map(message => {\n const AlertComponent = getAlertComponent(message.code);\n return (\n \n remove(message.id)}\n payload={message.payload}\n {...customProps}\n >\n {message.text}\n \n \n );\n })}\n
\n );\n}\n\nAlertList.propTypes = {\n className: PropTypes.string,\n topic: PropTypes.string,\n customAlerts: PropTypes.objectOf(\n PropTypes.oneOfType([\n PropTypes.object,\n PropTypes.func,\n PropTypes.node,\n ]),\n ),\n // eslint-disable-next-line react/forbid-prop-types\n customProps: PropTypes.object,\n};\n\nAlertList.defaultProps = {\n topic: null,\n className: null,\n customAlerts: {},\n customProps: {},\n};\n","/* eslint-disable import/prefer-default-export */\nimport { useContext, useEffect } from 'react';\nimport UserMessagesContext from './UserMessagesContext';\n\nexport function useAlert(isVisible, {\n code, text, topic, type, payload, dismissible,\n}) {\n const { add, remove } = useContext(UserMessagesContext);\n\n // Please note:\n // The deps list [isVisible, code, ... etc.] in this `useEffect` call prevents the\n // effect from running if none of deps have changed. However, \"changed\" for objects is\n // defined in terms of identity; thus, if you provide a payload that is *seemingly* equal\n // to the previous one but *actually* a different object, then this effect will run.\n // If you are particularly unlucky, this will cause an infinite re-render loop.\n // This manifested itself in TNL-7400.\n // We hope to address the underlying issue in TNL-7418.\n // In the mean time, you may follow the pattern that `useAccessExpirationAlert`\n // establishes: memoize the payload so that the exact same object is used if the\n // payload has not changed. And don't put values based off of now() in your payload, as\n // that breaks memoization.\n useEffect(() => {\n if (!isVisible) {\n return undefined;\n }\n\n const cleanupId = add({\n code, text, topic, type, payload, dismissible,\n });\n\n return () => {\n remove(cleanupId);\n };\n }, [isVisible, code, text, topic, type, payload, dismissible]);\n}\n","// Helper, that is used to forcibly finalize all promises\n// in thunk before running matcher against state.\nexport const executeThunk = async (thunk, dispatch, getState) => {\n await thunk(dispatch, getState);\n await new Promise(setImmediate);\n};\n\n// Utility function for appending the browser timezone to the url\n// Can be used on the backend when the user timezone is not set in the user account\nexport const appendBrowserTimezoneToUrl = (url) => {\n const browserTimezone = Intl.DateTimeFormat().resolvedOptions().timeZone;\n const urlObject = new URL(url);\n if (browserTimezone) {\n urlObject.searchParams.append('browser_timezone', browserTimezone);\n }\n return urlObject.href;\n};\n","import { defineMessages } from '@edx/frontend-platform/i18n';\n\nconst messages = defineMessages({\n certStatusEarnedNotAvailableHeader: {\n id: 'cert.alert.earned.unavailable.header',\n defaultMessage: 'Your grade and certificate will be ready soon!',\n description: 'Header alerting the user that their certificate will be available soon.',\n },\n certStatusDownloadableHeader: {\n id: 'cert.alert.earned.ready.header',\n defaultMessage: 'Congratulations! Your certificate is ready.',\n description: 'Header alerting the user that their certificate is ready.',\n },\n certStatusNotPassingHeader: {\n id: 'cert.alert.notPassing.header',\n defaultMessage: 'You are not eligible for a certificate',\n },\n certStatusNotPassingButton: {\n id: 'cert.alert.notPassing.button',\n defaultMessage: 'View grades',\n },\n});\n\nexport default messages;\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport {\n FormattedDate,\n FormattedMessage,\n injectIntl,\n intlShape,\n} from '@edx/frontend-platform/i18n';\nimport { Alert, Button } from '@edx/paragon';\nimport { useDispatch } from 'react-redux';\n\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faCheckCircle, faExclamationTriangle } from '@fortawesome/free-solid-svg-icons';\nimport { getConfig } from '@edx/frontend-platform';\nimport { sendTrackEvent } from '@edx/frontend-platform/analytics';\nimport { getAuthenticatedUser } from '@edx/frontend-platform/auth';\nimport certMessages from './messages';\nimport certStatusMessages from '../../../progress-tab/certificate-status/messages';\nimport { requestCert } from '../../../data/thunks';\n\nexport const CERT_STATUS_TYPE = {\n EARNED_NOT_AVAILABLE: 'earned_but_not_available',\n DOWNLOADABLE: 'downloadable',\n REQUESTING: 'requesting',\n UNVERIFIED: 'unverified',\n};\n\nfunction CertificateStatusAlert({ intl, payload }) {\n const dispatch = useDispatch();\n const {\n certificateAvailableDate,\n certStatus,\n courseEndDate,\n courseId,\n certURL,\n isWebCert,\n userTimezone,\n org,\n notPassingCourseEnded,\n tabs,\n } = payload;\n\n // eslint-disable-next-line react/prop-types\n const AlertWrapper = (props) => props.children(props);\n\n const sendAlertClickTracking = (id) => {\n const { administrator } = getAuthenticatedUser();\n sendTrackEvent(id, {\n org_key: org,\n courserun_key: courseId,\n is_staff: administrator,\n });\n };\n\n const renderCertAwardedStatus = () => {\n const alertProps = {\n variant: 'success',\n icon: faCheckCircle,\n iconClassName: 'alert-icon text-success-500',\n };\n if (certStatus === CERT_STATUS_TYPE.EARNED_NOT_AVAILABLE) {\n const timezoneFormatArgs = userTimezone ? { timeZone: userTimezone } : {};\n const certificateAvailableDateFormatted = \n
\n
\n \n {header} \n {body}\n
\n {buttonVisible && (\n \n {\n if (buttonAction) { buttonAction(); }\n }}\n >\n {buttonMessage}\n \n
\n )}\n \n
\n {/** [MM-P2P] Experiment (conditional) */}\n { showMMP2P ? (\n \n
\n \n
\n ) : (\n \n
\n \n Last chance to upgrade\n
\n \n You are still eligible to upgrade to a Verified Certificate!\n Unlock full course access and highlight the knowledge you'll gain.\n
\n \n {}}\n className=\"description-link\"\n >\n {dateBlock.linkText}\n \n )}\n
\n )}\n \n {linkedTitle && (\n
\n {dateBlock.description && (\n \n {dateBlock.title}\n
\n )}\n {!linkedTitle && (\n {dateBlock.title}
\n )}\n {dateBlock.description}
\n )}\n {!linkedTitle && dateBlock.link && (\n {intl.formatMessage(messages.dates)}
\n- \n {courseDateBlocks.map((courseDateBlock) => (\n
\n
\n \n
\n {intl.formatMessage(messages.welcomeTo)} {title}
\n\n { selectGoalHandler(event); }}\n >\n {intl.formatMessage(messages.goalUnsure)}\n \n
\n \n {goalOptions.map((goal) => {\n const [goalKey, goalText] = goal;\n return (\n (goalKey !== 'unsure') && (\n
\n \n { selectGoalHandler(event); }}\n >\n {goalText}\n \n
\n )\n );\n })}\n {intl.formatMessage(messages.handouts)}
\n{intl.formatMessage(messages.revision)}
\n {courseRevision}\n{intl.formatMessage(messages.tools)}
\n- \n {courseTools.map((courseTool) => (\n
- \n logClick(courseTool.analyticsId)}>\n
\n {courseTool.title}\n \n \n ))}\n
\n
\n \n
\n {due && (\n \n {complete ? (\n
\n \n {displayTitle}\n \n , {intl.formatMessage(complete ? messages.completedAssignment : messages.incompleteAssignment)}\n \n
\n \n \n
\n )}\n \n
\n );\n\n return (\n \n {complete ? (\n
\n \n {title}\n \n , {intl.formatMessage(complete ? messages.completedSection : messages.incompleteSection)}\n \n {badgeProgress ? (\n <>\n {badgeProgressUrl && (\n \n \n \n )}\n \n ) : (\n <>\n )}\n
\n - \n {sequenceIds.map((sequenceId, index) => (\n
\n
\n \n \n
\n \n \n \n {selectedGoal.text}\n \n \n {goalOptions.map(([goalKey, goalText]) => (\n { selectGoalHandler(event); }}\n role=\"button\"\n >\n {goalText}\n \n ))}\n \n \n
\n - \n
- \n
\n \n - \n
\n \n
- \n
- \n
\n \n - \n
\n \n - \n
\n \n - \n
\n \n
\n
\n );\n}\n\nUpsellFBESoonCardContent.propTypes = {\n accessExpirationDate: PropTypes.PropTypes.instanceOf(Date).isRequired,\n timezoneFormatArgs: PropTypes.shape({\n timeZone: PropTypes.string,\n }),\n};\n\nUpsellFBESoonCardContent.defaultProps = {\n timezoneFormatArgs: {},\n};\n\nfunction ExpirationCountdown({ hoursToExpiration, setupgradeNotificationCurrentState, type }) {\n let expirationText;\n if (hoursToExpiration >= 24) {\n // setupgradeNotificationCurrentState is available in NotificationTray (not course home)\n if (setupgradeNotificationCurrentState) {\n if (type === 'access') {\n setupgradeNotificationCurrentState('accessDaysLeft');\n setLocalStorage('upgradeNotificationCurrentState', 'accessDaysLeft');\n }\n if (type === 'offer') {\n setupgradeNotificationCurrentState('FPDdaysLeft');\n setLocalStorage('upgradeNotificationCurrentState', 'FPDdaysLeft');\n }\n }\n expirationText = (\n \n
\n
{expirationText}
);\n}\n\nExpirationCountdown.propTypes = {\n hoursToExpiration: PropTypes.number.isRequired,\n setupgradeNotificationCurrentState: PropTypes.func,\n type: PropTypes.string,\n};\nExpirationCountdown.defaultProps = {\n setupgradeNotificationCurrentState: null,\n type: null,\n};\n\nfunction AccessExpirationDateBanner({ accessExpirationDate, timezoneFormatArgs, setupgradeNotificationCurrentState }) {\n if (setupgradeNotificationCurrentState) {\n setupgradeNotificationCurrentState('accessDateView');\n setLocalStorage('upgradeNotificationCurrentState', 'accessDateView');\n }\n return (\n \n
\n );\n}\n\nAccessExpirationDateBanner.propTypes = {\n accessExpirationDate: PropTypes.PropTypes.instanceOf(Date).isRequired,\n timezoneFormatArgs: PropTypes.shape({\n timeZone: PropTypes.string,\n }),\n setupgradeNotificationCurrentState: PropTypes.func,\n};\n\nAccessExpirationDateBanner.defaultProps = {\n timezoneFormatArgs: {},\n setupgradeNotificationCurrentState: null,\n};\n\nfunction UpgradeNotification({\n accessExpiration,\n contentTypeGatingEnabled,\n courseId,\n offer,\n org,\n setupgradeNotificationCurrentState,\n shouldDisplayBorder,\n timeOffsetMillis,\n upsellPageName,\n userTimezone,\n verifiedMode,\n}) {\n const timezoneFormatArgs = userTimezone ? { timeZone: userTimezone } : {};\n const correctedTime = new Date(Date.now() + timeOffsetMillis);\n\n if (!verifiedMode) {\n return null;\n }\n\n const eventProperties = {\n org_key: org,\n courserun_key: courseId,\n };\n\n const promotionEventProperties = {\n creative: 'sidebarupsell',\n name: 'In-Course Verification Prompt',\n position: 'sidebar-message',\n promotion_id: 'courseware_verified_certificate_upsell',\n ...eventProperties,\n };\n\n useEffect(() => {\n sendTrackingLogEvent('edx.bi.course.upgrade.sidebarupsell.displayed', eventProperties);\n sendTrackEvent('Promotion Viewed', promotionEventProperties);\n }, []);\n\n const logClick = () => {\n sendTrackingLogEvent('edx.bi.course.upgrade.sidebarupsell.clicked', eventProperties);\n sendTrackingLogEvent('edx.course.enrollment.upgrade.clicked', {\n ...eventProperties,\n location: 'sidebar-message',\n });\n sendTrackEvent('Promotion Clicked', promotionEventProperties);\n sendTrackEvent('edx.bi.ecommerce.upsell_links_clicked', {\n ...eventProperties,\n linkCategory: 'green_upgrade',\n linkName: `${upsellPageName}_green`,\n linkType: 'button',\n pageName: upsellPageName,\n });\n };\n\n /*\n There are 4 parts that change in the upgrade card:\n upgradeNotificationHeaderText\n expirationBanner\n upsellMessage\n offerCode\n */\n let upgradeNotificationHeaderText;\n let expirationBanner;\n let upsellMessage;\n let offerCode;\n\n if (!!accessExpiration && !!contentTypeGatingEnabled) {\n const accessExpirationDate = new Date(accessExpiration.expirationDate);\n const hoursToAccessExpiration = Math.floor((accessExpirationDate - correctedTime) / 1000 / 60 / 60);\n\n if (hoursToAccessExpiration >= (7 * 24)) {\n if (offer) { // countdown to the first purchase discount if there is one\n const hoursToDiscountExpiration = Math.floor((new Date(offer.expirationDate) - correctedTime) / 1000 / 60 / 60);\n upgradeNotificationHeaderText = (\n \n {offer.code}),\n }}\n />\n
\n );\n }\n\n return (\n \n {upgradeNotificationHeaderText}\n
\n {expirationBanner}\n\n {upsellMessage}\n
\n \n
\n {offerCode}\n {intl.formatMessage(messages.proctoringInfoPanel)}
\n\n {readableStatus && (\n <>\n
\n \n {intl.formatMessage(messages.proctoringCurrentStatus)} {intl.formatMessage(messages[`${readableStatus}ProctoringStatus`])}\n
\n\n {intl.formatMessage(messages[`${readableStatus}ProctoringMessage`])}\n
\n\n {readableStatus === readableStatuses.otherCourseApproved && intl.formatMessage(messages[`${readableStatus}ProctoringDetail`])}\n
\n \n )}\n {![readableStatuses.verified, readableStatuses.otherCourseApproved].includes(readableStatus) && (\n <>\n\n {isNotYetSubmitted(status) && (\n intl.formatMessage(messages.proctoringPanelGeneralInfo)\n )}\n {!isNotYetSubmitted(status) && (\n intl.formatMessage(messages.proctoringPanelGeneralInfoSubmitted)\n )}\n
\n{intl.formatMessage(messages.proctoringPanelGeneralTime)}
\n \n )}\n {isNotYetSubmitted(status) && (\n onboardingExamButton\n )}\n \n\n
\n );\n\n const button = (\n \n {message}\n
\n );\n\n if (!showCheck && showSpinner) {\n bodyContent = (\n \n {message}\n
\n );\n }\n\n if (showCheck && !showSpinner) {\n bodyContent = (\n \n {message}\n
\n );\n }\n return bodyContent;\n };\n\n return (\n \n \n \n {this.renderSrMessage()}\n \n
\n \n );\n }\n}\n\nPageLoading.propTypes = {\n srMessage: PropTypes.node.isRequired,\n};\n","import React, { Suspense } from 'react';\n\nimport { ModalLayer } from '@edx/paragon';\n\nimport PageLoading from '../../generic/PageLoading';\n\nconst BlockModalContent = React.lazy(() => import('./BlockModalContent'));\n\nexport const BlockModal = () => (\n \n { !isStatic && (\n
\n );\n};\nFlyover.propTypes = {\n isStatic: PropTypes.bool,\n options: PropTypes.shape({\n access: PropTypes.shape({\n isAudit: PropTypes.bool.isRequired,\n }),\n flyover: PropTypes.shape({\n toggle: PropTypes.func.isRequired,\n }),\n state: PropTypes.shape({\n afterUpgradeDeadline: PropTypes.bool.isRequired,\n }),\n }),\n};\n\nFlyover.defaultProps = {\n isStatic: false,\n options: {\n access: {\n isAudit: false,\n },\n flyover: {\n toggle: () => {},\n },\n state: {\n afterUpgradeDeadline: false,\n },\n },\n};\n\nexport default Flyover;\n","/* eslint-disable no-use-before-define */\nimport React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faChevronLeft } from '@fortawesome/free-solid-svg-icons';\n\nimport Sidecard from './Sidecard';\n\nexport const FlyoverMobile = ({ options }) => {\n const {\n access: { isAudit },\n flyover: { toggle },\n state: { afterUpgradeDeadline },\n } = options;\n\n const handleReturnSpanKeyPress = (event) => {\n if (event.key === 'Enter') {\n toggle();\n }\n };\n\n if (!isAudit || afterUpgradeDeadline) {\n return null;\n }\n\n return (\n \n Notifications\n \n \n
\n )}\n \n
\n );\n};\nFlyoverMobile.propTypes = {\n options: PropTypes.shape({\n access: PropTypes.shape({\n isAudit: PropTypes.bool.isRequired,\n }),\n flyover: PropTypes.shape({\n toggle: PropTypes.func.isRequired,\n }),\n state: PropTypes.shape({\n afterUpgradeDeadline: PropTypes.bool.isRequired,\n }),\n }),\n};\n\nFlyoverMobile.defaultProps = {\n options: {\n access: {\n isAudit: false,\n },\n flyover: {\n toggle: () => {},\n },\n state: {\n afterUpgradeDeadline: false,\n },\n },\n};\n\nexport default FlyoverMobile;\n","/* eslint-disable no-use-before-define */\nimport React from 'react';\n\nconst FlyoverTriggerIcon = () => (\n \n \n
\n \n \n Notifications\n \n
\n \n
\n \n
\n {/** [MM-P2P] Experiment (className for optimizely trigger) */}\n \n
\n {resumeCourseUrl && (\n {title}
\n \n \n
\n )}\n \n
\n \n );\n}\n\nOutlineTab.propTypes = {\n intl: intlShape.isRequired,\n};\n\nexport default injectIntl(OutlineTab);\n","export default __webpack_public_path__ + \"ee56f6ef2f1c80ed0cc1129259d6a3cd.gif\";","export default __webpack_public_path__ + \"ed041dea7f493a5345ac6702cf7972cf.gif\";","import { defineMessages } from '@edx/frontend-platform/i18n';\n\nconst messages = defineMessages({\n applyForCredit: {\n id: 'courseExit.programs.applyForCredit',\n defaultMessage: 'Apply for credit',\n description: 'Button for the learner to apply for course credit',\n },\n certificateHeaderDownloadable: {\n id: 'courseCelebration.certificateHeader.downloadable',\n defaultMessage: 'Your certificate is available!',\n description: 'Text displayed when course certificate is ready to be downloaded',\n },\n certificateHeaderNotAvailable: {\n id: 'courseCelebration.certificateHeader.notAvailable',\n defaultMessage: 'Your grade and certificate will be ready soon!',\n description: 'Header displayed when course certificate is not yet available to be viewed',\n },\n certificateNotAvailableBodyAccessCert: {\n id: 'courseCelebration.certificateBody.notAvailable.accessCertificate',\n defaultMessage: 'If you have earned a passing grade, your certificate will be automatically issued.',\n description: 'Text displayed when course certificate is not yet available to be viewed',\n },\n certificateHeaderUnverified: {\n id: 'courseCelebration.certificateHeader.unverified',\n defaultMessage: 'You must complete verification to receive your certificate.',\n description: 'Text displayed when a user has not verified their identity and cannot view their course certificate',\n },\n certificateHeaderRequestable: {\n id: 'courseCelebration.certificateHeader.requestable',\n defaultMessage: 'Congratulations, you qualified for a certificate!',\n description: 'Text displayed when a user has completed the course and can request a certificate',\n },\n certificateHeaderUpgradable: {\n id: 'courseCelebration.certificateHeader.upgradable',\n defaultMessage: 'Upgrade to pursue a verified certificate',\n },\n certificateImage: {\n id: 'courseCelebration.certificateImage',\n defaultMessage: 'Sample certificate',\n description: 'Alt text used to describe an image of a certificate',\n },\n completedCourseHeader: {\n id: 'courseCelebration.completedCourseHeader',\n defaultMessage: 'You have completed your course.',\n },\n congratulationsHeader: {\n id: 'courseCelebration.congratulationsHeader',\n defaultMessage: 'Congratulations!',\n },\n congratulationsImage: {\n id: 'courseCelebration.congratulationsImage',\n defaultMessage: 'Four people raising their hands in celebration',\n description: 'Alt text used to describe celebratory image',\n },\n courseInProgressDescription: {\n id: 'courseExit.courseInProgressDescription',\n defaultMessage: 'It looks like there is more content in this course that will be released in the future. Look out for email updates or check back on your course for when this content will be available.',\n },\n courseInProgressHeader: {\n id: 'courseExit.courseInProgressHeader',\n defaultMessage: 'More content is coming soon!',\n },\n dashboardLink: {\n id: 'courseExit.dashboardLink',\n defaultMessage: 'Dashboard',\n description: 'Link to user’s dashboard',\n },\n downloadButton: {\n id: 'courseCelebration.downloadButton',\n defaultMessage: 'Download my certificate',\n description: 'Button to download the course certificate',\n },\n endOfCourseDescription: {\n id: 'courseExit.endOfCourseDescription',\n defaultMessage: 'Unfortunately, you are not currently eligible for a certificate. You need to receive a passing grade to be eligible for a certificate.',\n },\n endOfCourseHeader: {\n id: 'courseExit.endOfCourseHeader',\n defaultMessage: 'You’ve reached the end of the course!',\n },\n endOfCourseTitle: {\n id: 'courseExit.endOfCourseTitle',\n defaultMessage: 'End of Course',\n },\n idVerificationSupportLink: {\n id: 'courseExit.idVerificationSupportLink',\n defaultMessage: 'Learn more about ID verification',\n description: 'Link to an article about identity verification',\n },\n linkedinAddToProfileButton: {\n id: 'courseCelebration.linkedinAddToProfileButton',\n defaultMessage: 'Add to LinkedIn profile',\n description: 'Button to add certificate information to the user’s LinkedIn profile',\n },\n microBachelorsLearnMore: {\n id: 'courseExit.programs.microBachelors.learnMore',\n defaultMessage: 'Learn more about how your MicroBachelors credential can be applied for credit.',\n },\n microMastersLearnMore: {\n id: 'courseExit.programs.microMasters.learnMore',\n defaultMessage: 'Learn more about the process of applying MicroMasters certificates to Master’s degrees.',\n },\n microMastersMessage: {\n id: 'courseExit.programs.microMasters.mastersMessage',\n defaultMessage: 'If you’re interested in using your MicroMasters certificate towards a Master’s program, you can get started today!',\n },\n nextButtonComplete: {\n id: 'learn.sequence.navigation.complete.button', // for historical reasons\n defaultMessage: 'Complete the course',\n },\n nextButtonEnd: {\n id: 'courseExit.nextButton.endOfCourse',\n defaultMessage: 'Next (end of course)',\n },\n profileLink: {\n id: 'courseExit.profileLink',\n defaultMessage: 'Profile',\n description: 'Link to user’s profile',\n },\n programsLastCourseHeader: {\n id: 'courseExit.programs.lastCourse',\n defaultMessage: 'You have completed the last course in {title}!',\n },\n requestCertificateBodyText: {\n id: 'courseCelebration.requestCertificateBodyText',\n defaultMessage: 'In order to access your certificate, request it below.',\n },\n requestCertificateButton: {\n id: 'courseCelebration.requestCertificateButton',\n defaultMessage: 'Request certificate',\n description: 'Button to request the course certificate',\n },\n searchOurCatalogLink: {\n id: 'courseExit.searchOurCatalogLink',\n defaultMessage: 'Search our catalog',\n description: 'First part of a sentence that continues afterward',\n },\n shareMessage: {\n id: 'courseCelebration.shareMessage',\n defaultMessage: 'Share your success on social media or email.',\n },\n socialMessage: {\n id: 'courseExit.social.shareCompletionMessage',\n defaultMessage: 'I just completed {title} with {platform}!',\n description: 'Shown when sharing course progress on a social network',\n },\n upgradeButton: {\n id: 'courseExit.upgradeButton',\n defaultMessage: 'Upgrade now',\n },\n upgradeLink: {\n id: 'courseExit.upgradeLink',\n defaultMessage: 'upgrade now',\n },\n verificationPending: {\n id: 'courseCelebration.verificationPending',\n defaultMessage: 'Your ID verification is pending and your certificate will be available once approved.',\n },\n verifiedCertificateSupportLink: {\n id: 'courseExit.verifiedCertificateSupportLink',\n defaultMessage: 'Learn more about verified certificates',\n },\n verifyIdentityButton: {\n id: 'courseCelebration.verifyIdentityButton',\n defaultMessage: 'Verify ID now',\n description: 'Button to verify the identify of the user',\n },\n viewCertificateButton: {\n id: 'courseCelebration.viewCertificateButton',\n defaultMessage: 'View my certificate',\n description: 'Button to view the course certificate',\n },\n viewCourseScheduleButton: {\n id: 'courseExit.viewCourseScheduleButton',\n defaultMessage: 'View course schedule',\n description: 'Button to view the course schedule',\n },\n viewCoursesButton: {\n id: 'courseExit.viewCoursesButton',\n defaultMessage: 'View my courses',\n description: 'Button to redirect user to their course dashboard',\n },\n viewGradesButton: {\n id: 'courseExit.viewGradesButton',\n defaultMessage: 'View grades',\n },\n\n});\n\nexport default messages;\n","import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { getConfig } from '@edx/frontend-platform';\nimport { FormattedMessage, injectIntl, intlShape } from '@edx/frontend-platform/i18n';\nimport { Alert, Button, Hyperlink } from '@edx/paragon';\nimport certImage from '../../../generic/assets/edX_certificate.png';\nimport messages from './messages';\n\n/**\n * Note for Open edX developers:\n * There are pieces of this component that are hard-coded and specific to edX that may not apply to your organization.\n * This includes mentions of our edX program types (MicroMasters, MicroBachelors, Professional Certificate, and\n * XSeries), along with their respective support article URLs and image variable names.\n *\n * Currently, this component will not render unless the learner's completed course has a related program of one of the\n * four aforementioned types. This will not impact the parent components (i.e. CourseCelebration will render normally).\n */\n\nconst programTypes = ['microbachelors', 'micromasters', 'professional-certificate', 'xseries'];\n\nfunction ProgramCompletion({\n intl,\n progress,\n title,\n type,\n url,\n}) {\n if (!programTypes.includes(type) || progress.notStarted !== 0 || progress.inProgress !== 0) {\n return null;\n }\n\n const programLink = (\n \n
\n \n { /** [MM-P2P] Experiment (the conditional) */ }\n { !MMP2P.state.isEnabled\n && (\n { setCourseGoalToDisplay(newGoal); }}\n setGoalToastHeader={(newHeader) => { setGoalToastHeader(newHeader); }}\n />\n )}\n
\n {rootCourseId && (\n \n
\n \n \n
\n - \n {courses[rootCourseId].sectionIds.map((sectionId) => (\n
\n { setCourseGoalToDisplay(newGoal); }}\n setGoalToastHeader={(newHeader) => { setGoalToastHeader(newHeader); }}\n />\n )}\n
\n )}\n \n
\n \n
\n {intl.formatMessage(messages.programsLastCourseHeader, { title })}
\n \n
\n
\n {intl.formatMessage(messages.microMastersMessage)}\n {' '}\n
\n
\n \n
\n );\n}\n\nFootnote.propTypes = {\n icon: PropTypes.shape({}).isRequired,\n text: PropTypes.node.isRequired,\n};\n\nexport default Footnote;\n","import { sendTrackEvent } from '@edx/frontend-platform/analytics';\nimport { getAuthenticatedUser } from '@edx/frontend-platform/auth';\n\nimport messages from './messages';\nimport { useModel } from '../../../generic/model-store';\n\nconst COURSE_EXIT_MODES = {\n disabled: 0,\n celebration: 1,\n nonPassing: 2,\n inProgress: 3,\n};\n\n// These are taken from the edx-platform `get_cert_data` function found in lms/courseware/views/views.py\nconst CELEBRATION_STATUSES = [\n 'audit_passing',\n 'downloadable',\n 'earned_but_not_available',\n 'honor_passing',\n 'requesting',\n 'unverified',\n];\nconst NON_CERTIFICATE_STATUSES = [ // no certificate will be given, though a valid certificateData block is provided\n 'audit_passing',\n 'honor_passing', // provided when honor is configured to not give a certificate\n];\n\nfunction getCourseExitMode(\n certificateData,\n hasScheduledContent,\n isEnrolled,\n userHasPassingGrade,\n courseExitPageIsActive = null,\n) {\n const authenticatedUser = getAuthenticatedUser();\n\n if (courseExitPageIsActive === false || !authenticatedUser || !isEnrolled) {\n return COURSE_EXIT_MODES.disabled;\n }\n\n // Set defaults for our status-calculated variables, used when no certificateData is provided.\n // This happens when `get_cert_data` in edx-platform returns None, which it does if we are\n // in a certificate-earning mode, but the certificate is not available (maybe they didn't pass\n // or course is not set up for certificates or something). Audit users will always have a\n // certificateData sent over.\n let isCelebratoryStatus = true;\n let isEligibleForCertificate = true;\n\n if (certificateData) {\n const { certStatus } = certificateData;\n isCelebratoryStatus = CELEBRATION_STATUSES.indexOf(certStatus) !== -1;\n isEligibleForCertificate = NON_CERTIFICATE_STATUSES.indexOf(certStatus) === -1;\n }\n\n if (hasScheduledContent && !userHasPassingGrade) {\n return COURSE_EXIT_MODES.inProgress;\n }\n if (isEligibleForCertificate && !userHasPassingGrade) {\n return COURSE_EXIT_MODES.nonPassing;\n }\n if (isCelebratoryStatus) {\n return COURSE_EXIT_MODES.celebration;\n }\n return COURSE_EXIT_MODES.disabled;\n}\n\n// Returns null in order to render the default navigation text\nfunction getCourseExitNavigation(courseId, intl) {\n const {\n certificateData,\n hasScheduledContent,\n isEnrolled,\n userHasPassingGrade,\n courseExitPageIsActive,\n } = useModel('coursewareMeta', courseId);\n const exitMode = getCourseExitMode(\n certificateData,\n hasScheduledContent,\n isEnrolled,\n userHasPassingGrade,\n courseExitPageIsActive,\n );\n const exitActive = exitMode !== COURSE_EXIT_MODES.disabled;\n\n let exitText;\n switch (exitMode) {\n case COURSE_EXIT_MODES.celebration:\n exitText = intl.formatMessage(messages.nextButtonComplete);\n break;\n case COURSE_EXIT_MODES.nonPassing:\n exitText = intl.formatMessage(messages.nextButtonEnd);\n break;\n default:\n exitText = null;\n }\n return { exitActive, exitText };\n}\n\n// Meant to be used as part of a button's onClick handler.\n// For convenience, you can pass a falsy event and it will be ignored.\nconst logClick = (org, courseId, administrator, event, extraProperties) => {\n if (!event) {\n return;\n }\n\n sendTrackEvent(`edx.ui.lms.course_exit.${event}.clicked`, {\n org_key: org,\n courserun_key: courseId,\n is_staff: administrator,\n ...extraProperties,\n });\n};\n\n// Use like the following to call this only once on initial page load:\n// useEffect(() => logVisit(org, courseId, administrator, variant), [org, courseId, administrator, variant]);\n// For convenience, you can pass a falsy variant and it will be ignored.\nconst logVisit = (org, courseId, administrator, variant) => {\n if (!variant) {\n return;\n }\n\n sendTrackEvent('edx.ui.lms.course_exit.visited', {\n org_key: org,\n courserun_key: courseId,\n is_staff: administrator,\n variant,\n });\n};\n\nexport {\n COURSE_EXIT_MODES,\n getCourseExitMode,\n getCourseExitNavigation,\n logClick,\n logVisit,\n};\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport { useSelector } from 'react-redux';\n\nimport { getAuthenticatedUser } from '@edx/frontend-platform/auth';\nimport {\n FormattedMessage, injectIntl, intlShape,\n} from '@edx/frontend-platform/i18n';\nimport { Hyperlink } from '@edx/paragon';\nimport { faCalendarAlt } from '@fortawesome/free-regular-svg-icons';\nimport { getConfig } from '@edx/frontend-platform';\n\nimport { useModel } from '../../../generic/model-store';\n\nimport Footnote from './Footnote';\nimport messages from './messages';\nimport { logClick } from './utils';\n\nfunction DashboardFootnote({ intl, variant }) {\n const { courseId } = useSelector(state => state.courseware);\n const { org } = useModel('coursewareMeta', courseId);\n const { administrator } = getAuthenticatedUser();\n\n const dashboardLink = (\n \n
\n logClick('linkedin')}\n url={`${socialUtmMarketingUrl}&utm_source=linkedin`}\n >\n logClick('twitter')}\n className=\"ml-2\"\n hashtags={hashtags}\n title={socialMessage ? intl.formatMessage(socialMessage, { platform: `@${twitterAccount}`, title }) : ''}\n url={`${socialUtmMarketingUrl}&utm_source=twitter`}\n >\n logClick('facebook')}\n className=\"ml-2\"\n quote={socialMessage ? intl.formatMessage(socialMessage, { platform: getConfig().SITE_NAME, title }) : ''}\n url={`${socialUtmMarketingUrl}&utm_source=facebook`}\n >\n logClick('email')}\n body={emailBody ? `${intl.formatMessage(emailBody)}\\n\\n` : ''}\n className=\"ml-2\"\n subject={emailSubject ? intl.formatMessage(emailSubject, { platform: getConfig().SITE_NAME, title }) : ''}\n url={`${marketingUrl}?${socialUtmCampaign}utm_medium=email&utm_source=email`}\n >\n
\n );\n}\n\nSocialIcons.defaultProps = {\n analyticsId: '',\n className: '',\n emailBody: messages.defaultEmailBody,\n emailSubject: null,\n hashtags: [getConfig().TWITTER_HASHTAG],\n socialMessage: null,\n};\n\nSocialIcons.propTypes = {\n analyticsId: PropTypes.string,\n className: PropTypes.string,\n courseId: PropTypes.string.isRequired,\n emailBody: PropTypes.shape({}),\n emailSubject: PropTypes.shape({}),\n hashtags: PropTypes.arrayOf(PropTypes.string),\n intl: intlShape.isRequired,\n socialMessage: PropTypes.shape({}),\n};\n\nexport default injectIntl(SocialIcons);\n","import React from 'react';\nimport { injectIntl, intlShape } from '@edx/frontend-platform/i18n';\nimport { getAuthenticatedUser } from '@edx/frontend-platform/auth';\nimport { getConfig } from '@edx/frontend-platform';\nimport { Hyperlink } from '@edx/paragon';\n\nimport messages from '../courseware/course/course-exit/messages';\n\nfunction IntlDashboardLink({ intl }) {\n return (\n \n
\n );\n}\n\nCatalogSuggestion.propTypes = {\n intl: intlShape.isRequired,\n variant: PropTypes.string.isRequired,\n};\n\nexport default injectIntl(CatalogSuggestion);\n","import React, { useEffect } from 'react';\nimport { getConfig } from '@edx/frontend-platform';\nimport { sendTrackEvent } from '@edx/frontend-platform/analytics';\nimport { getAuthenticatedUser } from '@edx/frontend-platform/auth';\nimport {\n FormattedMessage, injectIntl, intlShape, defineMessages,\n} from '@edx/frontend-platform/i18n';\nimport { useSelector, useDispatch } from 'react-redux';\nimport {\n Hyperlink, DataTable, CardView, Card,\n} from '@edx/paragon';\nimport PropTypes from 'prop-types';\nimport truncate from 'truncate-html';\nimport { useModel } from '../../../generic/model-store/hooks';\nimport fetchCourseRecommendations from './data/thunks';\nimport { FAILED, LOADED, LOADING } from './data/slice';\nimport CatalogSuggestion from './CatalogSuggestion';\nimport PageLoading from '../../../generic/PageLoading';\nimport { logClick } from './utils';\n\nconst messages = defineMessages({\n recommendationsHeading: {\n id: 'courseCelebration.recommendations.heading',\n description: 'Header for recommendations section of course celebration',\n defaultMessage: 'Keep building your skills with these courses!',\n },\n listJoin: {\n id: 'courseCelebration.recommendations.formatting.list_join',\n description: 'Joining mark or word for a list of items, use the {sp} placeholder to include space before the joining word',\n // eslint-disable-next-line prefer-template\n defaultMessage: ('{style, select, '\n + 'punctuation {, } ' // HACK: select keys must match ListStyles, above, but must be statically coded for extract\n + 'conjunction { {sp}and } ' // HACK: interpolating a space character to get a leading-space here\n + 'other { }}'),\n },\n browseCatalog: {\n id: 'courseCelebration.recommendations.browse_catalog',\n description: 'Link to course catalog in course celebration',\n defaultMessage: 'Explore more courses',\n },\n loadingRecommendations: {\n id: 'courseCelebration.recommendations.loading_recommendations',\n description: 'Screen-reader text for the loading screen for recommendations',\n defaultMessage: 'Loading recommendations',\n },\n});\n\nconst ListStyles = {\n punctuation: 'punctuation',\n conjunction: 'conjunction',\n};\n\nfunction CourseCard({\n original: {\n title,\n image,\n owners,\n marketingUrl,\n onClick,\n },\n intl,\n}) {\n const formatList = (items, style) => (\n items.join(intl.formatMessage(\n messages.listJoin,\n { style, sp: ' ' }, // HACK: there isn't a way to escape a leading space in the format, so pass one in\n ))\n );\n\n const formattedOwners = formatList(\n owners.map(owner => owner.key),\n ListStyles.punctuation,\n intl,\n );\n\n return (\n \n
\n \n {truncate(title, 70, { reserveLastWord: -1 })}\n
\n\n {text => (\n <>\n {text}: \n {truncate(formattedOwners, 40, { reserveLastWord: -1 })}\n \n )}\n \n
\n \n \n {intl.formatMessage(messages.browseCatalog)}\n \n
\n );\n}\n\nCourseRecommendations.propTypes = {\n intl: intlShape.isRequired,\n variant: PropTypes.string.isRequired,\n};\n\nexport default injectIntl(CourseRecommendations);\n","import React, { useEffect } from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faLinkedinIn } from '@fortawesome/free-brands-svg-icons';\n\nimport {\n FormattedDate, FormattedMessage, injectIntl, intlShape,\n} from '@edx/frontend-platform/i18n';\nimport { layoutGenerator } from 'react-break';\nimport { Helmet } from 'react-helmet';\nimport { useDispatch, useSelector } from 'react-redux';\nimport { Alert, Button, Hyperlink } from '@edx/paragon';\nimport { CheckCircle } from '@edx/paragon/icons';\nimport { getConfig } from '@edx/frontend-platform';\nimport { getAuthenticatedUser } from '@edx/frontend-platform/auth';\n\nimport CelebrationMobile from './assets/celebration_456x328.gif';\nimport CelebrationDesktop from './assets/celebration_750x540.gif';\nimport certificate from '../../../generic/assets/edX_certificate.png';\nimport certificateLocked from '../../../generic/assets/edX_locked_certificate.png';\nimport { FormattedPricing } from '../../../generic/upgrade-button';\nimport messages from './messages';\nimport { useModel } from '../../../generic/model-store';\nimport { requestCert } from '../../../course-home/data/thunks';\nimport ProgramCompletion from './ProgramCompletion';\nimport DashboardFootnote from './DashboardFootnote';\nimport UpgradeFootnote from './UpgradeFootnote';\nimport SocialIcons from '../../social-share/SocialIcons';\nimport { logClick, logVisit } from './utils';\nimport { DashboardLink, IdVerificationSupportLink, ProfileLink } from '../../../shared/links';\nimport CourseRecommendations from './CourseRecommendations';\n\nconst LINKEDIN_BLUE = '#2867B2';\n\nfunction CourseCelebration({ intl }) {\n const layout = layoutGenerator({\n mobile: 0,\n tablet: 768,\n });\n\n const OnMobile = layout.is('mobile');\n const OnAtLeastTablet = layout.isAtLeast('tablet');\n\n const { courseId } = useSelector(state => state.courseware);\n const dispatch = useDispatch();\n const {\n certificateData,\n end,\n linkedinAddToProfileUrl,\n marketingUrl,\n offer,\n org,\n relatedPrograms,\n title,\n verifiedMode,\n verifyIdentityUrl,\n verificationStatus,\n } = useModel('coursewareMeta', courseId);\n\n const {\n certStatus,\n certWebViewUrl,\n downloadUrl,\n certificateAvailableDate,\n } = certificateData || {};\n\n const { administrator } = getAuthenticatedUser();\n\n const dashboardLink = {intl.formatMessage(messages.recommendationsHeading)}
\n\n \n
\n \n
\n
\n {intl.formatMessage(messages.certificateNotAvailableBodyAccessCert)}\n
\n \n );\n visitEvent = 'celebration_with_unavailable_cert';\n footnote ={intl.formatMessage(messages.requestCertificateBodyText)}
);\n visitEvent = 'celebration_with_requestable_cert';\n footnote ={intl.formatMessage(messages.verificationPending)}
);\n } else {\n buttonText = intl.formatMessage(messages.verifyIdentityButton);\n buttonEvent = 'verify_id';\n buttonLocation = verifyIdentityUrl;\n // todo: check for idVerificationSupportLink null\n message = (\n\n
\n
\n {getConfig().SUPPORT_URL_VERIFIED_CERTIFICATE && (\n
\n
\n \n );\n}\n\nCourseCelebration.propTypes = {\n intl: intlShape.isRequired,\n};\n\nexport default injectIntl(CourseCelebration);\n","import React, { useEffect } from 'react';\n\nimport { getAuthenticatedUser } from '@edx/frontend-platform/auth';\nimport { injectIntl, intlShape } from '@edx/frontend-platform/i18n';\nimport { Helmet } from 'react-helmet';\nimport { useSelector } from 'react-redux';\nimport { Alert, Button } from '@edx/paragon';\nimport { getConfig } from '@edx/frontend-platform';\n\nimport { useModel } from '../../../generic/model-store';\n\nimport CatalogSuggestion from './CatalogSuggestion';\nimport DashboardFootnote from './DashboardFootnote';\nimport messages from './messages';\nimport { logClick, logVisit } from './utils';\n\nfunction CourseInProgress({ intl }) {\n const { courseId } = useSelector(state => state.courseware);\n const { org, tabs, title } = useModel('coursewareMeta', courseId);\n const { administrator } = getAuthenticatedUser();\n\n // Get dates tab link for 'view course schedule' button\n const datesTab = tabs.find(tab => tab.slug === 'dates');\n const datesTabLink = datesTab && datesTab.url;\n\n useEffect(() => logVisit(org, courseId, administrator, 'in_progress'), [org, courseId, administrator]);\n\n return (\n <>\n \n {intl.formatMessage(messages.congratulationsHeader)}\n
\n \n {intl.formatMessage(messages.completedCourseHeader)}\n {marketingUrl && ` ${intl.formatMessage(messages.shareMessage)}`}\n
\n \n \n \n \n \n
\n \n {certHeader && (\n \n \n )}\n {relatedPrograms && relatedPrograms.map(program => (\n
\n \n
\n \n
\n {certStatus !== 'unverified' && (\n {certHeader}
\n {message}\n \n {buttonPrefix}\n {buttonLocation && (\n logClick(org, courseId, administrator, buttonEvent)}\n >\n {buttonText}\n \n )}\n {buttonSuffix}\n
\n \n
\n )}\n \n \n \n
\n \n );\n}\n\nCourseInProgress.propTypes = {\n intl: intlShape.isRequired,\n};\n\nexport default injectIntl(CourseInProgress);\n","import React, { useEffect } from 'react';\n\nimport { getAuthenticatedUser } from '@edx/frontend-platform/auth';\nimport { injectIntl, intlShape } from '@edx/frontend-platform/i18n';\nimport { Helmet } from 'react-helmet';\nimport { useSelector } from 'react-redux';\nimport { Alert, Button } from '@edx/paragon';\nimport { getConfig } from '@edx/frontend-platform';\n\nimport { useModel } from '../../../generic/model-store';\n\nimport CatalogSuggestion from './CatalogSuggestion';\nimport DashboardFootnote from './DashboardFootnote';\nimport messages from './messages';\nimport { logClick, logVisit } from './utils';\n\nfunction CourseNonPassing({ intl }) {\n const { courseId } = useSelector(state => state.courseware);\n const { org, tabs, title } = useModel('coursewareMeta', courseId);\n const { administrator } = getAuthenticatedUser();\n\n // Get progress tab link for 'view grades' button\n const progressTab = tabs.find(tab => tab.slug === 'progress');\n const progressLink = progressTab && progressTab.url;\n\n useEffect(() => logVisit(org, courseId, administrator, 'nonpassing'), [org, courseId, administrator]);\n\n return (\n <>\n \n { intl.formatMessage(messages.courseInProgressHeader) }\n
\n \n logClick(org, courseId, administrator, 'view_dates_tab')}\n >\n {intl.formatMessage(messages.viewCourseScheduleButton)}\n \n )}\n
\n { intl.formatMessage(messages.courseInProgressDescription) }
\n {datesTabLink && (\n \n \n \n
\n \n );\n}\n\nCourseNonPassing.propTypes = {\n intl: intlShape.isRequired,\n};\n\nexport default injectIntl(CourseNonPassing);\n","import React, { useEffect } from 'react';\n\nimport { getConfig } from '@edx/frontend-platform';\nimport { injectIntl, intlShape } from '@edx/frontend-platform/i18n';\nimport { Button } from '@edx/paragon';\nimport { useSelector } from 'react-redux';\nimport { Redirect } from 'react-router-dom';\n\nimport CourseCelebration from './CourseCelebration';\nimport CourseInProgress from './CourseInProgress';\nimport CourseNonPassing from './CourseNonPassing';\nimport { COURSE_EXIT_MODES, getCourseExitMode } from './utils';\nimport messages from './messages';\nimport { unsubscribeFromGoalReminders } from './data/thunks';\n\nimport { useModel } from '../../../generic/model-store';\n\nfunction CourseExit({ intl }) {\n const { courseId } = useSelector(state => state.courseware);\n const {\n certificateData,\n courseExitPageIsActive,\n courseGoals,\n enrollmentMode,\n hasScheduledContent,\n isEnrolled,\n isMasquerading,\n userHasPassingGrade,\n } = useModel('coursewareMeta', courseId);\n\n const mode = getCourseExitMode(\n certificateData,\n hasScheduledContent,\n isEnrolled,\n userHasPassingGrade,\n courseExitPageIsActive,\n );\n\n // Audit users cannot fully complete a course, so we will\n // unsubscribe them from goal reminders once they reach the course exit page\n // to avoid spamming them with goal reminder emails\n if (courseGoals && enrollmentMode === 'audit' && !isMasquerading) {\n useEffect(() => {\n unsubscribeFromGoalReminders(courseId);\n }, []);\n }\n\n let body = null;\n if (mode === COURSE_EXIT_MODES.nonPassing) {\n body = (\n { intl.formatMessage(messages.endOfCourseHeader) }\n
\n \n logClick(org, courseId, administrator, 'view_grades')}\n >\n {intl.formatMessage(messages.viewGradesButton)}\n \n )}\n
\n { intl.formatMessage(messages.endOfCourseDescription) }
\n {progressLink && (\n \n \n {intl.formatMessage(messages.viewCoursesButton)}\n \n
\n {body}\n \n );\n}\n\nCourseExit.propTypes = {\n intl: intlShape.isRequired,\n};\n\nexport default injectIntl(CourseExit);\n","import { defineMessages } from '@edx/frontend-platform/i18n';\n\nconst messages = defineMessages({\n failure: {\n id: 'learning.loading.failure',\n defaultMessage: 'There was an error loading this course.',\n },\n loading: {\n id: 'learning.loading',\n defaultMessage: 'Loading course page…',\n },\n});\n\nexport default messages;\n","import { defineMessages } from '@edx/frontend-platform/i18n';\n\nconst messagesBadgeProgress = defineMessages({\n failure: {\n id: 'badge.progress.loading.failure',\n defaultMessage: 'There was an error loading the course badge progress.',\n description: 'Message when course badge progress page fails to load',\n },\n loading: {\n id: 'badge.progress.loading',\n defaultMessage: 'Loading course badge progress page...',\n description: 'Message when course badge progress page is being loaded',\n },\n});\n\nexport default messagesBadgeProgress;\n","import { defineMessages } from '@edx/frontend-platform/i18n';\n\nconst messages = defineMessages({\n courseMaterial: {\n id: 'learn.navigation.course.tabs.label',\n defaultMessage: 'Course Material',\n description: 'The accessible label for course tabs navigation',\n },\n});\n\nexport default messages;\n","import { useLayoutEffect, useRef, useState } from 'react';\n\nimport useWindowSize from './useWindowSize';\n\nconst invisibleStyle = {\n position: 'absolute',\n left: 0,\n pointerEvents: 'none',\n visibility: 'hidden',\n};\n\n/**\n * This hook will find the index of the last child of a containing element\n * that fits within its bounding rectangle. This is done by summing the widths\n * of the children until they exceed the width of the container.\n *\n * The hook returns an array containing:\n * [indexOfLastVisibleChild, containerElementRef, invisibleStyle, overflowElementRef]\n *\n * indexOfLastVisibleChild - the index of the last visible child\n * containerElementRef - a ref to be added to the containing html node\n * invisibleStyle - a set of styles to be applied to child of the containing node\n * if it needs to be hidden. These styles remove the element visually, from\n * screen readers, and from normal layout flow. But, importantly, these styles\n * preserve the width of the element, so that future width calculations will\n * still be accurate.\n * overflowElementRef - a ref to be added to an html node inside the container\n * that is likely to be used to contain a \"More\" type dropdown or other\n * mechanism to reveal hidden children. The width of this element is always\n * included when determining which children will fit or not. Usage of this ref\n * is optional.\n */\nexport default function useIndexOfLastVisibleChild() {\n const containerElementRef = useRef(null);\n const overflowElementRef = useRef(null);\n const containingRectRef = useRef({});\n const [indexOfLastVisibleChild, setIndexOfLastVisibleChild] = useState(-1);\n const windowSize = useWindowSize();\n\n useLayoutEffect(() => {\n const containingRect = containerElementRef.current.getBoundingClientRect();\n\n // No-op if the width is unchanged.\n // (Assumes tabs themselves don't change count or width).\n if (!containingRect.width === containingRectRef.current.width) {\n return;\n }\n // Update for future comparison\n containingRectRef.current = containingRect;\n\n // Get array of child nodes from NodeList form\n const childNodesArr = Array.prototype.slice.call(containerElementRef.current.children);\n const { nextIndexOfLastVisibleChild } = childNodesArr\n // filter out the overflow element\n .filter(childNode => childNode !== overflowElementRef.current)\n // sum the widths to find the last visible element's index\n .reduce((acc, childNode, index) => {\n // use floor to prevent rounding errors\n acc.sumWidth += Math.floor(childNode.getBoundingClientRect().width);\n if (acc.sumWidth <= containingRect.width) {\n acc.nextIndexOfLastVisibleChild = index;\n }\n return acc;\n }, {\n // Include the overflow element's width to begin with. Doing this means\n // sometimes we'll show a dropdown with one item in it when it would fit,\n // but allowing this case dramatically simplifies the calculations we need\n // to do above.\n sumWidth: overflowElementRef.current ? overflowElementRef.current.getBoundingClientRect().width : 0,\n nextIndexOfLastVisibleChild: -1,\n });\n\n setIndexOfLastVisibleChild(nextIndexOfLastVisibleChild);\n }, [windowSize, containerElementRef.current]);\n\n return [indexOfLastVisibleChild, containerElementRef, invisibleStyle, overflowElementRef];\n}\n","import React, { useMemo } from 'react';\nimport PropTypes from 'prop-types';\nimport { Dropdown } from '@edx/paragon';\nimport { FormattedMessage } from '@edx/frontend-platform/i18n';\nimport classNames from 'classnames';\n\nimport useIndexOfLastVisibleChild from './useIndexOfLastVisibleChild';\n\nexport default function Tabs({ children, className, ...attrs }) {\n const [\n indexOfLastVisibleChild,\n containerElementRef,\n invisibleStyle,\n overflowElementRef,\n ] = useIndexOfLastVisibleChild();\n\n const tabChildren = useMemo(() => {\n const childrenArray = React.Children.toArray(children);\n const indexOfOverflowStart = indexOfLastVisibleChild + 1;\n\n // All tabs will be rendered. Those that would overflow are set to invisible.\n const wrappedChildren = childrenArray.map((child, index) => React.cloneElement(child, {\n style: index > indexOfLastVisibleChild ? invisibleStyle : null,\n }));\n\n // Build the list of items to put in the overflow menu\n const overflowChildren = childrenArray.slice(indexOfOverflowStart)\n .map(overflowChild => React.cloneElement(overflowChild, { className: 'dropdown-item' }));\n\n // Insert the overflow menu at the cut off index (even if it will be hidden\n // it so it can be part of measurements)\n wrappedChildren.splice(indexOfOverflowStart, 0, (\n \n
\n );\n}\n\nCourseTabsNavigation.propTypes = {\n activeTabSlug: PropTypes.string,\n className: PropTypes.string,\n tabs: PropTypes.arrayOf(PropTypes.shape({\n title: PropTypes.string.isRequired,\n slug: PropTypes.string.isRequired,\n url: PropTypes.string.isRequired,\n })).isRequired,\n intl: intlShape.isRequired,\n};\n\nCourseTabsNavigation.defaultProps = {\n activeTabSlug: undefined,\n className: null,\n};\n\nexport default injectIntl(CourseTabsNavigation);\n","export default __webpack_public_path__ + \"918dabb96dbc78f01518bac195d6ce58.png\";","export default __webpack_public_path__ + \"fd69edc8826f0733bdad0a718fa9da48.png\";","import { defineMessages } from '@edx/frontend-platform/i18n';\n\nconst messages = defineMessages({\n congratulations: {\n id: 'learning.streakCelebration.congratulations',\n defaultMessage: 'Congratulations!',\n },\n streakBody: {\n id: 'learning.streakCelebration.body',\n defaultMessage: 'Keep it up, you’re on a roll!',\n },\n streakButton: {\n id: 'learning.streakCelebration.button',\n defaultMessage: 'Keep it up',\n },\n streakButtonSrOnly: {\n id: 'learning.streakCelebration.buttonSrOnly',\n defaultMessage: 'Close modal and continue',\n description: 'Screenreader label for streakButton text',\n },\n streakButtonAA759: {\n id: 'learning.streakCelebration.buttonAA759',\n defaultMessage: 'Continue with course',\n },\n streakHeader: {\n id: 'learning.streakCelebration.header',\n defaultMessage: 'day streak',\n description: 'Will come after a number. For example, 3 day streak',\n },\n streakFactoidABoldedSection: {\n id: 'learning.streakCelebration.factoidABoldedSection',\n defaultMessage: 'are 20x more likely to pass their course',\n description: 'This bolded section is in the following sentence: Users who learn 3 days in a row {bolded_section} than those who don\\'t.',\n },\n streakFactoidBBoldedSection: {\n id: 'learning.streakCelebration.factoidBBoldedSection',\n defaultMessage: 'complete 5x as much course content on average',\n description: 'This bolded section is in the following sentence: Users who learn 3 days in a row {bolded_section} vs. those who don\\'t.',\n },\n streakDiscountMessage: {\n id: 'learning.streakCelebration.streakDiscountMessage',\n defaultMessage: 'You’ve unlocked a 15% off discount when you upgrade this course for a limited time only.',\n description: 'This message describes a discount the user becomes eligible for when they hit their three day streak',\n },\n});\n\nexport default messages;\n","import React, { useEffect, useState } from 'react';\nimport PropTypes from 'prop-types';\nimport {\n FormattedMessage, injectIntl, intlShape,\n} from '@edx/frontend-platform/i18n';\nimport { Lightbulb, MoneyFilled } from '@edx/paragon/icons';\nimport {\n Alert, Icon, ModalDialog,\n} from '@edx/paragon';\nimport { layoutGenerator } from 'react-break';\nimport { useDispatch } from 'react-redux';\nimport { UpgradeNowButton } from '../../generic/upgrade-button';\n\nimport { useModel } from '../../generic/model-store';\nimport StreakMobileImage from './assets/Streak_mobile.png';\nimport StreakDesktopImage from './assets/Streak_desktop.png';\nimport messages from './messages';\nimport { recordModalClosing, recordStreakCelebration } from './utils';\n\nfunction getRandomFactoid(intl, streakLength) {\n const boldedSectionA = intl.formatMessage(messages.streakFactoidABoldedSection);\n const boldedSectionB = intl.formatMessage(messages.streakFactoidBBoldedSection);\n const factoids = [\n (\n \n {tabs.map(({ url, title, slug }) => (\n \n {title}\n \n ))}\n \n
\n {intl.formatMessage(messages.streakBody)}
\n\n \n
\n
\n
\n )}\n { StreakDiscountCouponEnabled && (\n \n {randomFactoid}\n
\n \n
\n \n {intl.formatMessage(messages.congratulations)}\n {intl.formatMessage(messages.streakDiscountMessage)} \n
\n \n
\n );\n }\n}\nMasqueradeWidget.propTypes = {\n courseId: PropTypes.string.isRequired,\n intl: intlShape.isRequired,\n onError: PropTypes.func.isRequired,\n};\nMasqueradeWidget.contextType = UserMessagesContext;\nexport default injectIntl(MasqueradeWidget);\n","import MasqueradeWidget from './MasqueradeWidget';\n\nexport default MasqueradeWidget;\n","import React, { useMemo } from 'react';\nimport { useAlert } from '../../generic/user-messages';\nimport { useModel } from '../../generic/model-store';\n\nconst AccessExpirationAlert = React.lazy(() => import('./AccessExpirationAlert'));\nconst AccessExpirationMasqueradeBanner = React.lazy(() => import('./AccessExpirationMasqueradeBanner'));\n\nfunction useAccessExpirationAlert(accessExpiration, courseId, org, userTimezone, topic, analyticsPageName) {\n const isVisible = accessExpiration && !accessExpiration.masqueradingExpiredCourse; // If it exists, show it.\n const payload = {\n accessExpiration,\n courseId,\n org,\n userTimezone,\n analyticsPageName,\n };\n\n useAlert(isVisible, {\n code: 'clientAccessExpirationAlert',\n payload: useMemo(() => payload, Object.values(payload).sort()),\n topic,\n });\n\n return { clientAccessExpirationAlert: AccessExpirationAlert };\n}\n\nexport function useAccessExpirationMasqueradeBanner(courseId, tab) {\n const {\n userTimezone,\n } = useModel('courseHomeMeta', courseId);\n const {\n accessExpiration,\n } = useModel(tab, courseId);\n\n const isVisible = accessExpiration && accessExpiration.masqueradingExpiredCourse;\n const expirationDate = accessExpiration && accessExpiration.expirationDate;\n const payload = {\n expirationDate,\n userTimezone,\n };\n\n useAlert(isVisible, {\n code: 'clientAccessExpirationMasqueradeBanner',\n payload: useMemo(() => payload, Object.values(payload).sort()),\n topic: 'instructor-toolbar-alerts',\n });\n\n return { clientAccessExpirationMasqueradeBanner: AccessExpirationMasqueradeBanner };\n}\n\nexport default useAccessExpirationAlert;\n","import React, { useEffect, useState } from 'react';\nimport PropTypes from 'prop-types';\nimport { useSelector } from 'react-redux';\nimport { getConfig } from '@edx/frontend-platform';\n\nimport { ALERT_TYPES, AlertList } from '../generic/user-messages';\nimport Alert from '../generic/user-messages/Alert';\nimport MasqueradeWidget from './masquerade-widget';\nimport { useAccessExpirationMasqueradeBanner } from '../alerts/access-expiration-alert';\nimport { useCourseStartMasqueradeBanner } from '../alerts/course-start-alert';\n\nfunction getInsightsUrl(courseId) {\n const urlBase = getConfig().INSIGHTS_BASE_URL;\n let urlFull;\n if (urlBase) {\n urlFull = `${urlBase}/courses`;\n // This shouldn't actually be missing, at present,\n // but we're providing a reasonable fallback,\n // in case of either error or extension.\n if (courseId) {\n urlFull += `/${courseId}`;\n }\n }\n return urlFull;\n}\n\nfunction getStudioUrl(courseId, unitId) {\n const urlBase = getConfig().STUDIO_BASE_URL;\n let urlFull;\n if (urlBase) {\n if (unitId) {\n urlFull = `${urlBase}/container/${unitId}`;\n } else if (courseId) {\n urlFull = `${urlBase}/course/${courseId}`;\n }\n }\n return urlFull;\n}\n\nexport default function InstructorToolbar(props) {\n // This didMount logic became necessary once we had a page that does a redirect on a quick exit.\n // As a result, it unmounts the InstructorToolbar (which will be remounted by the new component),\n // but the InstructorToolbar's MasqueradeWidget has an outgoing request. Since it is unmounted\n // during that time, it raises an error about a potential memory leak. By stopping the render\n // when the InstructorToolbar is unmounted, we avoid the memory leak.\n // NOTE: This was originally added because of the CourseExit page redirect. Once that page stops\n // doing a redirect because a CourseExit experience exists for all learners, this could be removed\n const [didMount, setDidMount] = useState(false);\n useEffect(() => {\n setDidMount(true);\n // Returning this function here will run setDidMount(false) when this component is unmounted\n return () => setDidMount(false);\n });\n\n const {\n courseId,\n unitId,\n canViewLegacyCourseware,\n tab,\n } = props;\n\n const urlInsights = getInsightsUrl(courseId);\n const urlLegacy = useSelector((state) => {\n if (!canViewLegacyCourseware) {\n return undefined;\n }\n\n if (!unitId) {\n return undefined;\n }\n\n const activeUnit = state.models.units[props.unitId];\n return activeUnit ? activeUnit.legacyWebUrl : undefined;\n });\n const urlStudio = getStudioUrl(courseId, unitId);\n const [masqueradeErrorMessage, showMasqueradeError] = useState(null);\n\n const accessExpirationMasqueradeBanner = useAccessExpirationMasqueradeBanner(courseId, tab);\n const courseStartDateMasqueradeBanner = useCourseStartMasqueradeBanner(courseId, tab);\n\n return (!didMount ? null : (\n \n View this course as:\n \n \n {masquerade}\n \n \n {options}\n \n \n
\n {shouldShowUserNameInput && (\n \n {`${specificLearnerInputText}:`}\n this.onError(errorMessage)}\n onSubmit={(payload) => this.onSubmit(payload)}\n />\n
\n )}\n \n
\n ));\n}\n\nInstructorToolbar.propTypes = {\n courseId: PropTypes.string,\n unitId: PropTypes.string,\n canViewLegacyCourseware: PropTypes.bool,\n tab: PropTypes.string,\n};\n\nInstructorToolbar.defaultProps = {\n courseId: undefined,\n unitId: undefined,\n canViewLegacyCourseware: undefined,\n tab: '',\n};\n","/* eslint-disable import/prefer-default-export */\nimport React, {\n useContext, useMemo,\n} from 'react';\nimport { AppContext } from '@edx/frontend-platform/react';\n\nimport { useAlert } from '../../generic/user-messages';\nimport { useModel } from '../../generic/model-store';\n\nconst EnrollmentAlert = React.lazy(() => import('./EnrollmentAlert'));\n\nexport function useEnrollmentAlert(courseId) {\n const { authenticatedUser } = useContext(AppContext);\n const course = useModel('courseHomeMeta', courseId);\n const outline = useModel('outline', courseId);\n const enrolledUser = course && course.isEnrolled !== undefined && course.isEnrolled;\n const privateOutline = outline && outline.courseBlocks && !outline.courseBlocks.courses;\n /**\n * This alert should render if\n * 1. the user is not enrolled,\n * 2. the user is authenticated, AND\n * 3. the course is private.\n */\n const isVisible = !enrolledUser && authenticatedUser !== null && privateOutline;\n const payload = {\n canEnroll: outline && outline.enrollAlert ? outline.enrollAlert.canEnroll : false,\n courseId,\n extraText: outline && outline.enrollAlert ? outline.enrollAlert.extraText : '',\n isStaff: course && course.isStaff,\n };\n\n useAlert(isVisible, {\n code: 'clientEnrollmentAlert',\n payload: useMemo(() => payload, Object.values(payload).sort()),\n topic: 'outline',\n });\n\n return { clientEnrollmentAlert: EnrollmentAlert };\n}\n","/* eslint-disable import/prefer-default-export */\nimport React, { useContext } from 'react';\nimport { AppContext } from '@edx/frontend-platform/react';\nimport { ALERT_TYPES, useAlert } from '../../generic/user-messages';\nimport { useModel } from '../../generic/model-store';\n\nconst LogistrationAlert = React.lazy(() => import('./LogistrationAlert'));\n\nexport function useLogistrationAlert(courseId) {\n const { authenticatedUser } = useContext(AppContext);\n const outline = useModel('outline', courseId);\n const privateOutline = outline && outline.courseBlocks && !outline.courseBlocks.courses;\n /**\n * This alert should render if\n * 1. the user is not authenticated, AND\n * 2. the course is private.\n */\n const isVisible = authenticatedUser === null && privateOutline;\n\n useAlert(isVisible, {\n code: 'clientLogistrationAlert',\n topic: 'outline',\n dismissible: false,\n type: ALERT_TYPES.ERROR,\n });\n\n return { clientLogistrationAlert: LogistrationAlert };\n}\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport { Helmet } from 'react-helmet';\n\nimport { getConfig } from '@edx/frontend-platform';\nimport { useToggle } from '@edx/paragon';\n\nimport { CourseTabsNavigation } from '../course-tabs';\nimport { useModel } from '../generic/model-store';\nimport { AlertList } from '../generic/user-messages';\nimport StreakModal from '../shared/streak-celebration';\nimport InstructorToolbar from '../instructor-toolbar';\nimport useEnrollmentAlert from '../alerts/enrollment-alert';\nimport useLogistrationAlert from '../alerts/logistration-alert';\n\nfunction LoadedTabPage({\n activeTabSlug,\n children,\n courseId,\n metadataModel,\n unitId,\n}) {\n const {\n originalUserIsStaff,\n tabs,\n title,\n celebrations,\n canViewLegacyCourseware,\n verifiedMode,\n } = useModel(metadataModel, courseId);\n\n // Logistration and enrollment alerts are only really used for the outline tab, but loaded here to put them above\n // breadcrumbs when they are visible.\n const logistrationAlert = useLogistrationAlert(courseId);\n const enrollmentAlert = useEnrollmentAlert(courseId);\n\n const activeTab = tabs.filter(tab => tab.slug === activeTabSlug)[0];\n\n const streakLengthToCelebrate = celebrations && celebrations.streakLengthToCelebrate;\n const StreakDiscountCouponEnabled = celebrations && celebrations.streakDiscountEnabled && verifiedMode;\n const [isStreakCelebrationOpen,, closeStreakCelebration] = useToggle(streakLengthToCelebrate);\n\n return (\n <>\n \n
\n {masqueradeErrorMessage && (\n \n
\n View course in:\n \n )}\n {urlLegacy && (\n \n Legacy experience\n \n )}\n {urlStudio && (\n \n Studio\n \n )}\n {urlInsights && (\n \n Insights\n \n )}\n
\n \n
\n {(urlLegacy || urlStudio || urlInsights) && (\n <>\n \n View course in:\n \n )}\n {urlLegacy && (\n \n Legacy experience\n \n )}\n {urlStudio && (\n \n Studio\n \n )}\n {urlInsights && (\n \n Insights\n \n )}\n
\n \n {masqueradeErrorMessage}\n \n
\n )}\n \n {intl.formatMessage(notificationMessage)}\n
\n \n \n );\n}\n\nTabPage.defaultProps = {\n courseId: null,\n unitId: null,\n};\n\nTabPage.propTypes = {\n activeTabSlug: PropTypes.string.isRequired,\n intl: intlShape.isRequired,\n courseId: PropTypes.string,\n courseStatus: PropTypes.string.isRequired,\n metadataModel: PropTypes.string.isRequired,\n unitId: PropTypes.string,\n};\n\nexport default injectIntl(TabPage);\n","/* eslint-disable import/prefer-default-export */\nimport { getLocale } from '@edx/frontend-platform/i18n';\n\n// This function inspects an access denied error and provides a redirect url (looks like a /redirect/... path),\n// which then renders a nice little message while the browser loads the next page.\n// This is basically a frontend version of check_course_access_with_redirect in the backend.\nexport function getAccessDeniedRedirectUrl(courseId, activeTabSlug, courseAccess, start, unitId) {\n let url = null;\n switch (courseAccess.errorCode) {\n case 'audit_expired':\n url = `/redirect/dashboard?access_response_error=${courseAccess.additionalContextUserMessage}`;\n break;\n case 'course_not_started':\n // eslint-disable-next-line no-case-declarations\n const startDate = (new Intl.DateTimeFormat(getLocale())).format(new Date(start));\n url = `/redirect/dashboard?notlive=${startDate}`;\n break;\n case 'survey_required':\n url = `/redirect/survey/${courseId}`;\n break;\n case 'unfulfilled_milestones':\n url = '/redirect/dashboard';\n break;\n case 'microfrontend_disabled':\n // This code path is only used by the courseware right now. The course home tabs each have their own check for\n // this in the tab-specific API calls. In those cases, the API will return an http status code if the MFE version\n // of those tabs are disabled, rather than an access error like this. We could try to unify these approaches, but\n // hopefully the legacy code isn't around long enough for that to be worth it.\n if (unitId) {\n url = `/redirect/courseware/${courseId}/unit/${unitId}`;\n }\n break;\n case 'authentication_required':\n case 'enrollment_required':\n default:\n if (activeTabSlug !== 'outline') {\n url = `/redirect/course-home/${courseId}`;\n }\n }\n return url;\n}\n","import React, { useEffect } from 'react';\nimport PropTypes from 'prop-types';\nimport { useDispatch, useSelector } from 'react-redux';\nimport { useParams } from 'react-router-dom';\nimport { OuterExamTimer } from '@edx/frontend-lib-special-exams';\n\nimport TabPage from './TabPage';\n\nexport default function TabContainer(props) {\n const {\n children,\n fetch,\n slice,\n tab,\n } = props;\n\n const { courseId: courseIdFromUrl } = useParams();\n const dispatch = useDispatch();\n useEffect(() => {\n // The courseId from the URL is the course we WANT to load.\n dispatch(fetch(courseIdFromUrl));\n }, [courseIdFromUrl]);\n\n // The courseId from the store is the course we HAVE loaded. If the URL changes,\n // we don't want the application to adjust to it until it has actually loaded the new data.\n const {\n courseId,\n courseStatus,\n } = useSelector(state => state[slice]);\n\n return (\n\n
\n );\n\n const renderCreativeCommonsLicense = (activeCreativeCommonsLicenseTags, version) => (\n \n {licenseType === 'all-rights-reserved' && renderAllRightsReservedLicense()}\n {licenseType === 'creative-commons' && renderCreativeCommonsLicense(\n Object.keys(licenseOptions),\n licenseVersion,\n )}\n
\n );\n}\n\nCourseLicense.propTypes = {\n license: PropTypes.string,\n intl: intlShape.isRequired,\n};\n\nCourseLicense.defaultProps = {\n license: 'all-rights-reserved',\n};\n\nexport default injectIntl(CourseLicense);\n","import { defineMessages } from '@edx/frontend-platform/i18n';\n\nconst messages = defineMessages({\n 'learn.loading.content.lock': {\n id: 'learn.loading.content.lock',\n defaultMessage: 'Loading locked content messaging...',\n description: 'Message shown when an interface about locked content is being loaded',\n },\n 'learn.loading.honor.code': {\n id: 'learn.loading.honor.codk',\n defaultMessage: 'Loading honor code messaging...',\n description: 'Message shown when an interface about the honor code is being loaded',\n },\n 'learn.loading.learning.sequence': {\n id: 'learn.loading.learning.sequence',\n defaultMessage: 'Loading learning sequence...',\n description: 'Message when learning sequence is being loaded',\n },\n 'learn.course.load.failure': {\n id: 'learn.course.load.failure',\n defaultMessage: 'There was an error loading this course.',\n description: 'Message when a course fails to load',\n },\n 'learn.sequence.no.content': {\n id: 'learn.sequence.no.content',\n defaultMessage: 'There is no content here.',\n description: 'Message shown when there is no content to show a user inside a learning sequence.',\n },\n});\n\nexport default messages;\n","import { defineMessages } from '@edx/frontend-platform/i18n';\n\nconst messages = defineMessages({\n header: {\n id: 'learn.hiddenAfterDue.header',\n defaultMessage: 'The due date for this assignment has passed.',\n },\n description: {\n id: 'learn.hiddenAfterDue.description',\n defaultMessage: 'Because the due date has passed, this assignment is no longer available.',\n },\n gradeAvailable: {\n id: 'learn.hiddenAfterDue.gradeAvailable',\n defaultMessage: 'If you have completed this assignment, your grade is available on the {progressPage}.',\n },\n progressPage: {\n id: 'learn.hiddenAfterDue.progressPage',\n defaultMessage: 'progress page',\n description: 'This is the text for the link embedded in learn.hiddenAfterDue.gradeAvailable',\n },\n});\n\nexport default messages;\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport { injectIntl, intlShape, FormattedMessage } from '@edx/frontend-platform/i18n';\nimport { Alert, Hyperlink } from '@edx/paragon';\nimport { Info } from '@edx/paragon/icons';\n\nimport { useModel } from '../../../../generic/model-store';\n\nimport messages from './messages';\n\nfunction HiddenAfterDue({ courseId, intl }) {\n const { tabs } = useModel('coursewareMeta', courseId);\n\n const progressTab = tabs.find(tab => tab.slug === 'progress');\n const progressLink = progressTab && progressTab.url && (\n {intl.formatMessage(messages.header)}
\n\n {intl.formatMessage(messages.description)}\n {progressLink && (\n <>\n
\n \n \n )}\n
\n
\n {shouldDisplayDropdown && (\n \n \n {unitIds.map(buttonUnitId => (\n
\n \n {intl.formatMessage(messages.nextUpButton, { title: nextSequence.title })}\n
\n );\n}\n\nUnitNavigationEffortEstimate.propTypes = {\n children: PropTypes.node,\n intl: intlShape.isRequired,\n sequenceId: PropTypes.string.isRequired,\n unitId: PropTypes.string,\n};\n\nUnitNavigationEffortEstimate.defaultProps = {\n children: null,\n unitId: null,\n};\n\nexport default injectIntl(UnitNavigationEffortEstimate);\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport { Button } from '@edx/paragon';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faChevronLeft, faChevronRight } from '@fortawesome/free-solid-svg-icons';\nimport {\n injectIntl, intlShape, isRtl, getLocale,\n} from '@edx/frontend-platform/i18n';\nimport { useSelector } from 'react-redux';\n\nimport { getCourseExitNavigation } from '../../course-exit';\n\nimport UnitNavigationEffortEstimate from './UnitNavigationEffortEstimate';\nimport { useSequenceNavigationMetadata } from './hooks';\nimport messages from './messages';\n\nfunction UnitNavigation({\n intl,\n sequenceId,\n unitId,\n onClickPrevious,\n onClickNext,\n goToCourseExitPage,\n}) {\n const { isFirstUnit, isLastUnit } = useSequenceNavigationMetadata(sequenceId, unitId);\n const { courseId } = useSelector(state => state.courseware);\n\n const renderNextButton = () => {\n const { exitActive, exitText } = getCourseExitNavigation(courseId, intl);\n const buttonOnClick = isLastUnit ? goToCourseExitPage : onClickNext;\n const buttonText = (isLastUnit && exitText) ? exitText : intl.formatMessage(messages.nextButton);\n const disabled = isLastUnit && !exitActive;\n const nextArrow = isRtl(getLocale()) ? faChevronLeft : faChevronRight;\n return (\n \n \n
\n );\n}\n\nUnitNavigation.propTypes = {\n intl: intlShape.isRequired,\n sequenceId: PropTypes.string.isRequired,\n unitId: PropTypes.string,\n onClickPrevious: PropTypes.func.isRequired,\n onClickNext: PropTypes.func.isRequired,\n goToCourseExitPage: PropTypes.func.isRequired,\n};\n\nUnitNavigation.defaultProps = {\n unitId: null,\n};\n\nexport default injectIntl(UnitNavigation);\n","import React from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faBookmark } from '@fortawesome/free-regular-svg-icons';\n\nexport default function BookmarkOutlineIcon(props) {\n return \n \n {modalOptions.body\n ?
\n );\n}\n\nUnit.propTypes = {\n courseId: PropTypes.string.isRequired,\n format: PropTypes.string,\n id: PropTypes.string.isRequired,\n intl: intlShape.isRequired,\n onLoaded: PropTypes.func,\n notificationTrayVisible: PropTypes.bool.isRequired,\n /** [MM-P2P] Experiment */\n mmp2p: PropTypes.shape({\n state: PropTypes.shape({\n isEnabled: PropTypes.bool.isRequired,\n }),\n meta: PropTypes.shape({\n showLock: PropTypes.bool,\n blockContent: PropTypes.bool,\n }),\n }),\n};\n\nUnit.defaultProps = {\n format: null,\n onLoaded: undefined,\n /** [MM-P2P] Experiment */\n mmp2p: {\n state: {\n isEnabled: false,\n },\n meta: {\n showLock: false,\n blockContent: false,\n },\n },\n};\n\nexport default injectIntl(Unit);\n","import React, { Suspense, useEffect } from 'react';\nimport PropTypes from 'prop-types';\nimport { injectIntl, intlShape } from '@edx/frontend-platform/i18n';\nimport PageLoading from '../../../generic/PageLoading';\nimport { useModel } from '../../../generic/model-store';\n\nimport messages from './messages';\nimport Unit from './Unit';\n\nconst ContentLock = React.lazy(() => import('./content-lock'));\n\nfunction SequenceContent({\n gated,\n intl,\n courseId,\n sequenceId,\n unitId,\n unitLoadedHandler,\n notificationTrayVisible,\n /** [MM-P2P] Experiment */\n mmp2p,\n}) {\n const sequence = useModel('sequences', sequenceId);\n\n // Go back to the top of the page whenever the unit or sequence changes.\n useEffect(() => {\n global.scrollTo(0, 0);\n }, [sequenceId, unitId]);\n\n if (gated) {\n return (\n {unit.title}
\n{ modalOptions.body }
\n : (\n \n {\n window.onmessage = function handleResetDates(e) {\n if (e.data.event_name) {\n dispatch(processEvent(e.data, fetchCourse));\n }\n };\n }}\n />\n
\n )}\n \n {intl.formatMessage(messages['learn.sequence.no.content'])}\n
\n );\n }\n\n return (\n { toggleNotificationTray(); }} onKeyDown={() => { toggleNotificationTray(); }} role=\"button\" tabIndex=\"0\" alt={intl.formatMessage(messages.responsiveCloseNotificationTray)}>\n
\n ) : null}\n \n {intl.formatMessage(messages.notificationTitle)}\n {shouldDisplayFullScreen\n ? null\n : (\n
\n \n \n { toggleNotificationTray(); }} variant=\"primary\" alt={intl.formatMessage(messages.closeNotificationTrigger)} />\n
\n )}\n {verifiedMode\n ? (\n
\n {intl.formatMessage(messages.noNotificationsMessage)}
}\n\n
\n );\n}\n\nNotificationIcon.propTypes = {\n intl: intlShape.isRequired,\n status: PropTypes.string.isRequired,\n notificationColor: PropTypes.string.isRequired,\n};\n\nexport default injectIntl(NotificationIcon);\n","import React, { useEffect } from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport { injectIntl, intlShape } from '@edx/frontend-platform/i18n';\nimport { getLocalStorage, setLocalStorage } from '../../data/localStorage';\n\nimport NotificationIcon from './NotificationIcon';\nimport messages from './messages';\n\nfunction NotificationTrigger({\n intl, toggleNotificationTray, isNotificationTrayVisible, notificationStatus, setNotificationStatus,\n upgradeNotificationCurrentState,\n}) {\n /* Re-show a red dot beside the notification trigger for each of the 7 UpgradeNotification stages\n The upgradeNotificationCurrentState prop will be available after UpgradeNotification mounts. Once available,\n compare with the last state they've seen, and if it's different then set dot back to red */\n function UpdateUpgradeNotificationLastSeen() {\n if (upgradeNotificationCurrentState) {\n if (getLocalStorage('upgradeNotificationLastSeen') !== upgradeNotificationCurrentState) {\n setNotificationStatus('active');\n setLocalStorage('notificationStatus', 'active');\n setLocalStorage('upgradeNotificationLastSeen', upgradeNotificationCurrentState);\n }\n }\n }\n\n useEffect(() => { UpdateUpgradeNotificationLastSeen(); });\n\n return (\n {intl.formatMessage(messages['learn.sequence.no.content'])}
);\n }\n return (\n \n
\n );\n\n if (sequenceStatus === 'loaded') {\n return (\n \n {\n logEvent('edx.ui.lms.sequence.next_selected', 'top');\n handleNext();\n }}\n onNavigate={(destinationUnitId) => {\n logEvent('edx.ui.lms.sequence.tab_selected', 'top', destinationUnitId);\n handleNavigate(destinationUnitId);\n }}\n previousSequenceHandler={() => {\n logEvent('edx.ui.lms.sequence.previous_selected', 'top');\n handlePrevious();\n }}\n goToCourseExitPage={() => goToCourseExitPage()}\n />\n\n {shouldDisplayNotificationTrigger ? (\n
\n {notificationTrayVisible ? (\n \n {\n logEvent('edx.ui.lms.sequence.previous_selected', 'bottom');\n handlePrevious();\n }}\n onClickNext={() => {\n logEvent('edx.ui.lms.sequence.next_selected', 'bottom');\n handleNext();\n }}\n goToCourseExitPage={() => goToCourseExitPage()}\n />\n )}\n
\n \n \n {defaultContent}\n \n
\n );\n }\n\n // sequence status 'failed' and any other unexpected sequence status.\n return (\n \n {intl.formatMessage(messages['learn.course.load.failure'])}\n
\n );\n}\n\nSequence.propTypes = {\n unitId: PropTypes.string,\n sequenceId: PropTypes.string,\n courseId: PropTypes.string.isRequired,\n unitNavigationHandler: PropTypes.func.isRequired,\n nextSequenceHandler: PropTypes.func.isRequired,\n previousSequenceHandler: PropTypes.func.isRequired,\n intl: intlShape.isRequired,\n toggleNotificationTray: PropTypes.func,\n notificationTrayVisible: PropTypes.bool,\n isNotificationTrayVisible: PropTypes.func,\n notificationStatus: PropTypes.string.isRequired,\n setNotificationStatus: PropTypes.func.isRequired,\n onNotificationSeen: PropTypes.func,\n upgradeNotificationCurrentState: PropTypes.string.isRequired,\n setupgradeNotificationCurrentState: PropTypes.func.isRequired,\n\n /** [MM-P2P] Experiment */\n mmp2p: PropTypes.shape({\n flyover: PropTypes.shape({\n isVisible: PropTypes.bool.isRequired,\n }),\n meta: PropTypes.shape({\n showLock: PropTypes.bool,\n }),\n state: PropTypes.shape({\n isEnabled: PropTypes.bool.isRequired,\n }),\n }),\n};\n\nSequence.defaultProps = {\n sequenceId: null,\n unitId: null,\n toggleNotificationTray: null,\n notificationTrayVisible: null,\n isNotificationTrayVisible: null,\n onNotificationSeen: null,\n\n /** [MM-P2P] Experiment */\n mmp2p: {\n flyover: { isVisible: false },\n meta: { showLock: false },\n state: { isEnabled: false },\n },\n};\n\nexport default injectIntl(Sequence);\n","export default __webpack_public_path__ + \"d74ff1cdcede27b19cad1734d1fd8671.gif\";","export default __webpack_public_path__ + \"97e1acd8ce9fa2e59a5479c61b6fba23.gif\";","import { defineMessages } from '@edx/frontend-platform/i18n';\n\nconst messages = defineMessages({\n completed: {\n id: 'learning.celebration.completed',\n defaultMessage: 'You just completed the first section of your course.',\n },\n congrats: {\n id: 'learning.celebration.congrats',\n defaultMessage: 'Congratulations!',\n },\n earned: {\n id: 'learning.celebration.earned',\n defaultMessage: 'You earned it!',\n },\n emailSubject: {\n id: 'learning.celebration.emailSubject',\n defaultMessage: \"I'm on my way to completing {title} online with {platform}!\",\n description: 'Subject when sharing course progress via email',\n },\n forward: {\n id: 'learning.celebration.forward',\n defaultMessage: 'Keep going',\n description: 'Button to close celebration dialog and get back to course',\n },\n share: {\n id: 'learning.celebration.share',\n defaultMessage: 'Take a moment to celebrate and share your progress.',\n },\n socialMessage: {\n id: 'learning.celebration.social',\n defaultMessage: 'I’m on my way to completing {title} online with {platform}. What are you spending your time learning?',\n description: 'Shown when sharing course progress on a social network',\n },\n});\n\nexport default messages;\n","/* eslint-disable import/prefer-default-export */\n\nimport { getConfig } from '@edx/frontend-platform';\nimport { getAuthenticatedHttpClient } from '@edx/frontend-platform/auth';\n\n// Does not block on answer\nexport function postFirstSectionCelebrationComplete(courseId) {\n const url = new URL(`${getConfig().LMS_BASE_URL}/api/courseware/celebration/${courseId}`);\n getAuthenticatedHttpClient().post(url.href, {\n first_section: false,\n });\n}\n","import { sendTrackEvent } from '@edx/frontend-platform/analytics';\nimport { getAuthenticatedUser } from '@edx/frontend-platform/auth';\n\nimport { postFirstSectionCelebrationComplete } from './data/api';\nimport { clearLocalStorage, getLocalStorage, setLocalStorage } from '../../../data/localStorage';\nimport { updateModel } from '../../../generic/model-store';\n\nconst CELEBRATION_LOCAL_STORAGE_KEY = 'CelebrationModal.showOnSectionLoad';\n\n// Records clicks through the end of a section, so that we can know whether we should celebrate when we finish loading\nfunction handleNextSectionCelebration(sequenceId, nextSequenceId, nextUnitId) {\n setLocalStorage(CELEBRATION_LOCAL_STORAGE_KEY, {\n prevSequenceId: sequenceId,\n nextSequenceId,\n nextUnitId,\n });\n}\n\nfunction recordFirstSectionCelebration(org, courseId) {\n // Tell the LMS\n postFirstSectionCelebrationComplete(courseId);\n\n // Tell our analytics\n const { administrator } = getAuthenticatedUser();\n sendTrackEvent('edx.ui.lms.celebration.first_section.opened', {\n org_key: org,\n courserun_key: courseId,\n course_id: courseId, // should only be courserun_key, but left as-is for historical reasons\n is_staff: administrator,\n });\n}\n\n// Looks at local storage to see whether we just came from the end of a section.\n// Note! This does have side effects (will clear some local storage and may start an api call).\nfunction shouldCelebrateOnSectionLoad(courseId, sequenceId, unitId, celebrateFirstSection, dispatch, celebrations) {\n const celebrationIds = getLocalStorage(CELEBRATION_LOCAL_STORAGE_KEY);\n if (!celebrationIds) {\n return false;\n }\n\n const {\n prevSequenceId,\n nextSequenceId,\n nextUnitId,\n } = celebrationIds;\n const onTargetUnit = sequenceId === nextSequenceId && (!nextUnitId || unitId === nextUnitId);\n let shouldCelebrate = onTargetUnit && celebrateFirstSection;\n\n if (shouldCelebrate && celebrations.streakLengthToCelebrate) {\n // We don't want two modals to show up on the same page.\n // If we are going to celebrate a streak then we will not also celebrate the first section.\n // We will still mark the first section as celebrated, so that we don't incorrectly celebrate the second section.\n shouldCelebrate = false;\n postFirstSectionCelebrationComplete(courseId);\n }\n\n if (sequenceId !== prevSequenceId && !onTargetUnit) {\n // Don't clear until we move off of current/prev sequence\n clearLocalStorage(CELEBRATION_LOCAL_STORAGE_KEY);\n\n // Update our local copy of course data from LMS\n dispatch(updateModel({\n modelType: 'coursewareMeta',\n model: {\n id: courseId,\n celebrations: {\n ...celebrations,\n firstSection: false,\n },\n },\n }));\n }\n\n return shouldCelebrate;\n}\n\nexport { handleNextSectionCelebration, recordFirstSectionCelebration, shouldCelebrateOnSectionLoad };\n","import React, { useEffect } from 'react';\nimport PropTypes from 'prop-types';\nimport { injectIntl, intlShape } from '@edx/frontend-platform/i18n';\nimport { Modal } from '@edx/paragon';\nimport { layoutGenerator } from 'react-break';\n\nimport ClapsMobile from './assets/claps_280x201.gif';\nimport ClapsTablet from './assets/claps_456x328.gif';\nimport messages from './messages';\nimport SocialIcons from '../../social-share/SocialIcons';\nimport { recordFirstSectionCelebration } from './utils';\nimport { useModel } from '../../../generic/model-store';\n\nfunction CelebrationModal({\n courseId, intl, open, ...rest\n}) {\n const { org } = useModel('coursewareMeta', courseId);\n\n const layout = layoutGenerator({\n mobile: 0,\n tablet: 400,\n });\n\n const OnMobile = layout.is('mobile');\n const OnAtLeastTablet = layout.isAtLeast('tablet');\n\n useEffect(() => {\n if (open) {\n recordFirstSectionCelebration(org, courseId);\n }\n }, [open]);\n\n return (\n{intl.formatMessage(messages.completed)}
\n\n {intl.formatMessage(messages.earned)} {intl.formatMessage(messages.share)}\n
\n\n \n \n \n \n \n {this.props.intl.formatMessage(messages['calculator.button.label'])}\n \n
\n \n \n \n \n \n \n \n
\n \n \n
- \n
- \n
- \n
- \n
- \n
- \n
| \n | \n \n | \n \n | \n |
|---|---|---|---|
| \n | \n \n
| \n \n
| \n |
| \n | \n \n
| \n \n
| \n |
| \n | \n c, e, g, i, j, k, pi, q, T | \n\n
| \n |
| \n | \n \n | \n \n
| \n |
| \n | \n abs, exp, fact, factorial, ln, log2, log10, sqrt | \n\n
| \n |
| \n | \n \n
| \n \n
| \n \n |
| \n | \n \n | \n 10^-9 | \n|
| \n | \n \n | \n 1e-9 | \n
\n
\n );\n}\n\nContentTools.propTypes = {\n course: PropTypes.shape({\n notes: PropTypes.shape({\n enabled: PropTypes.bool,\n }),\n showCalculator: PropTypes.bool,\n }).isRequired,\n};\n","import ContentTools from './ContentTools';\n\nexport default ContentTools;\n","/* eslint-disable consistent-return */\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport { history } from '@edx/frontend-platform';\nimport { MenuItem } from '@edx/paragon';\n\nimport {\n sendTrackingLogEvent,\n sendTrackEvent,\n} from '@edx/frontend-platform/analytics';\nimport { useDispatch } from 'react-redux';\nimport { checkBlockCompletion } from '../data';\n\nexport default function JumpNavMenuItem({\n title,\n courseId,\n currentUnit,\n sequences,\n isDefault,\n\n}) {\n const dispatch = useDispatch();\n function logEvent(targetUrl) {\n const eventName = 'edx.ui.lms.jump_nav.selected';\n const payload = {\n target_name: title,\n id: targetUrl,\n current_id: courseId,\n widget_placement: 'breadcrumb',\n };\n sendTrackEvent(eventName, payload);\n sendTrackingLogEvent(eventName, payload);\n }\n\n function lazyloadUrl() {\n if (isDefault) {\n return `/course/${courseId}/${currentUnit}`;\n }\n const destinationString = sequences.forEach(sequence => sequence.unitIds.forEach(unitId => {\n const complete = dispatch(checkBlockCompletion(\n courseId,\n sequence.id, unitId,\n ))\n .then(value => value);\n if (!complete) { return `/course/${courseId}/${unitId}`; }\n }));\n return destinationString || `/course/${courseId}/${sequences[0].unitIds[0]}`;\n }\n function handleClick() {\n const url = lazyloadUrl();\n logEvent(url);\n history.push(url);\n }\n\n return (\n \n {course.showCalculator && (\n
\n \n
\n\n \n \n {\n global.location.assign(`${getConfig().LMS_BASE_URL}/courses/${match.params.courseId}/course/`);\n }}\n />\n {\n global.location.assign(`${getConfig().LMS_BASE_URL}/courses/${match.params.courseId}/survey`);\n }}\n />\n {\n global.location.assign(`${getConfig().LMS_BASE_URL}/dashboard${location.search}`);\n }}\n />\n \n
\n );\n};\n","import { defineMessages } from '@edx/frontend-platform/i18n';\n\nconst messages = defineMessages({\n 'learn.navigation.badge.tabs.label': {\n id: 'learn.navigation.badge.tabs.label',\n defaultMessage: 'Badge Material',\n description: 'The accessible label for badge tabs navigation',\n },\n});\n\nexport default messages;\n","import React from 'react';\nimport PropTypes from 'prop-types';\n\nfunction LinkedLogo({\n href,\n src,\n alt,\n ...attributes\n}) {\n return (\n \n \n
\n );\n}\n\nBadgeTabsNavigation.propTypes = {\n activeTabSlug: PropTypes.string,\n className: PropTypes.string,\n intl: intlShape.isRequired,\n};\n\nBadgeTabsNavigation.defaultProps = {\n activeTabSlug: undefined,\n className: null,\n};\n\nexport default injectIntl(BadgeTabsNavigation);\n","var _defs, _g;\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nimport * as React from \"react\";\nfunction SvgLogoBadgrBlack(props) {\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n width: 130,\n height: 40\n }, props), _defs || (_defs = /*#__PURE__*/React.createElement(\"defs\", null, /*#__PURE__*/React.createElement(\"path\", {\n id: \"logo-badgr-black_svg__a\",\n d: \"M0 0h38.375v40H0z\"\n }))), _g || (_g = /*#__PURE__*/React.createElement(\"g\", {\n fill: \"none\",\n fillRule: \"evenodd\"\n }, /*#__PURE__*/React.createElement(\"path\", {\n d: \"M0 0h130v40H0z\"\n }), /*#__PURE__*/React.createElement(\"path\", {\n fill: \"#282C4C\",\n d: \"M74.756 12v2.343h1.59v2.147a8.15 8.15 0 00-2.48-.368c-2.673.065-4.264 1.431-4.264 4.577v2.104c0 2.711.87 4.815 4.093 4.815.806 0 2.016-.26 3.076-.824l.191.63h4.009V25.08h-1.464V12h-4.751zM72.72 23.128v-2.516c0-1.606.551-1.974 1.866-1.974.721 0 1.252.087 1.76.217v6.008c-.572.13-1.314.24-1.76.24-1.484 0-1.866-.543-1.866-1.975zM44 12v2.343h1.59V27.25a32.82 32.82 0 004.922.368c4.157 0 4.984-2.104 4.984-4.815v-2.104c0-3.146-1.59-4.512-4.263-4.577a8.15 8.15 0 00-2.482.368V12H44zm4.751 13.015v-6.16a6.736 6.736 0 011.76-.217c1.316 0 1.868.368 1.868 1.974v2.516c0 1.432-.382 1.974-1.867 1.974-.446 0-1.146 0-1.76-.087zm50.504-7.744l-.276-.954h-4.2v2.343h1.591v6.42h-1.42v2.343h5.981V25.08h-1.4v-5.683c1.103-.347 2.991-.412 3.755-.434v-2.841c-1.379 0-2.715.672-4.03 1.15zm-17.011 3.666v2.104c0 3.146 1.59 4.512 4.263 4.577.997 0 1.782-.173 2.397-.347-.021.781-.234 1.519-1.04 1.8-1.102.413-3.181.391-5.111.391V32h.912c1.251 0 3.203 0 4.9-.39 3.563-.933 3.584-3.471 3.584-5.64v-7.31h1.591v-2.343h-4.136l-.191.629c-1.06-.564-2.27-.824-3.076-.824-3.224 0-4.093 2.104-4.093 4.815zm3.117 2.191v-2.516c0-1.432.382-1.974 1.867-1.974.446 0 1.188.108 1.76.238v6.009a6.742 6.742 0 01-1.76.217c-1.315 0-1.867-.369-1.867-1.974zm-25.283-6.746c-2.927.716-3.012 2.993-3.012 4.317v2.256c0 2.71.87 4.663 4.094 4.663.806 0 1.93-.26 2.99-.824l.191.63h3.946V25.08h-1.4v-8.243c-1.718-.499-3.16-.715-4.752-.715-.742 0-1.315.086-2.057.26zm.148 6.724v-2.32c0-1.432.234-2.148 1.867-2.148.424 0 1.06.043 1.633.13v6.009c-.53.173-1.23.303-1.633.303-1.506 0-1.845-.542-1.867-1.974z\"\n }), /*#__PURE__*/React.createElement(\"mask\", {\n id: \"logo-badgr-black_svg__b\",\n fill: \"#fff\"\n }, /*#__PURE__*/React.createElement(\"use\", {\n xlinkHref: \"#logo-badgr-black_svg__a\"\n })), /*#__PURE__*/React.createElement(\"path\", {\n fill: \"#FFF\",\n d: \"M20.82 40a1.95 1.95 0 01-.971-.26L4.238 30.71a1.949 1.949 0 01-.971-1.683V23.2c-1.013-.47-1.701-1.108-2.342-2.136-.64-1.025-1.23-2.237-.75-3.448.334-.838 1.094-1.417 2.259-1.72.04-.012.345-.092.833-.222v-4.702c0-.692.372-1.336.97-1.682L19.85.26a1.943 1.943 0 011.943 0l15.612 9.03c.598.345.97.99.97 1.681v18.057c0 .692-.372 1.336-.97 1.682l-15.612 9.03a1.95 1.95 0 01-.972.26\",\n mask: \"url(#logo-badgr-black_svg__b)\"\n }), /*#__PURE__*/React.createElement(\"path\", {\n fill: \"#FFF\",\n d: \"M12.924 18.385a.992.992 0 00.377-.108c.211-.101.381-.238.547-.345.082-.053.164-.1.251-.13a.666.666 0 01.133-.034s-.47-.262-.733-.367l-.105-.044c-.038-.016-.077-.033-.12-.047a.876.876 0 00-.285-.053.711.711 0 00-.23.04.97.97 0 00-.26.136c.02-.002.038-.006.06-.006a.523.523 0 01.387.161v.001a.56.56 0 01.118.175.54.54 0 01-.14.621\"\n }), /*#__PURE__*/React.createElement(\"path\", {\n fill: \"#FFF\",\n d: \"M29.03 14.628c-1.505-1.074-3.278-1.765-4.966-2.209a31.387 31.387 0 00-1.911-.405 41.792 41.792 0 00-2.497-.323 24.254 24.254 0 00-1.45-.069 1.296 1.296 0 01-.308.01 23.11 23.11 0 00-1.552.158c-3.642.497-8.514 4.294-9.852 4.644l-1.284.337-1.031.272-.893.236c.204.195.65.64.893 1.013.082.126.14.244.158.341.028.156-.045.52-.158.943a32.743 32.743 0 01-.632 2.01c.186.112.396.215.632.312l.015.006c.048.01.102.018.16.03l.1.017c.102.018.377.053.756.092 1.006.105 2.754.242 4.013.196.332-.012.652-.028.957-.043 1.368-.066 2.447-.118 3.242.184a.194.194 0 01-.07.375.182.182 0 01-.067-.013c-.72-.274-1.764-.223-3.086-.159-.308.015-.628.03-.961.043-.825.03-1.904-.036-2.834-.115.718.143 1.57.284 2.602.437.199.03.392.061.583.092 1.174.094 3.707.276 6.853.392 4.379.161 9.37 2.13 12.429 3.967 1.694 1.018 3.665 2.205 5.087 3.061l.928-.538-.461.268.499-.289c-3.223-5.307-7.326-8.135-9.047-8.339-1.901-.226-2.802-.323-2.9-.613-.095-.29.259-.613.259-.613-.42.258-.966.064-.966.064.226-.16.258-.547.258-.547-.322.225-1.256.354-1.256.354.16-.29.194-.838.194-.838-.42.451-2.61 1.064-4.798 1.58-2.19.516-6.858 0-7.695-.065-.838-.064-.741.065-.965.645-.226.581-.838-.129-1.417-.548-.581-.419-1.29-1.387-.644-2.064.644-.677 4.732-2.773 8.435-3.902 3.703-1.129 5.44-.87 6.536-.71.322.048.737.115 1.214.244.092-.036.188-.07.29-.1.376-.107.946-.236 1.53-.236 1.26 0 1.762.585 1.96 1.076.184.455.507 1.326.598 2.062 2.352 2.065 8.923 2.684 8.799 2.404-.13-.29-2.368-2.34-6.278-5.127\"\n }), /*#__PURE__*/React.createElement(\"path\", {\n fill: \"#FFF\",\n d: \"M12.832 17.583c.013-.001.023-.004.036-.004a.36.36 0 01.076.009c-.014-.016-.033-.03-.05-.044a.627.627 0 00-.062.039\"\n }), /*#__PURE__*/React.createElement(\"path\", {\n fill: \"#B5445B\",\n d: \"M24.46 35.952l-.014-.03a21.905 21.905 0 00-1.142-2.33 23.239 23.239 0 00-7.866-8.219c-.14-.076-2.099-1.12-6.464-1.777l-.032-.005-.032-.005c-1.576-.235-2.769-.447-3.7-.685v6.127l15.61 9.028 3.64-2.104z\"\n }), /*#__PURE__*/React.createElement(\"path\", {\n fill: \"#FFF\",\n d: \"M25.001 17.204a1.04 1.04 0 01-.349.23s.58.677 1.095.806c.04.01.075.015.108.015.146 0 .231-.093.271-.247a.843.843 0 00.017-.082c.007-.058.011-.122.011-.192a3.285 3.285 0 00-.072-.601 9.65 9.65 0 00-.28-1.023 12.054 12.054 0 00-.248-.676 1.19 1.19 0 00-.629-.649c-.279-.131-.617-.184-.974-.184-.096 0-.193.004-.29.01a5.485 5.485 0 00-1.134.21 2.864 2.864 0 00-1.516 1.053c-.064.086-.094.14-.094.14s-.009.01-.02.026a.367.367 0 00-.054.087.148.148 0 00-.018.077.068.068 0 00.02.044c.022.026.07.044.153.044.078 0 .187-.015.338-.051.288-.07.63-.217.954-.391.54-.288 1.032-.646 1.15-.828.007-.014.016-.027.021-.04l.004.016.012.042a2.508 2.508 0 01.05.265c.023.179.03.408-.034.613a.777.777 0 00.216.031c.101 0 .224-.02.337-.093a.6.6 0 00.187-.196.574.574 0 00.06.367.587.587 0 01-.027.085l.008.002a.516.516 0 00.539-.196l-.008.046a.95.95 0 01-.018.073l-.013.046a1.24 1.24 0 01-.126.28c-.01.02-.025.039-.039.059a.752.752 0 01-.214.206s.106.07.251.142c.144.07.327.142.478.142a.35.35 0 00.14-.026s-.036.059-.1.139a1.658 1.658 0 01-.163.179\"\n }), /*#__PURE__*/React.createElement(\"path\", {\n fill: \"#B5445B\",\n d: \"M19.4 10.431c.19-.132.374-.263.55-.39.915-.652 1.638-1.168 2.282-1.168.085 0 .168.01.246.027.7.156 2.027 1.132 2.655 1.836.365.408 1.349 1.243 2.402 1.83a.4.4 0 01.066.038c3.078 1.275 6.048 3.3 8.832 6.02V10.97L20.82 1.943 5.21 10.971v5.133c.35-.092.727-.19 1.12-.295.368-.096 1.28-.643 2.246-1.222 2.175-1.304 5.152-3.09 7.683-3.436.64-.088 1.277-.147 1.945-.18.117-.006.234-.01.35-.014l.178-.093c.145-.083.357-.216.669-.433\"\n }), /*#__PURE__*/React.createElement(\"path\", {\n fill: \"#C2202A\",\n d: \"M18.554 10.957c.044-.02.102-.05.178-.093l-.178.093z\"\n }), /*#__PURE__*/React.createElement(\"path\", {\n fill: \"#FFF\",\n d: \"M22.247 10.274l.066-.16.023.019.11.089a1.138 1.138 0 01.313.404.562.562 0 01.043.235c.032-.012.075-.034.12-.058l.127-.074c.07-.042.143-.084.21-.118l.16-.081.024.179c.01.062.057.25.16.307.018.01.035.015.048.015.026 0 .052-.026.075-.075a.652.652 0 00.041-.22 2.334 2.334 0 01.02-.233c.006-.034.012-.068.02-.101a10.907 10.907 0 00-.203-.155c-.48-.354-.974-.652-1.265-.717a.517.517 0 00-.107-.011c-.274 0-.643.19-1.073.469-.13.084-.264.176-.403.274-.14.097-.284.2-.431.305l-.278.197-.279.197a9.269 9.269 0 00-.159.112l-.054.039-.055.039h.096c.91 0 2.433-.35 2.651-.877\"\n }), /*#__PURE__*/React.createElement(\"path\", {\n fill: \"#282C4C\",\n d: \"M36.433 18.623c-2.784-2.719-5.754-4.744-8.832-6.019a.456.456 0 00-.066-.039c-1.053-.586-2.038-1.42-2.402-1.829-.629-.704-1.954-1.68-2.655-1.836a1.098 1.098 0 00-.246-.027c-.645 0-1.367.516-2.28 1.168a88.83 88.83 0 01-.55.39c-.314.217-.526.35-.67.433a2.365 2.365 0 01-.178.093c-.116.004-.233.008-.35.014-.668.033-1.305.092-1.945.18-2.53.346-5.509 2.132-7.683 3.436-.966.58-1.878 1.126-2.246 1.223l-1.12.294v-5.133l15.61-9.028 15.612 9.028v7.652zM19.5 11.15l.055-.039.055-.039a25.852 25.852 0 00.436-.308l.28-.197a24.086 24.086 0 01.833-.579c.43-.28.798-.469 1.073-.469.038 0 .073.003.106.01.291.065.786.363 1.266.718.068.05.137.102.203.154a1.127 1.127 0 00-.02.101 3.378 3.378 0 00-.016.154c0 .03-.003.056-.004.08a.65.65 0 01-.042.22c-.02.05-.049.075-.073.075a.118.118 0 01-.049-.015c-.103-.057-.15-.246-.159-.308l-.025-.178-.16.08a3.856 3.856 0 00-.21.118c-.038.022-.084.05-.128.074a.971.971 0 01-.12.058.568.568 0 00-.043-.235.77.77 0 00-.05-.104 1.151 1.151 0 00-.26-.299l-.113-.09-.022-.017-.066.158c-.218.528-1.74.88-2.652.88-.033 0-.064-.002-.095-.003zm-6.436 6.614a.556.556 0 00-.118-.176.322.322 0 00-.077-.009c-.013 0-.024.002-.037.003l.062-.039a.553.553 0 00-.336-.116c-.02 0-.039.004-.059.006a.994.994 0 01.26-.137.737.737 0 01.515.014c.043.014.082.03.12.046.038.016.072.032.105.045.262.105.733.367.733.367a.664.664 0 00-.133.033 1.18 1.18 0 00-.25.131c-.167.107-.337.244-.548.344a.98.98 0 01-.377.109.54.54 0 00.14-.621zm12.06-.852c-.15 0-.334-.07-.478-.143-.145-.07-.25-.142-.25-.142a.7.7 0 00.118-.095.99.99 0 00.096-.11l.04-.059a1.237 1.237 0 00.155-.399l.008-.046a.516.516 0 01-.538.196l-.009-.003a.53.53 0 00.021-.31.536.536 0 00-.053-.14.608.608 0 01-.188.194.616.616 0 01-.337.093.787.787 0 01-.155-.015.683.683 0 01-.06-.015 1.52 1.52 0 00.03-.642 2.476 2.476 0 00-.059-.278l-.004-.015a.33.33 0 01-.022.04c-.116.181-.609.54-1.149.827-.324.173-.666.321-.954.39a1.528 1.528 0 01-.338.051c-.084 0-.13-.017-.154-.043a.069.069 0 01-.018-.044.145.145 0 01.016-.077.372.372 0 01.027-.048l.027-.039.021-.025s.031-.055.094-.142a2.236 2.236 0 01.197-.24 2.845 2.845 0 011.32-.812c.084-.024.17-.046.258-.067.284-.069.582-.12.875-.143a4.06 4.06 0 01.291-.01c.356 0 .694.052.973.183.07.033.137.07.2.113a1.179 1.179 0 01.43.537 12.004 12.004 0 01.364 1.05 7.828 7.828 0 01.163.648c.044.221.072.428.073.602a.91.91 0 01-.029.274c-.04.154-.125.246-.27.246a.501.501 0 01-.109-.014c-.515-.129-1.094-.806-1.094-.806.133-.049.252-.138.348-.23.066-.062.12-.125.162-.179.065-.08.101-.14.101-.14a.333.333 0 01-.14.027zm1.386.44c-.092-.737-.414-1.608-.598-2.063-.199-.49-.7-1.076-1.96-1.076-.584 0-1.155.13-1.53.236a3.401 3.401 0 00-.29.1 10.08 10.08 0 00-1.215-.244c-1.094-.16-2.833-.419-6.536.71-3.702 1.13-7.79 3.225-8.434 3.902-.645.677.063 1.644.643 2.064.58.42 1.192 1.13 1.417.548.225-.58.128-.709.966-.645.837.065 5.505.581 7.694.065 2.19-.516 4.38-1.129 4.798-1.58 0 0-.032.547-.193.838 0 0 .933-.129 1.256-.355 0 0-.033.387-.258.548 0 0 .547.194.966-.064 0 0-.355.322-.258.613.097.29.998.386 2.898.612 1.722.205 5.825 3.033 9.047 8.34l-.499.288.462-.267-.929.537c-1.42-.856-3.392-2.042-5.086-3.06-3.059-1.839-8.05-3.806-12.429-3.967a165.324 165.324 0 01-6.854-.392c-.19-.03-.384-.062-.583-.092a54.787 54.787 0 01-2.6-.437c.928.08 2.007.145 2.833.114.333-.012.653-.027.961-.042 1.322-.064 2.366-.115 3.086.16a.2.2 0 00.068.012.193.193 0 00.068-.375c-.795-.302-1.874-.25-3.24-.184-.307.015-.626.031-.958.043-1.26.046-3.008-.092-4.014-.196a14.094 14.094 0 01-.755-.092l-.099-.018-.16-.029-.016-.007a4.61 4.61 0 01-.633-.31c.112-.323.434-1.262.633-2.01.112-.425.186-.788.157-.944a.999.999 0 00-.157-.34c-.242-.374-.689-.819-.893-1.014l.893-.237 1.03-.27c.397-.106.828-.219 1.285-.338 1.337-.35 6.21-4.147 9.852-4.644.475-.065.995-.12 1.552-.158.027.002.058.004.097.004.066 0 .137-.006.21-.014.32.004.822.021 1.451.07.992.092 2 .243 2.497.322.426.068 1.134.222 1.911.404 1.687.445 3.461 1.136 4.967 2.21 3.91 2.787 6.15 4.837 6.278 5.127.124.28-6.447-.339-8.799-2.404zm-5.689 20.705L5.21 29.028v-6.127c.932.24 2.125.451 3.702.685l.032.005.031.005c4.365.657 6.324 1.701 6.464 1.777a23.23 23.23 0 017.866 8.218c.431.762.816 1.546 1.143 2.331l.013.03-3.639 2.105zm16.127-27.979L21.336 1.05a1.03 1.03 0 00-1.03 0L4.694 10.08a1.03 1.03 0 00-.515.892v5.404l-1.516.401c-.88.23-1.417.615-1.64 1.176-.33.833.155 1.796.675 2.63.601.964 1.237 1.553 2.481 2.007v6.44c0 .368.196.708.515.893l15.612 9.028a1.028 1.028 0 001.03 0l15.612-9.028a1.03 1.03 0 00.515-.894V10.971a1.03 1.03 0 00-.515-.893z\"\n }))));\n}\nexport default __webpack_public_path__ + \"edefb1ef84d77b2cff221cb5dfabec09.svg\";\nexport { SvgLogoBadgrBlack as ReactComponent };","import React from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\n\nconst BadgeProgressBanner = ({ hasProgress, hasRights }) => {\n const indicatorProgress = (hasProgress ? '' : 'no-progress');\n\n const getPathTitle = () => (hasRights ? 'Class Progress' : 'My Learning Path');\n\n const getPathSubHeading = () => (\n hasRights\n ? \"Here is all learner progress through the badges available for this course. Click each badge to learn more about an individual student's credential.\"\n : \"Here is your progress through the badges available for this course. Click each badge to learn more or to save and share badges you've earned.\"\n );\n\n // d-flex justify-content-left\n return (\n \n \n {/* \n {title}\n \n ))}\n \n
\n \n { hasProgress && (\n <>\n
\n );\n};\n\nBadgeProgressBanner.propTypes = {\n hasProgress: PropTypes.bool.isRequired,\n hasRights: PropTypes.bool.isRequired,\n};\n\nexport default BadgeProgressBanner;\n","/* eslint-disable import/prefer-default-export */\n\nexport const isEmptyObject = (obj) => {\n Object.keys(obj).forEach(k => {\n if (Object.prototype.hasOwnProperty.call(obj, k)) {\n return false;\n }\n return true;\n });\n};\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport Moment from 'react-moment';\nimport classNames from 'classnames';\n\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faCheckCircle } from '@fortawesome/free-solid-svg-icons';\nimport { faCircle } from '@fortawesome/free-regular-svg-icons';\n\nconst BadgeProgressCardStatus = (props) => {\n const { status, title, earned } = props;\n\n const getStatusEarned = () => {\n // Set the output format for every react-moment instance.\n Moment.globalFormat = 'MMMM D, YYYY';\n\n // Set the timezone for every instance.\n // Moment.globalTimezone = 'America/Los_Angeles';\n\n // Set the output timezone for local for every instance.\n Moment.globalLocal = true;\n\n // Use a tag for every react-moment instance.\n Moment.globalElement = 'span';\n\n return (\n <>\n {earned && (\n \n
\n {getPathTitle()}
\n\n
\n \n )}\n\n { !hasProgress && (\n \n {getPathSubHeading()}\n
\nThis course either has no learner progress or is not setup for badging.
\n )}\n\n Earned: {earned} \n
\n )}\n \n );\n };\n\n const getStatusIndicator = () => {\n const indicatorIcon = (status ? faCheckCircle : faCircle);\n const indicatorStatus = (status ? 'complete' : 'incomplete');\n return (\n \n {stripNumPrefix}\n
\n );\n };\n\n return (\n <>\n {!earned && (\n \n {getStatusIndicator()}\n {getStatusTitle()}\n
\n )}\n {earned && (\n \n
\n )}\n \n );\n};\n\nBadgeProgressCardStatus.defaultProps = {\n earned: '',\n};\n\nBadgeProgressCardStatus.propTypes = {\n status: PropTypes.bool.isRequired,\n title: PropTypes.string.isRequired,\n earned: PropTypes.string,\n};\n\nexport default BadgeProgressCardStatus;\n","var _g;\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nimport * as React from \"react\";\nfunction SvgLogoBadgrWhite(props) {\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n xmlns: \"http://www.w3.org/2000/svg\",\n width: 130,\n height: 40\n }, props), _g || (_g = /*#__PURE__*/React.createElement(\"g\", {\n fill: \"none\",\n fillRule: \"evenodd\"\n }, /*#__PURE__*/React.createElement(\"path\", {\n d: \"M0 0h130v40H0z\"\n }), /*#__PURE__*/React.createElement(\"path\", {\n fill: \"#FFF\",\n d: \"M74.756 10v2.343h1.59v2.147a8.15 8.15 0 00-2.48-.368c-2.673.065-4.264 1.431-4.264 4.577v2.104c0 2.711.87 4.815 4.093 4.815.806 0 2.016-.26 3.076-.824l.191.63h4.009V23.08h-1.464V10h-4.751zM72.72 21.128v-2.516c0-1.606.551-1.974 1.866-1.974.721 0 1.252.087 1.76.217v6.008c-.572.13-1.314.24-1.76.24-1.484 0-1.866-.543-1.866-1.975zM44 10v2.343h1.59V25.25a32.82 32.82 0 004.922.368c4.157 0 4.984-2.104 4.984-4.815v-2.104c0-3.146-1.59-4.512-4.263-4.577a8.15 8.15 0 00-2.482.368V10H44zm4.751 13.015v-6.16a6.736 6.736 0 011.76-.217c1.316 0 1.868.368 1.868 1.974v2.516c0 1.432-.382 1.974-1.867 1.974-.446 0-1.146 0-1.76-.087zm50.504-7.744l-.276-.954h-4.2v2.343h1.591v6.42h-1.42v2.343h5.981V23.08h-1.4v-5.683c1.103-.347 2.991-.412 3.755-.434v-2.841c-1.379 0-2.715.672-4.03 1.15zm-17.011 3.666v2.104c0 3.146 1.59 4.512 4.263 4.577.997 0 1.782-.173 2.397-.347-.021.781-.234 1.519-1.04 1.8-1.102.413-3.181.391-5.111.391V30h.912c1.251 0 3.203 0 4.9-.39 3.563-.933 3.584-3.471 3.584-5.64v-7.31h1.591v-2.343h-4.136l-.191.629c-1.06-.564-2.27-.824-3.076-.824-3.224 0-4.093 2.104-4.093 4.815zm3.117 2.191v-2.516c0-1.432.382-1.974 1.867-1.974.446 0 1.188.108 1.76.238v6.009a6.742 6.742 0 01-1.76.217c-1.315 0-1.867-.369-1.867-1.974zm-25.283-6.746c-2.927.716-3.012 2.993-3.012 4.317v2.256c0 2.71.87 4.663 4.094 4.663.806 0 1.93-.26 2.99-.824l.191.63h3.946V23.08h-1.4v-8.243c-1.718-.499-3.16-.715-4.752-.715-.742 0-1.315.086-2.057.26zm.148 6.724v-2.32c0-1.432.234-2.148 1.867-2.148.424 0 1.06.043 1.633.13v6.009c-.53.173-1.23.303-1.633.303-1.506 0-1.845-.542-1.867-1.974z\"\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M0 40h40V0H0z\"\n }), /*#__PURE__*/React.createElement(\"path\", {\n fill: \"#B5445B\",\n d: \"M20.05 2.084L20 2.055 4.535 11l-.05.029v5.255l.125-.033 1.108-.29c.375-.099 1.28-.641 2.243-1.219 2.139-1.283 5.069-3.04 7.548-3.38a22.28 22.28 0 012.256-.19h.02l.018-.009c.174-.079.46-.257.852-.528.187-.13.369-.26.544-.386.888-.634 1.59-1.134 2.194-1.134.076 0 .15.008.222.023.675.15 1.957 1.098 2.568 1.783.363.407 1.347 1.242 2.404 1.83a.283.283 0 01.048.028l.021.012c3.024 1.252 5.947 3.245 8.69 5.922l.17.166v-7.85L20.05 2.084zm2.49 31.287a23.045 23.045 0 00-7.807-8.152c-.205-.113-2.127-1.12-6.415-1.767l-.064-.01c-1.67-.249-2.795-.456-3.644-.674l-.125-.032v6.236l15.465 8.944.05.029 3.72-2.151-.047-.111a21.838 21.838 0 00-1.134-2.312z\"\n }), /*#__PURE__*/React.createElement(\"path\", {\n fill: \"#FFF\",\n d: \"M25.524 17.435l.028.025c1.282 1.126 3.758 1.762 5.12 2.04 1.65.338 3.474.518 3.685.363a.118.118 0 00.04-.145c-.145-.328-2.477-2.427-6.232-5.104-1.323-.942-2.984-1.681-4.94-2.197a31.172 31.172 0 00-1.894-.401 41.11 41.11 0 00-2.474-.32 23.495 23.495 0 00-1.439-.068h-.012a1.557 1.557 0 01-.286.01h-.013c-.515.035-1.033.087-1.54.156-2.39.327-5.275 2.058-7.383 3.322-1.072.644-1.92 1.152-2.356 1.266l-1.269.333-2.072.547.129.124c.182.174.631.617.868.982a.88.88 0 01.14.3c.013.068.01.275-.153.888a30.078 30.078 0 01-.623 1.978l-.026.077.07.042c.183.11.392.212.638.313l.038-.092-.026.097.022.007a25.247 25.247 0 00.258.047c.115.02.41.057.753.092.567.059 2.532.247 3.977.194.328-.012.643-.027.946-.042 1.338-.065 2.395-.116 3.16.175.047.018.07.07.053.117a.092.092 0 01-.117.053c-.73-.278-1.77-.227-3.087-.163l-.03.001c-.295.015-.6.03-.918.04-.683.025-1.62-.012-2.786-.112l-.029.197c.676.135 1.494.272 2.574.433.197.03.387.06.583.092 1.202.095 3.68.273 6.772.387 4.505.166 9.4 2.206 12.223 3.902 1.674 1.006 3.62 2.178 5.023 3.023l.05.03.969-.56.125-.072-.053-.087c-3.22-5.303-7.278-8.077-9.007-8.282l-.197-.024c-1.51-.179-2.51-.298-2.581-.514-.061-.183.143-.422.227-.5l-.12-.158c-.24.147-.534.126-.711.093.139-.2.163-.463.164-.477l.017-.213-.174.122c-.2.14-.705.251-1.02.306a3.06 3.06 0 00.128-.695l.016-.279-.19.205c-.326.352-1.99.895-4.686 1.53-1.902.449-5.714.102-7.15-.029-.181-.016-.324-.03-.417-.037-.724-.055-.818.03-.977.487a6.07 6.07 0 01-.078.214c-.05.128-.106.143-.125.148-.16.043-.474-.215-.75-.441a8.02 8.02 0 00-.372-.293c-.375-.271-.798-.782-.843-1.26A.773.773 0 015.385 19c.313-.33 1.52-1.028 3.003-1.738 1.025-.49 3.074-1.415 5.283-2.089 3.631-1.106 5.301-.86 6.41-.697.33.049.73.115 1.187.238l.032.009.03-.012c.103-.04.19-.07.278-.095a5.594 5.594 0 011.483-.23c1.189 0 1.658.544 1.843 1 .18.443.494 1.293.585 2.011l.005.038zm-13.388.896l-.228.205.305-.031a1.05 1.05 0 00.404-.116 2.88 2.88 0 00.41-.25c.048-.034.095-.067.142-.097.089-.058.16-.094.227-.119a.615.615 0 01.113-.028l.29-.043-.257-.143a8.757 8.757 0 00-.735-.368l-.059-.025-.042-.018a1.784 1.784 0 00-.125-.049.833.833 0 00-.574-.013c-.094.032-.19.082-.282.149l-.31.223.38-.043.02-.002a.366.366 0 01.168.02l-.24.174.393-.046a.144.144 0 01.037 0 .442.442 0 01-.037.62zm11.923-1.165a.921.921 0 01-.31.206l-.136.05.094.11c.024.028.6.694 1.133.827.046.012.09.018.132.018.104 0 .291-.042.363-.319a.918.918 0 00.019-.092c.008-.06.013-.13.012-.204a3.352 3.352 0 00-.073-.613 8.312 8.312 0 00-.163-.65 11.3 11.3 0 00-.364-1.045 1.262 1.262 0 00-.46-.575 1.527 1.527 0 00-.21-.12c-.337-.156-.779-.217-1.3-.179-.276.02-.572.069-.88.143a6.457 6.457 0 00-.258.068 2.913 2.913 0 00-1.663 1.238.678.678 0 00-.065.106.25.25 0 00-.025.126.174.174 0 00.044.102c.085.094.259.1.583.022.341-.082.714-.26.966-.394.443-.237.85-.515 1.058-.72.005.024.009.051.013.08l.004.026c.027.215.017.41-.03.563l-.028.093.092.031s.027.01.072.018a.88.88 0 00.173.018.703.703 0 00.48-.181.396.396 0 01-.022.202l-.043.1.103.034.017.005a.65.65 0 00.373-.028l-.008.018a.993.993 0 01-.092.158.722.722 0 01-.185.178l-.13.082.128.085c.005.003.113.075.26.147.167.083.314.131.44.146a1.607 1.607 0 01-.114.12zm-5.27-5.802c.813 0 2.46-.32 2.712-.93l.014-.033.028.022a1.059 1.059 0 01.233.269c.018.03.033.06.044.089.027.066.038.13.035.19l-.008.152.143-.053c.033-.013.075-.033.132-.064l.12-.07.014-.008c.066-.039.134-.079.196-.11l.034-.017.005.039c.001.011.042.286.209.377a.202.202 0 00.095.027c.04 0 .113-.018.164-.135a.73.73 0 00.05-.251l.004-.077a1.662 1.662 0 01.033-.233l.016-.064-.052-.04a9.816 9.816 0 00-.203-.155c-.254-.188-.89-.637-1.287-.725-.269-.06-.643.077-1.241.466-.118.077-.249.166-.401.272-.132.092-.268.19-.408.289l-.019.013-.185.132-.163.115-.2.142-.157.11-.35.25.296.009.098.002z\"\n }), /*#__PURE__*/React.createElement(\"path\", {\n fill: \"#282C4C\",\n d: \"M35.415 18.64c-2.749-2.684-5.681-4.684-8.72-5.942a.375.375 0 00-.066-.04c-1.04-.577-2.012-1.402-2.371-1.805-.621-.695-1.93-1.66-2.622-1.813a1.109 1.109 0 00-.243-.026c-.637 0-1.35.508-2.252 1.153a72.75 72.75 0 01-.544.385c-.469.326-.71.463-.835.519-.115.004-.23.008-.346.014a22.4 22.4 0 00-1.92.177c-2.5.342-5.44 2.106-7.587 3.394-.954.571-1.854 1.112-2.217 1.207l-1.107.29v-5.068L20 2.171l15.415 8.914v7.556zm-16.72-7.378l.055-.039.054-.038.156-.11c.095-.066.183-.13.275-.195l.274-.194c.146-.105.289-.206.426-.302.138-.096.27-.187.398-.27.425-.276.79-.463 1.06-.463.038 0 .073.003.106.01.286.064.776.358 1.249.709.067.05.135.1.2.153a1.827 1.827 0 00-.036.252c0 .028-.002.055-.003.078a.62.62 0 01-.042.216c-.021.05-.048.075-.072.075a.107.107 0 01-.048-.015c-.1-.055-.148-.243-.157-.303l-.024-.177-.159.08c-.066.033-.137.075-.207.116l-.126.073a1.003 1.003 0 01-.119.058.541.541 0 00-.042-.232.761.761 0 00-.05-.103 1.076 1.076 0 00-.258-.296l-.11-.088-.022-.018-.064.157c-.216.521-1.72.868-2.62.868l-.093-.002zm-6.354 6.53a.541.541 0 00-.117-.173.34.34 0 00-.076-.01c-.012 0-.024.003-.036.004a.743.743 0 01.06-.039.534.534 0 00-.331-.114c-.02 0-.038.004-.058.006a.98.98 0 01.256-.136.704.704 0 01.228-.038c.103 0 .197.023.28.052.043.014.082.03.12.046l.104.044c.258.104.723.362.723.362a.72.72 0 00-.131.033c-.086.03-.167.076-.249.13-.163.105-.33.24-.54.34a.983.983 0 01-.372.107.536.536 0 00.138-.614zm11.909-.841c-.15 0-.33-.07-.473-.14a2.432 2.432 0 01-.248-.141.727.727 0 00.212-.203.843.843 0 00.101-.175c.027-.057.047-.112.062-.16l.013-.045c.008-.028.013-.053.017-.072l.008-.046a.51.51 0 01-.531.194l-.01-.003a.427.427 0 00.027-.083.52.52 0 00-.006-.223c-.02-.083-.052-.14-.052-.14a.593.593 0 01-.185.194.61.61 0 01-.333.092.777.777 0 01-.153-.016.411.411 0 01-.06-.015 1.48 1.48 0 00.033-.605l-.004-.028a2.288 2.288 0 00-.046-.234l-.01-.041a.831.831 0 00-.005-.015c-.004.011-.013.025-.022.039-.115.18-.6.533-1.134.818-.32.17-.658.316-.942.385-.15.036-.257.05-.334.05-.082 0-.129-.017-.152-.042a.073.073 0 01-.019-.044.156.156 0 01.017-.076.38.38 0 01.053-.086.391.391 0 01.021-.025s.03-.054.092-.14a2.412 2.412 0 01.196-.236 2.827 2.827 0 011.302-.802 5.435 5.435 0 011.12-.207c.095-.007.191-.011.286-.011.352 0 .685.052.962.181.069.033.134.07.196.112a1.152 1.152 0 01.424.53 11.415 11.415 0 01.361 1.036 8.447 8.447 0 01.161.64c.044.22.07.423.071.595a1.286 1.286 0 01-.027.27c-.04.153-.124.244-.268.244a.441.441 0 01-.107-.015c-.509-.127-1.08-.796-1.08-.796.13-.048.248-.136.344-.227.064-.061.118-.124.16-.177.063-.079.1-.137.1-.137a.337.337 0 01-.138.026zm1.368.434c-.091-.727-.409-1.587-.591-2.037-.196-.484-.692-1.061-1.936-1.061-.576 0-1.14.126-1.51.232a3.44 3.44 0 00-.287.099 9.957 9.957 0 00-1.199-.24c-1.08-.16-2.797-.415-6.453.7-3.656 1.114-7.693 3.184-8.33 3.853-.635.669.064 1.624.637 2.038.572.414 1.176 1.114 1.398.541.223-.573.127-.7.954-.637.826.064 5.436.574 7.598.064s4.324-1.114 4.737-1.56c0 0-.032.541-.19.828 0 0 .921-.128 1.239-.35 0 0-.032.382-.254.54 0 0 .54.192.953-.063 0 0-.35.318-.254.605.095.286.986.382 2.861.605 1.7.202 5.752 2.994 8.934 8.235l-.493.284.456-.263-.917.53c-1.404-.845-3.35-2.017-5.023-3.022-3.02-1.815-7.948-3.758-12.272-3.917a164.12 164.12 0 01-6.767-.387c-.188-.03-.379-.061-.576-.09a55.143 55.143 0 01-2.57-.433c.919.08 1.985.143 2.8.114.328-.012.645-.028.949-.042 1.305-.064 2.336-.114 3.046.157a.191.191 0 00.136-.357c-.785-.299-1.85-.247-3.2-.182-.303.015-.618.03-.946.042-1.243.045-2.97-.09-3.963-.193a13.924 13.924 0 01-.843-.109l-.16-.029-.014-.006a4.61 4.61 0 01-.625-.307c.11-.32.428-1.246.625-1.985.11-.419.183-.778.155-.932a1.003 1.003 0 00-.155-.336c-.24-.369-.681-.808-.883-1 .224-.06.524-.14.883-.234l1.017-.268 1.268-.333c1.32-.346 6.132-4.094 9.728-4.586.47-.064.983-.118 1.532-.155a1.4 1.4 0 00.304-.01c.316.004.812.02 1.432.068.98.092 1.974.24 2.466.319.42.067 1.12.22 1.888.4 1.665.438 3.417 1.12 4.904 2.18 3.86 2.753 6.072 4.777 6.2 5.064.121.276-6.368-.335-8.69-2.374zM20 37.829L4.585 28.915v-6.05c.92.236 2.098.444 3.654.676l.032.005.031.005c4.31.65 6.245 1.68 6.383 1.755a22.938 22.938 0 017.767 8.114c.425.753.805 1.527 1.129 2.301l.012.03L20 37.83zm15.924-27.626L20.509 1.288a1.015 1.015 0 00-1.018 0L4.076 10.203a1.02 1.02 0 00-.508.882v5.336l-1.497.396c-.87.227-1.399.606-1.62 1.16-.327.824.154 1.775.666 2.597.595.953 1.222 1.534 2.45 1.983v6.358c0 .364.194.7.51.882l15.414 8.915a1.015 1.015 0 001.018 0l15.415-8.915a1.02 1.02 0 00.508-.882v-17.83c0-.364-.193-.7-.508-.882z\"\n }))));\n}\nexport default __webpack_public_path__ + \"b2378bee0326f4e4041f5ef83d1642a3.svg\";\nexport { SvgLogoBadgrWhite as ReactComponent };","import React, { useState } from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport ReactMarkdown from 'react-markdown';\nimport {\n ActionRow,\n Button,\n Collapsible,\n Hyperlink,\n ModalDialog,\n useToggle,\n} from '@edx/paragon';\n\nimport LinkedLogo from '../../logos';\nimport logo from '../../assets/logo-badgr-white.svg';\n\nconst BadgeProgressCardDetailsModal = (props) => {\n const {\n progress,\n minimal,\n badgeProgressCardStatus,\n } = props;\n // const [modalOpen, setModalOpen] = useState(false);\n\n const [isOpen, open, close] = useToggle(false);\n const [modalSize] = useState('xl');\n const [modalVariant] = useState('dark');\n\n const getBadgrLogo = () => (\n \n
\n \n {getStatusIndicator()}\n {getStatusTitle()}\n {getStatusEarned()}\n
\n \n \n \n 
\n \n
\n \n \n \n\n \n \n \n Close\n \n \n \n
\n \n \n );\n\n return renderModal();\n};\n\nBadgeProgressCardDetailsModal.propTypes = {\n progress: PropTypes.shape({\n courseId: PropTypes.string,\n blockId: PropTypes.string,\n blockDisplayName: PropTypes.string,\n blockOrder: PropTypes.number,\n eventType: PropTypes.string,\n badgeClass: PropTypes.shape({\n slug: PropTypes.string,\n issuingComponent: PropTypes.string,\n displayName: PropTypes.string,\n courseId: PropTypes.string,\n description: PropTypes.string,\n criteria: PropTypes.string,\n image: PropTypes.string,\n }),\n assertion: PropTypes.shape({\n issuedOn: PropTypes.string,\n entityId: PropTypes.string,\n expires: PropTypes.string,\n revoked: PropTypes.bool,\n imageUrl: PropTypes.string,\n assertionUrl: PropTypes.string,\n recipient: PropTypes.shape({\n plaintextIdentity: PropTypes.string,\n }),\n issuer: PropTypes.shape({\n entityType: PropTypes.string,\n entityId: PropTypes.string,\n openBadgeId: PropTypes.string,\n name: PropTypes.string,\n image: PropTypes.string,\n email: PropTypes.string,\n description: PropTypes.string,\n url: PropTypes.string,\n }),\n }),\n }).isRequired,\n minimal: PropTypes.string,\n badgeProgressCardStatus: PropTypes.oneOfType([PropTypes.object]).isRequired,\n};\n\nBadgeProgressCardDetailsModal.defaultProps = {\n minimal: '',\n};\n\nexport default BadgeProgressCardDetailsModal;\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport { isEmptyObject } from '../../../../utils/empty';\nimport BadgeProgressCardStatus from './BadgeProgressCardStatus';\nimport BadgeProgressCardDetailsModal from './BadgeProgressCardDetailsModal';\n\nconst BadgeProgressCard = (props) => {\n const { data, minimal } = props;\n\n const isProgressComplete = () => {\n if (isEmptyObject(data.assertion)) {\n return false;\n }\n return data.assertion.imageUrl.length > 0;\n };\n\n const getBadgeProgressCardDetails = (earned) => (\n <>\n \n \n \n \n \n \n \n
\n\n \n
\n {progress.badgeClass.displayName}
\n\n
\n \n {progress.badgeClass.description}\n
\n \n
\n \n \n \n
\n \n {progress.assertion.issuedOn && progress.blockDisplayName && (\n
\n \n {badgeProgressCardStatus}\n
\n )}\n {progress.assertion.recipient.plaintextIdentity && (\n \n
\n )}\n {progress.badgeClass.criteria && (\n Recipient
\n{progress.assertion.recipient.plaintextIdentity}
\n\n {progress.badgeClass.criteria} \n
\n )}\n {progress.assertion.issuer && (\n Criteria
\n\n
\n )}\n Issuer
\n- \n
- \n
{progress.assertion.issuer.name} \n {progress.assertion.issuer.email}\n \n
\n \n \n
\n \n
\n \n
\n
\n Share your Open Badge with Badgr
\n\n Your achievement has been recognized with an
\n Badgr is a service that creates and stores Open Badges and lets you share them with others.\n To share your badge using Badgr, you can send a link to a web page about your badge to others.\n You can also send the badge image file directly to others, and they can use a
\n
\n
\n \n
\n - \n
- Create a
Badgr account, orlog in to your existing account; \n Share this public URL to your badge ; or \n - \n
Download your badge (right-click or option-click, save as) and share it\n directly with others. They can verify it's really yours atbadgecheck.io .\n \n
\n {getBadgrLogo()}\n
\n \n
\n )}\n {!minimal && (\n \n {getBadgeImage('minimal')}\n
\n \n
\n )}\n \n );\n};\n\nBadgeProgressCard.defaultProps = {\n minimal: '',\n};\n\nBadgeProgressCard.propTypes = {\n data: PropTypes.shape({\n courseId: PropTypes.string,\n blockId: PropTypes.string,\n blockDisplayName: PropTypes.string,\n blockOrder: PropTypes.number,\n eventType: PropTypes.string,\n badgeClass: PropTypes.shape({\n slug: PropTypes.string,\n issuingComponent: PropTypes.string,\n displayName: PropTypes.string,\n courseId: PropTypes.string,\n description: PropTypes.string,\n criteria: PropTypes.string,\n image: PropTypes.string,\n }),\n assertion: PropTypes.shape({\n issuedOn: PropTypes.string,\n entityId: PropTypes.string,\n expires: PropTypes.string,\n revoked: PropTypes.bool,\n imageUrl: PropTypes.string,\n assertionUrl: PropTypes.string,\n recipient: PropTypes.shape({\n plaintextIdentity: PropTypes.string,\n }),\n issuer: PropTypes.shape({\n entityType: PropTypes.string,\n entityId: PropTypes.string,\n openBadgeId: PropTypes.string,\n name: PropTypes.string,\n image: PropTypes.string,\n email: PropTypes.string,\n description: PropTypes.string,\n url: PropTypes.string,\n }),\n }),\n }).isRequired,\n minimal: PropTypes.string,\n};\n\nexport default BadgeProgressCard;\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport { TableHeaderCell } from '@edx/paragon';\n\nconst BadgeProgressCourseListTableHeaderRow = ({ headerGroups }) => (\n \n {headerGroups.map(headerGroup => (\n \n
\n \n
\n \n {getBadgeImage()}\n\n
\n \n
\n {data.badgeClass.displayName}
\n\n \n
\n
\n );\n};\n\nBadgeProgressCourseListTable.defaultProps = {\n isStriped: true,\n};\n\nBadgeProgressCourseListTable.propTypes = {\n /** should table rows be striped */\n isStriped: PropTypes.bool,\n};\n\nexport default BadgeProgressCourseListTable;\n","/* eslint-disable no-console */\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport snakeCase from 'lodash.snakecase';\nimport { DataTable, TextFilter } from '@edx/paragon';\n\nimport BadgeProgressCard from '../card/BadgeProgressCard';\nimport BadgeProgressCourseListTable from './BadgeProgressCourseListTable';\n\nconst BadgeProgressCourseList = (props) => {\n const { data, headings } = props;\n\n const getProgressCourseListData = () => {\n const results = [];\n\n data.forEach((item) => {\n const itemUserName = item.userName;\n const learnerData = {\n username: `'${item.userName}' (${item.email})`,\n };\n\n item.progress.forEach((i) => {\n const itemKey = snakeCase(`card ${i.blockDisplayName} ${itemUserName}`);\n learnerData[snakeCase(i.blockDisplayName)] = (\n \n the user is {username} and they are enrolled as an {enrollmentMode} learner\n {administrator\n && }\n
\n the user is admin
\n
\n \n );\n };\n\n const renderNoBadgeProgress = () => (\n \n \n \n
\n \n {progress && (\n
\n \n {progress.map(learnerProgress => {\n const itemKey = snakeCase(`card ${learnerProgress.blockDisplayName} ${username}`);\n return (\n
\n )}\n \n \n \n
\n \n the user is {username} and they are enrolled as an {enrollmentMode} learner\n {administrator\n && }\n
\n the user is admin
\n
\n \n
\n {items.map((item) => {\n /** [MM-P2P] Experiment (conditional) */\n const { badges: itemBadges } = mmp2pOverride\n ? getBadgeListAndColor(new Date(mmp2p.state.upgradeDeadline), intl, item, items)\n : getBadgeListAndColor(date, intl, item, items);\n\n const showDueDateTime = item.dateType === 'assignment-due-date';\n const showLink = item.link && isLearnerAssignment(item);\n const title = showLink ? ({item.title}) : item.title;\n const available = item.learnerHasAccess && (item.link || !isLearnerAssignment(item));\n const textColor = available ? 'text-primary-700' : 'text-gray-500';\n\n return (\n \n
\n );\n })}\n \n \n {item.assignmentType && `${item.assignmentType}: `}{title}\n {showDueDateTime && (\n \n due\n {item.extraInfo}\n }\n >\n
\n { /** [MM-P2P] Experiment (conditional) */ }\n { mmp2pOverride\n ? (\n \n You are still eligible to upgrade to a Verified Certificate!\n Unlock full course access and highlight the knowledge you'll gain.\n
\n )\n : (item.description && {item.description}
)}\n - \n {groupedDates.map((groupedDate) => (\n
\n {intl.formatMessage(messages.suggestedSchedule)}\n
\n );\n}\n\nSuggestedScheduleHeader.propTypes = {\n intl: intlShape.isRequired,\n};\n\nexport default injectIntl(SuggestedScheduleHeader);\n","import React from 'react';\nimport { useSelector } from 'react-redux';\nimport PropTypes from 'prop-types';\nimport { injectIntl, intlShape } from '@edx/frontend-platform/i18n';\nimport {\n Alert,\n Button,\n Col,\n Row,\n} from '@edx/paragon';\n\nimport { useModel } from '../../generic/model-store';\nimport messages from './messages';\n\nfunction UpgradeToCompleteAlert({ intl, logUpgradeLinkClick }) {\n const {\n courseId,\n } = useSelector(state => state.courseHome);\n\n const {\n datesBannerInfo,\n hasEnded,\n } = useModel('dates', courseId);\n\n const {\n contentTypeGatingEnabled,\n missedDeadlines,\n verifiedUpgradeLink,\n } = datesBannerInfo;\n\n if (!contentTypeGatingEnabled || missedDeadlines || hasEnded || !verifiedUpgradeLink) {\n return null;\n }\n\n return (\n\n {intl.formatMessage(messages.title)}\n
\n { /** [MM-P2P] Experiment */ }\n {isSelfPaced && hasDeadlines && !mmp2p.state.isEnabled && (\n <>\n {header}
\n {description}
\n \n \n );\n}\n\nResultPage.defaultProps = {\n courseTitle: null,\n error: false,\n};\n\nResultPage.propTypes = {\n courseTitle: PropTypes.string,\n error: PropTypes.bool,\n intl: intlShape.isRequired,\n};\n\nexport default injectIntl(ResultPage);\n","import { useEffect, useState } from 'react';\nimport { useParams } from 'react-router-dom';\nimport { injectIntl, intlShape } from '@edx/frontend-platform/i18n';\n\nimport { LearningHeader as Header } from '@edx/frontend-component-header';\nimport PageLoading from '../../generic/PageLoading';\nimport { unsubscribeFromCourseGoal } from '../data/api';\n\nimport messages from './messages';\nimport ResultPage from './ResultPage';\n\nfunction GoalUnsubscribe({ intl }) {\n const { token } = useParams();\n const [error, setError] = useState(false);\n const [isLoading, setIsLoading] = useState(true);\n const [data, setData] = useState({});\n\n // We don't need to bother with redux for this simple page. We're not sharing state with other pages at all.\n useEffect(() => {\n unsubscribeFromCourseGoal(token)\n .then(\n (result) => {\n setIsLoading(false);\n setData(result.data);\n },\n () => {\n setIsLoading(false);\n setError(true);\n },\n );\n }, []); // deps=[] to only run once\n\n return (\n <>\n {intl.formatMessage(messages.unverifiedPendingBody)}
);\n } else {\n body = (\n{header}
\n\n {intl.formatMessage(messages.percentComplete, { percent: completePercentage })}\n {intl.formatMessage(messages.percentIncomplete, { percent: incompletePercentage })}\n {lockedPercentage > 0 && (\n <>\n {intl.formatMessage(messages.percentLocked, { percent: lockedPercentage })}\n \n )}\n
\n \n );\n}\n\nCompletionDonutChart.propTypes = {\n intl: intlShape.isRequired,\n};\n\nexport default injectIntl(CompletionDonutChart);\n","import React from 'react';\nimport { injectIntl, intlShape } from '@edx/frontend-platform/i18n';\n\nimport CompletionDonutChart from './CompletionDonutChart';\nimport messages from './messages';\n\nfunction CourseCompletion({ intl }) {\n return (\n \n
\n \n
\n {intl.formatMessage(messages.courseCompletion)}
\n\n {intl.formatMessage(messages.completionBody)}\n
\n\n
\n - \n {orderedGradeRange.map((range, index) => {\n if (index === 0) {\n return (\n
- \n {range[0]}: {(range[1] * 100).toFixed(0)}%-100%\n \n );\n }\n const previousGrade = orderedGradeRange[index - 1];\n return (\n
- \n {range[0]}: {(range[1] * 100).toFixed(0)}%-{(previousGrade[1] * 100).toFixed(0)}%\n \n );\n })}\n
- F: {'<'}{passingGrade}% \n
\n
\n );\n}\n\nCourseGradeFooter.propTypes = {\n intl: intlShape.isRequired,\n passingGrade: PropTypes.number.isRequired,\n};\n\nexport default injectIntl(CourseGradeFooter);\n","import React from 'react';\nimport { useSelector } from 'react-redux';\n\nimport { sendTrackEvent } from '@edx/frontend-platform/analytics';\nimport { getAuthenticatedUser } from '@edx/frontend-platform/auth';\nimport { injectIntl, intlShape } from '@edx/frontend-platform/i18n';\nimport { Locked } from '@edx/paragon/icons';\nimport { Button, Icon } from '@edx/paragon';\n\nimport { useModel } from '../../../../generic/model-store';\nimport messages from '../messages';\n\nfunction CourseGradeHeader({ intl }) {\n const {\n courseId,\n } = useSelector(state => state.courseHome);\n const {\n org,\n } = useModel('courseHomeMeta', courseId);\n const {\n verifiedMode,\n gradesFeatureIsFullyLocked,\n } = useModel('progress', courseId);\n\n const eventProperties = {\n org_key: org,\n courserun_key: courseId,\n };\n\n const { administrator } = getAuthenticatedUser();\n const logUpgradeButtonClick = () => {\n sendTrackEvent('edx.ui.lms.course_progress.grades_upgrade.clicked', {\n org_key: org,\n courserun_key: courseId,\n is_staff: administrator,\n });\n sendTrackEvent('edx.bi.ecommerce.upsell_links_clicked', {\n ...eventProperties,\n linkCategory: '(none)',\n linkName: 'progress_locked',\n linkType: 'button',\n pageName: 'progress',\n });\n };\n let previewText;\n if (verifiedMode) {\n previewText = gradesFeatureIsFullyLocked\n ? intl.formatMessage(messages.courseGradePreviewUnlockCertificateBody)\n : intl.formatMessage(messages.courseGradePartialPreviewUnlockCertificateBody);\n } else {\n previewText = intl.formatMessage(messages.courseGradePreviewUpgradeDeadlinePassedBody);\n }\n return (\n \n {icon}\n
\n \n \n \n {footerText}\n {hasLetterGrades && (\n \n \n \n \n \n {footerText}\n {hasLetterGrades && (\n \n \n \n
\n \n
\n );\n}\n\nCourseGradeHeader.propTypes = {\n intl: intlShape.isRequired,\n};\n\nexport default injectIntl(CourseGradeHeader);\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport { useSelector } from 'react-redux';\n\nimport {\n getLocale, injectIntl, intlShape, isRtl,\n} from '@edx/frontend-platform/i18n';\nimport { OverlayTrigger, Popover } from '@edx/paragon';\n\nimport { useModel } from '../../../../generic/model-store';\n\nimport messages from '../messages';\n\nfunction CurrentGradeTooltip({ intl, tooltipClassName }) {\n const {\n courseId,\n } = useSelector(state => state.courseHome);\n\n const {\n courseGrade: {\n isPassing,\n visiblePercent,\n },\n } = useModel('progress', courseId);\n\n const currentGrade = Number((visiblePercent * 100).toFixed(0));\n\n let currentGradeDirection = currentGrade < 50 ? '' : '-';\n\n const isLocaleRtl = isRtl(getLocale());\n\n if (isLocaleRtl) {\n currentGradeDirection = currentGrade < 50 ? '-' : '';\n }\n\n return (\n <>\n \n
\n {verifiedMode && (\n \n
\n \n
\n \n \n {intl.formatMessage(messages.courseGradePreviewHeaderAriaHidden)}\n \n {gradesFeatureIsFullyLocked\n ? intl.formatMessage(messages.courseGradePreviewHeaderLocked)\n : intl.formatMessage(messages.courseGradePreviewHeaderLimited)}\n
\n \n
\n \n {previewText}\n
\n \n \n
\n )}\n \n
\n );\n}\n\nGradeBar.propTypes = {\n intl: intlShape.isRequired,\n passingGrade: PropTypes.number.isRequired,\n};\n\nexport default injectIntl(GradeBar);\n","import React from 'react';\nimport { useSelector } from 'react-redux';\nimport { injectIntl, intlShape } from '@edx/frontend-platform/i18n';\n\nimport { useModel } from '../../../../generic/model-store';\n\nimport CourseGradeFooter from './CourseGradeFooter';\nimport CourseGradeHeader from './CourseGradeHeader';\nimport GradeBar from './GradeBar';\n\nimport messages from '../messages';\n\nfunction CourseGrade({ intl }) {\n const {\n courseId,\n } = useSelector(state => state.courseHome);\n\n const {\n gradesFeatureIsFullyLocked,\n gradesFeatureIsPartiallyLocked,\n gradingPolicy: {\n gradeRange,\n },\n } = useModel('progress', courseId);\n\n const passingGrade = Number((Math.min(...Object.values(gradeRange)) * 100).toFixed(0));\n\n const applyLockedOverlay = gradesFeatureIsFullyLocked ? 'locked-overlay' : '';\n\n return (\n {intl.formatMessage(messages.courseGradeBarAltText, { currentGrade, passingGrade })}
\n \n \n
\n \n
\n \n
\n {intl.formatMessage(messages.grades)}
\n\n {intl.formatMessage(messages.courseGradeBody)}\n
\n\n
\n \n );\n}\n\nProblemScoreDrawer.propTypes = {\n intl: intlShape.isRequired,\n problemScores: PropTypes.arrayOf(PropTypes.shape({\n earned: PropTypes.number.isRequired,\n possible: PropTypes.number.isRequired,\n })).isRequired,\n subsection: PropTypes.shape({ learnerHasAccess: PropTypes.bool }).isRequired,\n};\n\nexport default injectIntl(ProblemScoreDrawer);\n","import React from 'react';\nimport { useSelector } from 'react-redux';\nimport PropTypes from 'prop-types';\n\nimport { sendTrackEvent } from '@edx/frontend-platform/analytics';\nimport { getAuthenticatedUser } from '@edx/frontend-platform/auth';\nimport { injectIntl, intlShape } from '@edx/frontend-platform/i18n';\nimport { Collapsible, Icon, Row } from '@edx/paragon';\nimport { ArrowDropDown, ArrowDropUp, Blocked } from '@edx/paragon/icons';\n\nimport messages from '../messages';\nimport { useModel } from '../../../../generic/model-store';\nimport ProblemScoreDrawer from './ProblemScoreDrawer';\n\nfunction SubsectionTitleCell({ intl, subsection }) {\n const {\n courseId,\n } = useSelector(state => state.courseHome);\n const {\n org,\n } = useModel('courseHomeMeta', courseId);\n const {\n gradesFeatureIsFullyLocked,\n } = useModel('progress', courseId);\n\n const {\n blockKey,\n displayName,\n problemScores,\n url,\n } = subsection;\n\n const { administrator } = getAuthenticatedUser();\n const logSubsectionClicked = () => {\n sendTrackEvent('edx.ui.lms.course_progress.detailed_grades_assignment.clicked', {\n org_key: org,\n courserun_key: courseId,\n is_staff: administrator,\n assignment_block_key: blockKey,\n });\n };\n\n return (\n - \n {problemScores.map(problemScore => (\n
- {problemScore.earned}/{problemScore.possible} \n ))}\n
\n \n
\n );\n })\n );\n}\n\nDetailedGradesTable.propTypes = {\n intl: intlShape.isRequired,\n};\n\nexport default injectIntl(DetailedGradesTable);\n","import React from 'react';\nimport { useSelector } from 'react-redux';\n\nimport { getConfig } from '@edx/frontend-platform';\nimport { sendTrackEvent } from '@edx/frontend-platform/analytics';\nimport { getAuthenticatedUser } from '@edx/frontend-platform/auth';\nimport { FormattedMessage, injectIntl, intlShape } from '@edx/frontend-platform/i18n';\nimport { Blocked } from '@edx/paragon/icons';\nimport { Icon, Hyperlink } from '@edx/paragon';\nimport { useModel } from '../../../../generic/model-store';\n\nimport DetailedGradesTable from './DetailedGradesTable';\n\nimport messages from '../messages';\n\nfunction DetailedGrades({ intl }) {\n const { administrator } = getAuthenticatedUser();\n const {\n courseId,\n } = useSelector(state => state.courseHome);\n const {\n org,\n } = useModel('courseHomeMeta', courseId);\n const {\n gradesFeatureIsFullyLocked,\n gradesFeatureIsPartiallyLocked,\n sectionScores,\n } = useModel('progress', courseId);\n\n const hasSectionScores = sectionScores.length > 0;\n\n const logOutlineLinkClick = () => {\n sendTrackEvent('edx.ui.lms.course_progress.detailed_grades.course_outline_link.clicked', {\n org_key: org,\n courserun_key: courseId,\n is_staff: administrator,\n });\n };\n\n const outlineLink = (\n {intl.formatMessage(messages.detailedGrades)}
\n {gradesFeatureIsPartiallyLocked && (\n\n
\n )}\n {hasSectionScores && (\n {intl.formatMessage(messages.detailedGradesEmpty)}
\n )}\n\n
\n \n \n {intl.formatMessage(messages.gradeSummaryTooltipBody)}\n \n \n )}\n >\n { setShowTooltip(!showTooltip); }}\n onBlur={() => { setShowTooltip(false); }}\n alt={intl.formatMessage(messages.gradeSummaryTooltipAlt)}\n src={InfoOutline}\n iconAs={Icon}\n className=\"mb-3\"\n size=\"sm\"\n disabled={gradesFeatureIsFullyLocked}\n />\n \n {!gradesFeatureIsFullyLocked && allOfSomeAssignmentTypeIsLocked && (\n
\n );\n}\n\nGradeSummaryHeader.propTypes = {\n intl: intlShape.isRequired,\n allOfSomeAssignmentTypeIsLocked: PropTypes.bool.isRequired,\n};\n\nexport default injectIntl(GradeSummaryHeader);\n","import React from 'react';\nimport { useSelector } from 'react-redux';\nimport PropTypes from 'prop-types';\nimport { injectIntl, intlShape } from '@edx/frontend-platform/i18n';\nimport { Blocked } from '@edx/paragon/icons';\nimport { Icon } from '@edx/paragon';\nimport { useModel } from '../../../../generic/model-store';\nimport messages from '../messages';\n\nfunction AssignmentTypeCell({\n intl, assignmentType, footnoteMarker, footnoteId, locked,\n}) {\n const {\n courseId,\n } = useSelector(state => state.courseHome);\n\n const {\n gradesFeatureIsFullyLocked,\n } = useModel('progress', courseId);\n\n const lockedIcon = locked ? {intl.formatMessage(messages.gradeSummary)}
\n\n
\n )}\n \n
\n );\n}\n\nAssignmentTypeCell.propTypes = {\n intl: intlShape.isRequired,\n assignmentType: PropTypes.string.isRequired,\n footnoteId: PropTypes.string,\n footnoteMarker: PropTypes.number,\n locked: PropTypes.bool,\n};\n\nAssignmentTypeCell.defaultProps = {\n footnoteId: '',\n footnoteMarker: null,\n locked: false,\n};\n\nexport default injectIntl(AssignmentTypeCell);\n","import React from 'react';\nimport { useSelector } from 'react-redux';\nimport PropTypes from 'prop-types';\n\nimport { FormattedMessage, injectIntl, intlShape } from '@edx/frontend-platform/i18n';\n\nimport messages from '../messages';\nimport { useModel } from '../../../../generic/model-store';\n\nfunction DroppableAssignmentFootnote({ footnotes, intl }) {\n const {\n courseId,\n } = useSelector(state => state.courseHome);\n const {\n gradesFeatureIsFullyLocked,\n } = useModel('progress', courseId);\n return (\n <>\n {intl.formatMessage(messages.footnotesTitle)}\n {lockedIcon}
\n \n {assignmentType} \n {footnoteId && footnoteMarker && (\n \n \n {footnoteMarker}\n \n \n )}\n
\n - \n {footnotes.map((footnote, index) => (\n
- \n {index + 1}\n
\n
\n {intl.formatMessage(messages.weightedGradeSummary)}
\n {totalGrade}%
\n \n
\n \n );\n}\n\nProgressHeader.propTypes = {\n intl: intlShape.isRequired,\n};\n\nexport default injectIntl(ProgressHeader);\n","import { defineMessages } from '@edx/frontend-platform/i18n';\n\nconst messages = defineMessages({\n datesCardDescription: {\n id: 'progress.relatedLinks.datesCard.description',\n defaultMessage: 'A schedule view of your course due dates and upcoming assignments.',\n },\n datesCardLink: {\n id: 'progress.relatedLinks.datesCard.link',\n defaultMessage: 'Dates',\n },\n outlineCardDescription: {\n id: 'progress.relatedLinks.outlineCard.description',\n defaultMessage: 'A birds-eye view of your course content.',\n },\n outlineCardLink: {\n id: 'progress.relatedLinks.outlineCard.link',\n defaultMessage: 'Course Outline',\n },\n relatedLinks: {\n id: 'progress.relatedLinks',\n defaultMessage: 'Related links',\n },\n});\n\nexport default messages;\n","import React from 'react';\nimport { useSelector } from 'react-redux';\n\nimport { getConfig } from '@edx/frontend-platform';\nimport { sendTrackEvent } from '@edx/frontend-platform/analytics';\nimport { getAuthenticatedUser } from '@edx/frontend-platform/auth';\nimport { injectIntl, intlShape } from '@edx/frontend-platform/i18n';\nimport { Hyperlink } from '@edx/paragon';\n\nimport messages from './messages';\nimport { useModel } from '../../../generic/model-store';\n\nfunction RelatedLinks({ intl }) {\n const {\n courseId,\n } = useSelector(state => state.courseHome);\n const {\n org,\n } = useModel('courseHomeMeta', courseId);\n\n const { administrator } = getAuthenticatedUser();\n const logLinkClicked = (linkName) => {\n sendTrackEvent('edx.ui.lms.course_progress.related_links.clicked', {\n org_key: org,\n courserun_key: courseId,\n is_staff: administrator,\n link_clicked: linkName,\n });\n };\n\n return (\n {pageTitle}
\n {administrator && studioUrl && (\n \n )}\n{intl.formatMessage(messages.relatedLinks)}
\n- \n
- \n
logLinkClicked('dates')}>\n {intl.formatMessage(messages.datesCardLink)}\n \n{intl.formatMessage(messages.datesCardDescription)}
\n \n - \n
logLinkClicked('course_outline')}>\n {intl.formatMessage(messages.outlineCardLink)}\n \n{intl.formatMessage(messages.outlineCardDescription)}
\n \n
\n {/* Main body */}\n
\n \n );\n}\n\nexport default ProgressTab;\n","import { defineMessages } from '@edx/frontend-platform/i18n';\n\nconst messages = defineMessages({\n glossaryHeader: {\n id: 'glossary.header',\n defaultMessage: 'Glossary',\n },\n studioLink: {\n id: 'glossary.link.studio',\n defaultMessage: 'View grading in Studio',\n },\n});\n\nexport default messages;\n","import React, {\n useState,\n useEffect,\n useContext,\n createContext,\n} from 'react';\n\nimport PropTypes from 'prop-types';\nimport { useSelector } from 'react-redux';\nimport { injectIntl, intlShape } from '@edx/frontend-platform/i18n';\nimport './GlossaryTab.scss';\nimport { getConfig } from '@edx/frontend-platform';\n\nimport {\n DropdownButton,\n Collapsible,\n Icon,\n ActionRow,\n SearchField,\n Pagination,\n Form,\n} from '@edx/paragon';\n\nimport { ExpandLess, ExpandMore } from '@edx/paragon/icons';\nimport { getGlossaryData } from '../data/api';\nimport messages from './messages';\n\n// Getting all necessary contexts and variables\nexport const CourseContext = createContext();\nexport const KeyTermContext = createContext();\nconst ListViewContext = createContext();\nconst queryParams = new URLSearchParams(window.location.search);\nconst scrolltoParam = queryParams.get('scrollTo');\nconst paginationLength = 15;\n\n// Lists all resources\nfunction ResourceList() {\n const { resources } = useContext(KeyTermContext);\n\n resources.sort((a, b) => (a.friendly_name > b.friendly_name ? 1 : -1));\n\n if (resources.length > 0) {\n return (\n \n \n \n
\n\n {/* Side panel */}\n \n
\n \n \n \n
\n \n References:\n {\n resources.map(resource => (\n \n ))\n }\n
\n );\n }\n return null;\n}\n\n// Lists all lessons\nfunction Lessons() {\n const { lessons } = useContext(KeyTermContext);\n\n // Sorting list by module name then by lesson name\n lessons.sort((a, b) => {\n if (a.module_name === b.module_name) {\n if (a.lesson_name > b.lesson_name) { return 1; }\n return -1;\n }\n if (a.module_name > b.module_name) { return 1; }\n\n return -1;\n });\n\n if (lessons.length > 0) {\n return (\n \n Lessons\n {\n lessons.map(lesson => (\n
\n );\n }\n return null;\n}\n\n// Gets a specific textbook\nfunction Lesson({ lesson }) {\n const { courseId } = useContext(CourseContext);\n const encodedCourse = courseId.replace(' ', '+');\n return (\n \n \n {lesson.module_name}>{lesson.lesson_name}>{lesson.unit_name}\n \n
\n );\n}\n\n// Gets a specific textbook\nfunction Textbook({ textbook }) {\n const { courseId } = useContext(CourseContext);\n const assetId = courseId.replace('course', 'asset');\n\n const lmsTextbookLink = `${getConfig().LMS_BASE_URL}/${assetId}+type@asset+block@${textbook.textbook_link}#page=${textbook.page_num}`;\n\n return (\n\n {textbook.chapter}, pg. {textbook.page_num} \n
\n );\n}\n\n// Lists all textbooks\nfunction TextbookList() {\n const { textbooks } = useContext(KeyTermContext);\n if (textbooks.length > 0) {\n return (\n\n Textbooks\n {\n textbooks.map(textbook => (\n
\n );\n }\n return null;\n}\n\n// Lists all definitions\nfunction DefinitionsList() {\n const { definitions } = useContext(KeyTermContext);\n if (definitions.length > 0) {\n return (\n \n Definitions\n {definitions.map((descr) => (\n
\n );\n }\n return null;\n}\n\n// Refers to one key term.\nfunction KeyTerm({ index }) {\n /* eslint-disable camelcase */\n const { key_name } = useContext(KeyTermContext);\n\n return (\n \n
\n ))}\n {descr.description}
\n\n {key_name}}\n styling=\"card-lg\"\n iconWhenOpen={
\n );\n /* eslint-enable camelcase */\n}\n\n// All the data needed for a keyterm.\nfunction KeyTermData() {\n return (\n \n
\n );\n}\n\n// Filter modules button\nfunction ModuleDropdown(termData) {\n const { filterModules, setFilterModules } = useContext(ListViewContext);\n const lessons = [];\n const newSet = new Set();\n\n termData.value.termData.filter((keyTerm) => keyTerm.lessons.forEach(lesson => {\n if (lessons.find(object => object.module_name === lesson.module_name) === undefined) { lessons.push(lesson); }\n }));\n\n lessons.sort((a, b) => (a.module_name > b.module_name ? 1 : -1));\n\n const handleChange = e => {\n filterModules.forEach(item => { newSet.add(item); });\n if (e.target.checked) { newSet.add(e.target.value); } else { newSet.delete(e.target.value); }\n return setFilterModules(newSet);\n };\n\n const buttontitle = filterModules.size > 0 ? `Filter Modules (${filterModules.size})` : 'Filter Modules';\n return (\n \n {displayTerms.length === 0 ? (\n \n ))}\n
\n );\n}\n\n// Refers to the whole glossary page\nfunction GlossaryTab({ intl }) {\n const { courseId } = useSelector(state => state.courseHome);\n const [searchQuery, setSearchQuery] = useState('');\n const [filterModules, setFilterModules] = useState(new Set());\n const [termData, setTermData] = useState([]);\n const [selectedPage, setSelectedPage] = useState(1);\n const [pagination, setPagination] = useState();\n const [expandAll, setExpandAll] = useState(false);\n\n useEffect(() => {\n getGlossaryData(courseId)\n .then((keytermData) => setTermData(keytermData));\n }, []);\n\n return (\n <>\n {/* Header */}\n No Terms to Display...
) : null}\n {paginate(displayTerms, paginationLength, selectedPage).map((keyTerm, index) => (\n\n {intl.formatMessage(messages.glossaryHeader)}\n
\n\n {/* Search Functions */}\n \n Displaying {pagination > 0 ? 1 + paginationLength * (selectedPage - 1) : 0}\n -\n {pagination * paginationLength < paginationLength\n ? parseInt(pagination * paginationLength, 10)\n : paginationLength * selectedPage}{' '}\n of {parseInt(pagination * paginationLength, 10)} items\n
\n\n {pagination === 0 ? null : (\n parseInt(pagination, 10)\n ? parseInt(pagination, 10) + 1\n : pagination\n }\n onPageSelect={(value) => setSelectedPage(value)}\n />\n )}\n
\n \n {isRedirected === true ? null : children}\n
\n );\n};\n\nNoticesProvider.propTypes = {\n children: PropTypes.node.isRequired,\n};\n\nexport default NoticesProvider;\n","import 'core-js/stable';\nimport 'regenerator-runtime/runtime';\n\nimport {\n APP_INIT_ERROR, APP_READY, subscribe, initialize,\n mergeConfig,\n} from '@edx/frontend-platform';\nimport { AppProvider, ErrorPage, PageRoute } from '@edx/frontend-platform/react';\nimport React from 'react';\nimport ReactDOM from 'react-dom';\nimport { Switch } from 'react-router-dom';\n\nimport { messages as footerMessages } from '@edx/frontend-component-footer';\n\nimport appMessages from './i18n';\nimport { UserMessagesProvider } from './generic/user-messages';\n\nimport './index.scss';\nimport OutlineTab from './course-home/outline-tab';\nimport { CourseExit } from './courseware/course/course-exit';\nimport CoursewareContainer from './courseware';\nimport CoursewareRedirectLandingPage from './courseware/CoursewareRedirectLandingPage';\nimport { BadgeProgressTab, BadgeLeaderboardTab } from './course-home/badges-tab';\nimport DatesTab from './course-home/dates-tab';\nimport GoalUnsubscribe from './course-home/goal-unsubscribe';\nimport ProgressTab from './course-home/progress-tab/ProgressTab';\nimport GlossaryTab from './course-home/glossary-tab';\nimport { TabContainer } from './tab-page';\n\nimport {\n fetchBadgeProgressTab, fetchBadgeLeaderboardTab, fetchDatesTab, fetchOutlineTab, fetchProgressTab, fetchGlossaryTab,\n} from './course-home/data';\nimport { fetchCourse } from './courseware/data';\nimport initializeStore from './store';\nimport NoticesProvider from './generic/notices';\n\nsubscribe(APP_READY, () => {\n ReactDOM.render(\n