\n
\n \n
\n);\n\nCoursewareSearchEmpty.propTypes = {\n intl: intlShape.isRequired,\n};\n\nexport default injectIntl(CoursewareSearchEmpty);\n","import React from 'react';\nimport {\n Folder, TextFields, VideoCamera, Article,\n} from '@openedx/paragon/icons';\nimport { getConfig } from '@edx/frontend-platform';\nimport { Icon } from '@openedx/paragon';\nimport PropTypes from 'prop-types';\nimport CoursewareSearchEmpty from './CoursewareSearchEmpty';\n\nconst iconTypeMapping = {\n text: TextFields,\n video: VideoCamera,\n sequence: Folder,\n other: Article,\n};\n\nconst defaultIcon = Article;\n\nconst CoursewareSearchResults = ({ results = [] }) => {\n if (!results?.length) {\n return {intl.formatMessage(messages.searchResultsNone)}
\n\n {results.map(({\n id,\n title,\n type,\n location,\n url,\n contentHits,\n }) => {\n const key = type.toLowerCase();\n const icon = iconTypeMapping[key] || defaultIcon;\n const isExternal = !url.startsWith('/');\n const linkProps = isExternal ? {\n href: url,\n target: '_blank',\n rel: 'nofollow',\n } : { href: `${baseUrl}${url}` };\n\n return (\n \n
\n );\n};\n\nCoursewareSearchResults.propTypes = {\n results: PropTypes.arrayOf(PropTypes.shape({\n id: PropTypes.string,\n title: PropTypes.string,\n type: PropTypes.string,\n location: PropTypes.arrayOf(PropTypes.string),\n url: PropTypes.string,\n contentHits: PropTypes.number,\n })),\n};\n\nCoursewareSearchResults.defaultProps = {\n results: [],\n};\n\nexport default CoursewareSearchResults;\n","import React, { useMemo } from 'react';\nimport { injectIntl, intlShape } from '@edx/frontend-platform/i18n';\nimport { Tabs, Tab } from '@openedx/paragon';\n\nimport { useParams } from 'react-router';\nimport CoursewareSearchResults from './CoursewareSearchResults';\nimport messages from './messages';\nimport { useCoursewareSearchParams } from './hooks';\nimport { useModel } from '../../generic/model-store';\n\nconst filterAll = 'all';\nconst filterTypes = ['text', 'video', 'sequence'];\nconst filterOther = 'other';\nconst validFilters = [filterAll, ...filterTypes, filterOther];\n\nexport const CoursewareSearchResultsFilter = ({ intl }) => {\n const { courseId } = useParams();\n const lastSearch = useModel('contentSearchResults', courseId);\n const { filter: filterKeyword, setFilter } = useCoursewareSearchParams();\n\n if (!lastSearch) { return null; }\n\n const { results: data = [] } = lastSearch;\n\n // If there's no data, we show an empty result.\n if (!data.length) { return \n
\n \n );\n })}\n \n {title}\n {contentHits ? ({contentHits}) : null }\n
\n {location?.length ? (\n - \n {\n // This ignore is necessary because the breadcrumb texts might have duplicates.\n // The breadcrumbs are not expected to change.\n // eslint-disable-next-line react/no-array-index-key\n location.map((breadcrumb, i) => (
- {breadcrumb}))\n }\n
\n
\n \n
\n \n \n \n {intl.formatMessage(messages.searchResultsError)}\n \n )}\n {status === 'results' ? (\n <>\n {total > 0 ? (\n {intl.formatMessage(messages.searchResultsLabel, { total, keyword: lastSearchKeyword })}\n
\n ) : null}\n {intl.formatMessage(messages.searchModuleTitle)}
\n\n
\n ) : null}\n {status === 'error' && (\n {intl.formatMessage(messages.congrats)}
\n )}\n {...rest}\n >\n <>\n{intl.formatMessage(messages.completed)}
\n {!wideScreen &&\n {intl.formatMessage(messages.earned)} {intl.formatMessage(messages.share)}\n
\n{intl.formatMessage(messages.goalMet)}
\n )}\n {...rest}\n >\n <>\n\n {daysPerWeek} {daysPerWeek === 1 ? 'time' : 'times'}),\n }}\n />\n
\n \n 
\n
\n \n
\n \n \n );\n};\n\nWeeklyGoalCelebrationModal.propTypes = {\n courseId: PropTypes.string.isRequired,\n daysPerWeek: PropTypes.number.isRequired,\n intl: intlShape.isRequired,\n isOpen: PropTypes.bool.isRequired,\n onClose: PropTypes.func.isRequired,\n};\n\nexport default injectIntl(WeeklyGoalCelebrationModal);\n","import { defineMessages } from '@edx/frontend-platform/i18n';\n\nconst messages = defineMessages({\n 'calculator.button.label': {\n id: 'calculator.button.label',\n defaultMessage: 'Calculator',\n description: 'Button label to expand or close the calculator',\n },\n 'calculator.input.field.label': {\n id: 'calculator.input.field.label',\n defaultMessage: 'Calculator Input',\n description: 'label for calculator input',\n },\n 'calculator.submit.button.label': {\n id: 'calculator.submit.button.label',\n defaultMessage: 'Calculate',\n description: 'Submit button label to execute the calculator',\n },\n 'calculator.result.field.label': {\n id: 'calculator.result.field.label',\n defaultMessage: 'Calculator Result',\n description: 'label for calculator result',\n },\n 'calculator.result.field.placeholder': {\n id: 'calculator.result.field.placeholder',\n defaultMessage: 'Result',\n description: 'placeholder for calculator result',\n },\n});\n\nexport default messages;\n","import React, { Component } from 'react';\nimport { Collapsible } from '@openedx/paragon';\nimport { getConfig } from '@edx/frontend-platform';\nimport { getAuthenticatedHttpClient } from '@edx/frontend-platform/auth';\nimport {\n FormattedMessage, injectIntl, intlShape,\n} from '@edx/frontend-platform/i18n';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport {\n faCalculator, faQuestionCircle, faTimesCircle, faEquals,\n} from '@fortawesome/free-solid-svg-icons';\nimport messages from './messages';\n\nclass Calculator extends Component {\n constructor(props) {\n super(props);\n this.state = {\n equation: '',\n result: '',\n };\n this.handleSubmit = this.handleSubmit.bind(this);\n }\n\n async handleSubmit(event) {\n event.preventDefault();\n event.stopPropagation();\n const urlEncoded = new URLSearchParams();\n urlEncoded.append('equation', this.state.equation);\n\n const response = await getAuthenticatedHttpClient().get(\n `${getConfig().LMS_BASE_URL}/calculate?${urlEncoded.toString()}`,\n );\n this.setState(() => ({ result: response.data.result }));\n }\n\n changeEquation(value) {\n this.setState(() => ({ equation: value }));\n }\n\n render() {\n return (\n \n achieve higher performance),\n }}\n />\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 e, pi | \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};\n\nContentTools.propTypes = {\n course: PropTypes.shape({\n notes: PropTypes.shape({\n enabled: PropTypes.bool,\n }),\n showCalculator: PropTypes.bool,\n }).isRequired,\n};\n\nexport default ContentTools;\n","import ContentTools from './ContentTools';\n\nexport default ContentTools;\n","/* eslint-disable no-param-reassign */\nimport { createSlice } from '@reduxjs/toolkit';\n\nexport const LOADING = 'loading';\nexport const LOADED = 'loaded';\nexport const FAILED = 'failed';\n\nconst slice = createSlice({\n courseId: null,\n name: 'recommendations',\n initialState: {\n recommendationsStatus: LOADING,\n },\n reducers: {\n fetchCourseRecommendationsRequest: (state, { payload }) => {\n state.courseId = payload.courseId;\n state.recommendationsStatus = LOADING;\n },\n fetchCourseRecommendationsSuccess: (state, { payload }) => {\n state.courseId = payload.courseId;\n state.recommendationsStatus = LOADED;\n },\n fetchCourseRecommendationsFailure: (state, { payload }) => {\n state.courseId = payload.courseId;\n state.recommendationsStatus = FAILED;\n },\n },\n});\n\nexport const {\n fetchCourseRecommendationsRequest,\n fetchCourseRecommendationsSuccess,\n fetchCourseRecommendationsFailure,\n} = slice.actions;\n\nexport const {\n reducer,\n} = slice;\n","import { logError } from '@edx/frontend-platform/logging';\n\nimport {\n fetchCourseRecommendationsFailure,\n fetchCourseRecommendationsRequest,\n fetchCourseRecommendationsSuccess,\n} from './slice';\nimport {\n getCourseRecommendations,\n postUnsubscribeFromGoalReminders,\n} from './api';\nimport { updateModel } from '../../../../generic/model-store';\n\nexport default function fetchCourseRecommendations(courseKey, courseId) {\n return async (dispatch) => {\n dispatch(fetchCourseRecommendationsRequest({ courseId }));\n try {\n const recommendations = await getCourseRecommendations(courseKey);\n dispatch(updateModel({\n modelType: 'coursewareMeta',\n model: {\n id: courseId,\n recommendations,\n },\n }));\n dispatch(fetchCourseRecommendationsSuccess({ courseId }));\n } catch (error) {\n logError(error);\n dispatch(fetchCourseRecommendationsFailure({ courseId }));\n }\n };\n}\n\nexport async function unsubscribeFromGoalReminders(courseId, daysPerWeek, subscribedToReminders) {\n return postUnsubscribeFromGoalReminders(courseId, daysPerWeek, subscribedToReminders);\n}\n","import { getConfig, camelCaseObject } from '@edx/frontend-platform';\nimport { getAuthenticatedHttpClient } from '@edx/frontend-platform/auth';\n\nfunction filterRecommendationsList(\n {\n data: {\n uuid,\n recommendations,\n },\n },\n {\n data: enrollments,\n },\n) {\n const enrollmentRunIds = enrollments.map(({\n courseDetails: {\n courseId,\n },\n }) => courseId);\n\n return recommendations.filter(({ uuid: recUuid, courseRunKeys }) => (\n recUuid !== uuid && courseRunKeys.every((key) => !enrollmentRunIds.includes(key))\n ));\n}\n\nexport async function getCourseRecommendations(courseKey) {\n const discoveryApiUrl = getConfig().DISCOVERY_API_BASE_URL;\n if (!discoveryApiUrl) {\n return [];\n }\n const recommendationsUrl = new URL(`${discoveryApiUrl}/api/v1/course_recommendations/${courseKey}?exclude_utm=true`);\n const enrollmentsUrl = new URL(`${getConfig().LMS_BASE_URL}/api/enrollment/v1/enrollment`);\n const [recommendationsResponse, enrollmentsResponse] = await Promise.all([\n getAuthenticatedHttpClient().get(recommendationsUrl),\n getAuthenticatedHttpClient().get(enrollmentsUrl),\n ]);\n return filterRecommendationsList(camelCaseObject(recommendationsResponse), camelCaseObject(enrollmentsResponse));\n}\n\nexport async function postUnsubscribeFromGoalReminders(courseId) {\n const url = new URL(`${getConfig().LMS_BASE_URL}/api/course_home/save_course_goal`);\n return getAuthenticatedHttpClient().post(url.href, {\n course_id: courseId,\n subscribed_to_reminders: false,\n });\n}\n","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 status will be available 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 certificateNotAvailableEndDateBody: {\n id: 'courseCelebration.certificateBody.notAvailable.endDate',\n defaultMessage: 'Final grades and any earned certificates are scheduled to be available after {endDate}.',\n description: 'Shown for learners who have finished a course before grades and certificates are available.',\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 description: 'Header when learner finished or pass the course but need to upgrade to get a 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 description: 'Header text for course exit section',\n },\n congratulationsHeader: {\n id: 'courseCelebration.congratulationsHeader',\n defaultMessage: 'Congratulations!',\n description: 'Greeting learner for finishing the course',\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 description: 'Shown to learner when they finish all available assignments, but not the whole course',\n },\n courseInProgressHeader: {\n id: 'courseExit.courseInProgressHeader',\n defaultMessage: 'More content is coming soon!',\n description: 'Header when the status of the course not all of (contents or assignments) available yet',\n },\n dashboardLink: {\n id: 'courseExit.dashboardLink',\n defaultMessage: 'Dashboard',\n description: 'Link to user’s dashboard',\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 description: 'Shown to learner when they did not pass the course',\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 description: 'This text is shown on the button which usually links to the next unit or assignment in course sequence, however when it is the last unit. The button will link to course exit page',\n },\n nextButtonEnd: {\n id: 'courseExit.nextButton.endOfCourse',\n defaultMessage: 'Next (end of course)',\n description: 'This shown for the button which links to the next unit, when learner did not pass the 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 description: 'This shown to learner when the course they completed is the last one of a program, the program might be mircomaster, or microbachelors...etc',\n },\n requestCertificateBodyText: {\n id: 'courseCelebration.requestCertificateBodyText',\n defaultMessage: 'In order to access your certificate, request it below.',\n description: 'Shown when learner need to request the certifcate',\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 description: 'Recommending an action when learner pass the course',\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 description: 'Shown when the status of verification is pending',\n },\n verifiedCertificateSupportLink: {\n id: 'courseExit.verifiedCertificateSupportLink',\n defaultMessage: 'Learn more about verified certificates',\n description: 'Anchor text for link that redirect to external help page 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 { 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 entranceExamFail: 4,\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 canImmediatelyViewCertificate = false,\n entranceExamPassed = null,\n) {\n const authenticatedUser = getAuthenticatedUser();\n\n if (entranceExamPassed === false) {\n return COURSE_EXIT_MODES.entranceExamFail;\n }\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 && canImmediatelyViewCertificate) {\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 entranceExamData: { entranceExamPassed },\n } = useModel('coursewareMeta', courseId);\n const { canViewCertificate } = useModel('courseHomeMeta', courseId);\n const exitMode = getCourseExitMode(\n certificateData,\n hasScheduledContent,\n isEnrolled,\n userHasPassingGrade,\n courseExitPageIsActive,\n canViewCertificate,\n entranceExamPassed,\n );\n\n /** exitActive is used to enable/disable the exit i.e. next buttons.\n COURSE_EXIT_MODES denote the current status of the course.\n Available COURSE_EXIT_MODES: disabled, celebration, nonPassing, inProgress, entranceExamFail\n If the user fails the entrance exam,\n access to further course sections should not be allowed i.e. disable the next buttons. */\n const exitActive = ((exitMode !== COURSE_EXIT_MODES.disabled) && (exitMode !== COURSE_EXIT_MODES.entranceExamFail));\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 { defineMessages } from '@edx/frontend-platform/i18n';\n\nconst messages = defineMessages({\n 'learn.course.license.allRightsReserved.text': {\n id: 'learn.course.license.allRightsReserved.text',\n defaultMessage: 'All Rights Reserved',\n description: 'License text shown when using All Rights Reserved license type.',\n },\n 'learn.course.license.creativeCommons.terms.preamble': {\n id: 'learn.course.license.creativeCommons.terms.preamble',\n defaultMessage: 'Creative Commons licensed content, with terms as follows:',\n description: 'Screen reader only text preamble before reading specific Creative Commons license terms.',\n },\n 'learn.course.license.creativeCommons.terms.by': {\n id: 'learn.course.license.creativeCommons.terms.by',\n defaultMessage: 'Attribution',\n description: 'Creative Commons license text for Attribution term.',\n },\n 'learn.course.license.creativeCommons.terms.nc': {\n id: 'learn.course.license.creativeCommons.terms.nc',\n defaultMessage: 'Noncommercial',\n description: 'Creative Commons license text for Noncommercial term.',\n },\n 'learn.course.license.creativeCommons.terms.nd': {\n id: 'learn.course.license.creativeCommons.terms.nd',\n defaultMessage: 'No Derivatives',\n description: 'Creative Commons license text for No Derivatives term.',\n },\n 'learn.course.license.creativeCommons.terms.sa': {\n id: 'learn.course.license.creativeCommons.terms.sa',\n defaultMessage: 'Share Alike',\n description: 'Creative Commons license text for Share Alike term.',\n },\n // No text for `zero` license\n 'learn.course.license.creativeCommons.terms.zero': {\n id: 'learn.course.license.creativeCommons.terms.zero',\n defaultMessage: 'No terms',\n description: 'Creative Commons license text for license with no terms.',\n },\n 'learn.course.license.creativeCommons.text': {\n id: 'learn.course.license.creativeCommons.text',\n defaultMessage: 'Some Rights Reserved',\n description: 'License text shown when using all Creative Commons license types.',\n },\n});\n\nexport default messages;\n","import { defineMessages } from '@edx/frontend-platform/i18n';\n\nconst messages = defineMessages({\n notificationTray: {\n id: 'notification.tray.container',\n defaultMessage: 'Notification tray',\n description: 'Notification tray container',\n },\n openNotificationTrigger: {\n id: 'notification.open.button',\n defaultMessage: 'Show notification tray',\n description: 'Button to open the notification tray and show notifications',\n },\n closeNotificationTrigger: {\n id: 'notification.close.button',\n defaultMessage: 'Close notification tray',\n description: 'Button for the learner to close the sidebar',\n },\n responsiveCloseNotificationTray: {\n id: 'responsive.close.notification',\n defaultMessage: 'Back to course',\n description: 'Responsive button to go back to course and close the notification tray',\n },\n notificationTitle: {\n id: 'notification.tray.title',\n defaultMessage: 'Notifications',\n description: 'Title text displayed for the notification tray',\n },\n noNotificationsMessage: {\n id: 'notification.tray.no.message',\n defaultMessage: 'You have no new notifications at this time.',\n description: 'Text displayed when the learner has no notifications',\n },\n});\n\nexport default messages;\n","import React from 'react';\n\nconst SidebarContext = React.createContext({});\n\nexport default SidebarContext;\n","import { defineMessages } from '@edx/frontend-platform/i18n';\n\nconst messages = defineMessages({\n discussionsTitle: {\n id: 'discussions.sidebar.title',\n defaultMessage: 'Discussions',\n description: 'Title text for a forum where users are able to discuss course topics',\n },\n discussionNotificationTray: {\n id: 'discussions.notification.tray.container',\n defaultMessage: 'Discussion and Notification tray',\n description: 'Discussion and Notification tray container',\n },\n notificationTitle: {\n id: 'notification.tray.title',\n defaultMessage: 'Notifications',\n description: 'Title text displayed for the notification tray',\n },\n closeTrigger: {\n id: 'tray.close.button',\n defaultMessage: 'Close tray',\n description: 'Button for the learner to close the sidebar',\n },\n openSidebarTrigger: {\n id: 'sidebar.open.button',\n defaultMessage: 'Show sidebar tray',\n description: 'Button to open the sidebar tray and shows notifications and didcussions',\n },\n responsiveCloseSidebarTray: {\n id: 'responsive.close.sidebar',\n defaultMessage: 'Back to course',\n description: 'Responsive button to go back to course and close the sidebar tray',\n },\n});\n\nexport default messages;\n","import React, { useCallback, useContext } from 'react';\nimport PropTypes from 'prop-types';\n\nimport classNames from 'classnames';\n\nimport { useIntl } from '@edx/frontend-platform/i18n';\nimport { Icon, IconButton } from '@openedx/paragon';\nimport { ArrowBackIos, Close } from '@openedx/paragon/icons';\n\nimport { useEventListener } from '../../../../generic/hooks';\nimport { WIDGETS } from '../../../../constants';\nimport messages from '../messages';\nimport SidebarContext from '../SidebarContext';\n\nconst SidebarBase = ({\n title,\n ariaLabel,\n sidebarId,\n className,\n children,\n showTitleBar,\n width,\n allowFullHeight,\n showBorder,\n}) => {\n const intl = useIntl();\n const {\n toggleSidebar,\n shouldDisplayFullScreen,\n currentSidebar,\n } = useContext(SidebarContext);\n\n const receiveMessage = useCallback(({ data }) => {\n const { type } = data;\n if (type === 'learning.events.sidebar.close') {\n toggleSidebar(currentSidebar, WIDGETS.DISCUSSIONS);\n }\n }, [toggleSidebar]);\n\n useEventListener('message', receiveMessage);\n\n return (\n \n {course.showCalculator && (\n
\n \n {title}\n
\n \n \n )}\n {children}\n \n );\n};\n\nSidebarBase.propTypes = {\n title: PropTypes.string,\n ariaLabel: PropTypes.string.isRequired,\n sidebarId: PropTypes.string.isRequired,\n className: PropTypes.string,\n children: PropTypes.element.isRequired,\n showTitleBar: PropTypes.bool,\n width: PropTypes.string,\n allowFullHeight: PropTypes.bool,\n showBorder: PropTypes.bool,\n};\n\nSidebarBase.defaultProps = {\n title: '',\n width: '45rem',\n allowFullHeight: false,\n showTitleBar: true,\n className: '',\n showBorder: true,\n};\n\nexport default SidebarBase;\n","import React, { useContext } from 'react';\n\nimport { ensureConfig, getConfig } from '@edx/frontend-platform';\nimport { useIntl } from '@edx/frontend-platform/i18n';\nimport classNames from 'classnames';\n\nimport SidebarContext from '../../../SidebarContext';\nimport messages from '../../../messages';\n\nensureConfig(['DISCUSSIONS_MFE_BASE_URL']);\n\nconst DiscussionsWidget = () => {\n const intl = useIntl();\n const {\n unitId,\n courseId,\n hideDiscussionbar,\n isDiscussionbarAvailable,\n shouldDisplayFullScreen,\n } = useContext(SidebarContext);\n const discussionsUrl = `${getConfig().DISCUSSIONS_MFE_BASE_URL}/${courseId}/category/${unitId}`;\n\n if (hideDiscussionbar || !isDiscussionbarAvailable) { return null; }\n\n return (\n \n toggleSidebar(sidebarId)}\n alt={intl.formatMessage(messages.closeTrigger)}\n className=\"icon-hover\"\n />\n
\n \n \n
\n );\n};\n\nexport default NotificationsWidget;\n","// This file holds some convenience methods for dealing with sessionStorage. Unlike localStorage that never expires,\n// sessionStorage is cleared when the browser tab is closed since the page session ends\n//\n// NOTE: These storage keys are not namespaced. That means that it's shared for the current fully\n// qualified domain. Namespacing could be added, but we'll cross that bridge when we need it.\n\nfunction getSessionStorage(key) {\n try {\n if (global.sessionStorage) {\n return global.sessionStorage.getItem(key);\n }\n } catch (e) {\n // If this fails for some reason, just return null.\n }\n return null;\n}\n\nfunction setSessionStorage(key, value) {\n try {\n if (global.sessionStorage) {\n global.sessionStorage.setItem(key, value);\n }\n } catch (e) {\n // If this fails, just bail.\n }\n}\n\nexport {\n getSessionStorage,\n setSessionStorage,\n};\n","import * as React from 'react';\n\nconst RightSidebarFilled = (props) => (\n {intl.formatMessage(messages.header)}
\n\n {intl.formatMessage(messages.description)}\n {progressLink && (\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 {intl.formatMessage(messages.certificateNotAvailableEndDateBody, { endDate })}\n
\n\n {intl.formatMessage(messages.certificateNotAvailableBodyAccessCert)}\n
\n \n );\n }\n break;\n }\n\n useEffect(() => logVisit(org, courseId, administrator, visitEvent), [org, courseId, administrator, visitEvent]);\n\n return (\n <>\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 { getConfig } from '@edx/frontend-platform';\nimport { injectIntl, intlShape } from '@edx/frontend-platform/i18n';\nimport { Button } from '@openedx/paragon';\nimport { useSelector } from 'react-redux';\nimport { Navigate } from 'react-router-dom';\n\nimport CourseCelebration from './GymCourseCelebration';\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\nconst CourseExit = ({ intl }) => {\n const { courseId } = useSelector(state => state.courseware);\n const {\n certificateData,\n courseExitPageIsActive,\n courseGoals,\n enrollmentMode,\n hasScheduledContent,\n isEnrolled,\n userHasPassingGrade,\n } = useModel('coursewareMeta', courseId);\n\n const {\n isMasquerading,\n canViewCertificate,\n } = useModel('courseHomeMeta', courseId);\n\n const mode = getCourseExitMode(\n certificateData,\n hasScheduledContent,\n isEnrolled,\n userHasPassingGrade,\n courseExitPageIsActive,\n canViewCertificate,\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.congratulationsHeader)}\n
\n \n {intl.formatMessage(messages.completedCourseHeader)}\n {marketingUrl && ` ${intl.formatMessage(messages.shareMessage)}`}\n
\n \n {!wideScreen && (\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 {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 React from 'react';\nimport PropTypes from 'prop-types';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport {\n faVideo, faBook, faEdit, faTasks, faLock,\n} from '@fortawesome/free-solid-svg-icons';\n\nconst UnitIcon = ({ type }) => {\n let icon = null;\n switch (type) {\n case 'video':\n icon = faVideo;\n break;\n case 'other':\n icon = faBook;\n break;\n case 'vertical':\n icon = faTasks;\n break;\n case 'problem':\n icon = faEdit;\n break;\n case 'lock':\n icon = faLock;\n break;\n default:\n icon = faBook;\n }\n\n return (\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 classNames from 'classnames';\nimport { Link } from 'react-router-dom';\nimport PropTypes from 'prop-types';\nimport { Button } from '@openedx/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\nconst UnitNavigation = ({\n intl,\n sequenceId,\n unitId,\n onClickPrevious,\n onClickNext,\n isAtTop,\n}) => {\n const {\n isFirstUnit, isLastUnit, nextLink, previousLink,\n } = useSequenceNavigationMetadata(sequenceId, unitId);\n const { courseId } = useSelector(state => state.courseware);\n\n const renderPreviousButton = () => {\n const disabled = isFirstUnit;\n const prevArrow = isRtl(getLocale()) ? faChevronRight : faChevronLeft;\n return (\n \n {renderPreviousButton()}\n {renderNextButton()}\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 isAtTop: PropTypes.bool,\n};\n\nUnitNavigation.defaultProps = {\n unitId: null,\n isAtTop: false,\n};\n\nexport default injectIntl(UnitNavigation);\n","import React from 'react';\n\nconst SidebarContext = React.createContext({});\n\nexport default SidebarContext;\n","// eslint-disable-next-line import/prefer-default-export\nexport const ID = 'COURSE_OUTLINE';\n","import { defineMessages } from '@edx/frontend-platform/i18n';\n\nconst messages = defineMessages({\n loading: {\n id: 'courseOutline.loading',\n defaultMessage: 'Loading...',\n description: 'Screen reader text to use on the spinner while the sidebar is loading.',\n },\n toggleCourseOutlineTrigger: {\n id: 'courseOutline.toggle.button',\n defaultMessage: 'Toggle course outline tray',\n description: 'Button for the learner to toggle the sidebar',\n },\n courseOutlineTitle: {\n id: 'courseOutline.tray.title',\n defaultMessage: 'Course Outline',\n description: 'Title text displayed for the course outline tray',\n },\n completedUnit: {\n id: 'courseOutline.completedUnit',\n defaultMessage: 'Completed unit',\n description: 'Text used to describe the green checkmark icon in front of a unit title',\n },\n incompleteUnit: {\n id: 'courseOutline.incompleteUnit',\n defaultMessage: 'Incomplete unit',\n description: 'Text used to describe the gray checkmark icon in front of a unit title',\n },\n});\n\nexport default messages;\n","import { defineMessages } from '@edx/frontend-platform/i18n';\n\nconst messages = defineMessages({\n discussionsTitle: {\n id: 'discussions.sidebar.title',\n defaultMessage: 'Discussions',\n description: 'Title text for a forum where users are able to discuss course topics',\n },\n openDiscussionsTrigger: {\n id: 'discussions.sidebar.open.button',\n defaultMessage: 'Show discussions tray',\n description: 'Alt text for a button that opens the discussions feature',\n },\n});\n\nexport default messages;\n","import { ensureConfig, getConfig } from '@edx/frontend-platform';\nimport { injectIntl, intlShape } from '@edx/frontend-platform/i18n';\nimport { Icon } from '@openedx/paragon';\nimport { QuestionAnswer } from '@openedx/paragon/icons';\nimport PropTypes from 'prop-types';\nimport { useContext, useEffect, useMemo } from 'react';\nimport { useDispatch } from 'react-redux';\nimport { useModel } from '@src/generic/model-store';\nimport { WIDGETS } from '@src/constants';\nimport { getCourseDiscussionTopics } from '../../../../data/thunks';\nimport SidebarTriggerBase from '../../common/TriggerBase';\nimport SidebarContext from '../../SidebarContext';\nimport messages from './messages';\n\nensureConfig(['DISCUSSIONS_MFE_BASE_URL']);\nexport const ID = WIDGETS.DISCUSSIONS;\n\nconst DiscussionsTrigger = ({\n intl,\n onClick,\n}) => {\n const {\n unitId,\n courseId,\n } = useContext(SidebarContext);\n const dispatch = useDispatch();\n const { tabs } = useModel('courseHomeMeta', courseId);\n const topic = useModel('discussionTopics', unitId);\n const baseUrl = getConfig().DISCUSSIONS_MFE_BASE_URL;\n const edxProvider = useMemo(\n () => tabs?.find(tab => tab.slug === 'discussion'),\n [tabs],\n );\n\n useEffect(() => {\n if (baseUrl && edxProvider) {\n dispatch(getCourseDiscussionTopics(courseId));\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [courseId, baseUrl]);\n\n if (!topic?.id || !topic?.enabledInContext) {\n return null;\n }\n\n return (\n {verifiedMode\n ? (\n \n
\n \n );\n};\n\nNotificationTray.propTypes = {\n intl: intlShape.isRequired,\n};\n\nNotificationTray.Trigger = NotificationTrigger;\nNotificationTray.ID = ID;\n\nexport default injectIntl(NotificationTray);\n","import { camelCaseObject, getConfig } from '@edx/frontend-platform';\nimport { getAuthenticatedHttpClient, getAuthenticatedUser } from '@edx/frontend-platform/auth';\nimport { appendBrowserTimezoneToUrl } from '../../utils';\nimport {\n normalizeLearningSequencesData, normalizeMetadata, normalizeOutlineBlocks, normalizeSequenceMetadata,\n} from './utils';\n\n// Do not add further calls to this API - we don't like making use of the modulestore if we can help it\nexport async function getSequenceForUnitDeprecated(courseId, unitId) {\n const authenticatedUser = getAuthenticatedUser();\n const url = new URL(`${getConfig().LMS_BASE_URL}/api/courses/v2/blocks/`);\n url.searchParams.append('course_id', courseId);\n url.searchParams.append('username', authenticatedUser ? authenticatedUser.username : '');\n url.searchParams.append('depth', 3);\n url.searchParams.append('requested_fields', 'children,discussions_url');\n\n const { data } = await getAuthenticatedHttpClient().get(url.href, {});\n const parent = Object.values(data.blocks).find(block => block.type === 'sequential' && block.children.includes(unitId));\n return parent?.id;\n}\n\nexport async function getLearningSequencesOutline(courseId) {\n const outlineUrl = new URL(`${getConfig().LMS_BASE_URL}/api/learning_sequences/v1/course_outline/${courseId}`);\n const { data } = await getAuthenticatedHttpClient().get(outlineUrl.href, {});\n return normalizeLearningSequencesData(data);\n}\n\nexport async function getCourseMetadata(courseId) {\n let url = `${getConfig().LMS_BASE_URL}/api/courseware/course/${courseId}`;\n url = appendBrowserTimezoneToUrl(url);\n const metadata = await getAuthenticatedHttpClient().get(url);\n return normalizeMetadata(metadata);\n}\n\nexport async function getSequenceMetadata(sequenceId) {\n const { data } = await getAuthenticatedHttpClient()\n .get(`${getConfig().LMS_BASE_URL}/api/courseware/sequence/${sequenceId}`, {});\n\n return normalizeSequenceMetadata(data);\n}\n\nconst getSequenceHandlerUrl = (courseId, sequenceId) => `${getConfig().LMS_BASE_URL}/courses/${courseId}/xblock/${sequenceId}/handler`;\n\nexport async function getBlockCompletion(courseId, sequenceId, usageKey) {\n const { data } = await getAuthenticatedHttpClient().post(\n `${getSequenceHandlerUrl(courseId, sequenceId)}/get_completion`,\n { usage_key: usageKey },\n );\n return data.complete === true;\n}\n\nexport async function postSequencePosition(courseId, sequenceId, activeUnitIndex) {\n const { data } = await getAuthenticatedHttpClient().post(\n `${getSequenceHandlerUrl(courseId, sequenceId)}/goto_position`,\n // Position is 1-indexed on the server and 0-indexed in this app. Adjust here.\n { position: activeUnitIndex + 1 },\n );\n return data;\n}\n\nexport async function getResumeBlock(courseId) {\n const url = new URL(`${getConfig().LMS_BASE_URL}/api/courseware/resume/${courseId}`);\n const { data } = await getAuthenticatedHttpClient().get(url.href, {});\n return camelCaseObject(data);\n}\n\nexport async function postIntegritySignature(courseId) {\n const { data } = await getAuthenticatedHttpClient().post(`${getConfig().LMS_BASE_URL}/api/agreements/v1/integrity_signature/${courseId}`, {});\n return camelCaseObject(data);\n}\n\nexport async function sendActivationEmail() {\n const url = new URL(`${getConfig().LMS_BASE_URL}/api/send_account_activation_email`);\n const { data } = await getAuthenticatedHttpClient().post(url.href, {});\n return data;\n}\n\nexport async function getCourseDiscussionConfig(courseId) {\n const url = `${getConfig().LMS_BASE_URL}/api/discussion/v1/courses/${courseId}`;\n const { data } = await getAuthenticatedHttpClient().get(url);\n return data;\n}\n\nexport async function getCourseTopics(courseId) {\n const { data } = await getAuthenticatedHttpClient()\n .get(`${getConfig().LMS_BASE_URL}/api/discussion/v2/course_topics/${courseId}`);\n return camelCaseObject(data);\n}\n\n/**\n * Get course outline structure for the courseware navigation sidebar.\n * @param {string} courseId - The unique identifier for the course.\n * @returns {Promise<{units: {}, sequences: {}, sections: {}}|null>}\n */\nexport async function getCourseOutline(courseId) {\n const { data } = await getAuthenticatedHttpClient()\n .get(`${getConfig().LMS_BASE_URL}/api/course_home/v1/navigation/${courseId}`);\n\n return data.blocks ? normalizeOutlineBlocks(courseId, data.blocks) : null;\n}\n\n/**\n * Get waffle flag value that enable courseware outline sidebar and always open auxiliary sidebar.\n * @param {string} courseId - The unique identifier for the course.\n * @returns {Promise<{enable_navigation_sidebar: boolean, enable_navigation_sidebar: boolean}>} - The object\n * of boolean values of enabling of the outline sidebar and is always open auxiliary sidebar.\n */\nexport async function getCoursewareOutlineSidebarToggles(courseId) {\n const url = new URL(`${getConfig().LMS_BASE_URL}/courses/${courseId}/courseware-navigation-sidebar/toggles/`);\n const { data } = await getAuthenticatedHttpClient().get(url.href);\n return {\n enable_navigation_sidebar: data.enable_navigation_sidebar || false,\n always_open_auxiliary_sidebar: data.always_open_auxiliary_sidebar || false,\n };\n}\n","import { logInfo } from '@edx/frontend-platform/logging';\nimport { camelCaseObject } from '@edx/frontend-platform';\n\nimport { getTimeOffsetMillis } from '../../course-home/data/api';\n\nexport function normalizeLearningSequencesData(learningSequencesData) {\n const models = {\n courses: {},\n sections: {},\n sequences: {},\n };\n\n const now = new Date();\n function isReleased(block) {\n // We check whether the backend marks this as accessible because staff users are granted access anyway.\n // Note that sections don't have the `accessible` field and will just be checking `effective_start`.\n return block.accessible || !block.effective_start || now >= Date.parse(block.effective_start);\n }\n\n // Sequences\n Object.entries(learningSequencesData.outline.sequences).forEach(([seqId, sequence]) => {\n if (!isReleased(sequence)) {\n return; // Don't let the learner see unreleased sequences\n }\n\n models.sequences[seqId] = {\n id: seqId,\n title: sequence.title,\n };\n });\n\n // Sections\n learningSequencesData.outline.sections.forEach(section => {\n // Filter out any ignored sequences (e.g. unreleased sequences)\n const availableSequenceIds = section.sequence_ids.filter(seqId => seqId in models.sequences);\n\n // If we are unreleased and already stripped out all our children, just don't show us at all.\n // (We check both release date and children because children will exist for an unreleased section even for staff,\n // so we still want to show this section.)\n if (!isReleased(section) && availableSequenceIds.length === 0) {\n return;\n }\n\n models.sections[section.id] = {\n id: section.id,\n title: section.title,\n sequenceIds: availableSequenceIds,\n courseId: learningSequencesData.course_key,\n };\n\n // Add back-references to this section for all child sequences.\n availableSequenceIds.forEach(childSeqId => {\n models.sequences[childSeqId].sectionId = section.id;\n });\n });\n\n // Course\n models.courses[learningSequencesData.course_key] = {\n id: learningSequencesData.course_key,\n title: learningSequencesData.title,\n sectionIds: Object.entries(models.sections).map(([sectionId]) => sectionId),\n\n // Scan through all the sequences and look for ones that aren't released yet.\n hasScheduledContent: Object.values(learningSequencesData.outline.sequences).some(seq => !isReleased(seq)),\n };\n\n return models;\n}\n\nexport function normalizeMetadata(metadata) {\n const requestTime = Date.now();\n const responseTime = requestTime;\n const { data, headers } = metadata;\n return {\n accessExpiration: camelCaseObject(data.access_expiration),\n canShowUpgradeSock: data.can_show_upgrade_sock,\n contentTypeGatingEnabled: data.content_type_gating_enabled,\n courseGoals: camelCaseObject(data.course_goals),\n id: data.id,\n title: data.name,\n offer: camelCaseObject(data.offer),\n enrollmentStart: data.enrollment_start,\n enrollmentEnd: data.enrollment_end,\n end: data.end,\n start: data.start,\n enrollmentMode: data.enrollment.mode,\n isEnrolled: data.enrollment.is_active,\n license: data.license,\n userTimezone: data.user_timezone,\n showCalculator: data.show_calculator,\n notes: camelCaseObject(data.notes),\n marketingUrl: data.marketing_url,\n celebrations: camelCaseObject(data.celebrations),\n userHasPassingGrade: data.user_has_passing_grade,\n courseExitPageIsActive: data.course_exit_page_is_active,\n certificateData: camelCaseObject(data.certificate_data),\n entranceExamData: camelCaseObject(data.entrance_exam_data),\n language: data.language,\n timeOffsetMillis: getTimeOffsetMillis(headers && headers.date, requestTime, responseTime),\n verifyIdentityUrl: data.verify_identity_url,\n verificationStatus: data.verification_status,\n linkedinAddToProfileUrl: data.linkedin_add_to_profile_url,\n relatedPrograms: camelCaseObject(data.related_programs),\n userNeedsIntegritySignature: data.user_needs_integrity_signature,\n canAccessProctoredExams: data.can_access_proctored_exams,\n learningAssistantEnabled: data.learning_assistant_enabled,\n };\n}\n\nexport function normalizeSequenceMetadata(sequence) {\n return {\n sequence: {\n id: sequence.item_id,\n blockType: sequence.tag,\n unitIds: sequence.items.map(unit => unit.id),\n bannerText: sequence.banner_text,\n format: sequence.format,\n title: sequence.display_name,\n /*\n Example structure of gated_content when prerequisites exist:\n {\n prereq_id: 'id of the prereq section',\n prereq_url: 'unused by this frontend',\n prereq_section_name: 'Name of the prerequisite section',\n gated: true,\n gated_section_name: 'Name of this gated section',\n */\n gatedContent: camelCaseObject(sequence.gated_content),\n isTimeLimited: sequence.is_time_limited,\n isProctored: sequence.is_proctored,\n isHiddenAfterDue: sequence.is_hidden_after_due,\n // Position comes back from the server 1-indexed. Adjust here.\n activeUnitIndex: sequence.position ? sequence.position - 1 : 0,\n saveUnitPosition: sequence.save_position,\n showCompletion: sequence.show_completion,\n allowProctoringOptOut: sequence.allow_proctoring_opt_out,\n navigationDisabled: sequence.navigation_disabled,\n },\n units: sequence.items.map(unit => ({\n id: unit.id,\n sequenceId: sequence.item_id,\n bookmarked: unit.bookmarked,\n complete: unit.complete,\n title: unit.page_title,\n contentType: unit.type,\n graded: unit.graded,\n containsContentTypeGatedContent: unit.contains_content_type_gated_content,\n })),\n };\n}\n\n/**\n * Normalizes outline blocks for a given course.\n * @param {string} courseId - The unique identifier for the course.\n * @param {Object} blocks - An object containing different blocks of the course outline.\n * @returns {Object} - An object with normalized sections, sequences, and units.\n */\nexport function normalizeOutlineBlocks(courseId, blocks) {\n const models = {\n sections: {},\n sequences: {},\n units: {},\n };\n Object.values(blocks).forEach(block => {\n switch (block.type) {\n case 'chapter':\n models.sections[block.id] = {\n complete: block.complete,\n id: block.id,\n title: block.display_name,\n sequenceIds: block.children || [],\n completionStat: {\n completed: block.completion_stat?.completion,\n total: block.completion_stat?.completable_children,\n },\n };\n break;\n\n case 'sequential':\n case 'lock':\n models.sequences[block.id] = {\n complete: block.complete,\n id: block.id,\n title: block.display_name,\n type: block.type,\n specialExamInfo: block.special_exam_info,\n unitIds: block.children || [],\n completionStat: {\n completed: block.completion_stat?.completion,\n total: block.completion_stat?.completable_children,\n },\n };\n break;\n\n case 'vertical':\n models.units[block.id] = {\n complete: block.complete,\n icon: block.icon,\n id: block.id,\n title: block.display_name,\n type: block.type,\n };\n break;\n\n default:\n logInfo(`Unexpected course block type: ${block.type} with ID ${block.id}. Expected block types are course, chapter, and sequential.`);\n }\n });\n\n return models;\n}\n","import { LOADED } from './slice';\n\nexport function sequenceIdsSelector(state) {\n if (state.courseware.courseStatus !== LOADED) {\n return [];\n }\n const { sectionIds = [] } = state.models.coursewareMeta[state.courseware.courseId];\n\n return sectionIds\n .flatMap(sectionId => state.models.sections[sectionId].sequenceIds);\n}\n\nexport const getSequenceId = state => state.courseware.sequenceId;\n\nexport const getCourseOutline = state => state.courseware.courseOutline;\n\nexport const getCourseOutlineStatus = state => state.courseware.courseOutlineStatus;\n\nexport const getCoursewareOutlineSidebarSettings = state => state.courseware.coursewareOutlineSidebarSettings;\n\nexport const getCourseOutlineShouldUpdate = state => state.courseware.courseOutlineShouldUpdate;\n","/* eslint-disable no-param-reassign */\nimport { createSlice } from '@reduxjs/toolkit';\n\nexport const LOADING = 'loading';\nexport const LOADED = 'loaded';\nexport const FAILED = 'failed';\nexport const DENIED = 'denied';\n\nconst slice = createSlice({\n name: 'courseware',\n initialState: {\n courseId: null,\n courseStatus: LOADING,\n sequenceId: null,\n sequenceMightBeUnit: false,\n sequenceStatus: LOADING,\n courseOutline: {},\n coursewareOutlineSidebarSettings: {},\n courseOutlineStatus: LOADING,\n courseOutlineShouldUpdate: false,\n },\n reducers: {\n fetchCourseRequest: (state, { payload }) => {\n state.courseId = payload.courseId;\n state.courseStatus = LOADING;\n },\n fetchCourseSuccess: (state, { payload }) => {\n state.courseId = payload.courseId;\n state.courseStatus = LOADED;\n },\n fetchCourseFailure: (state, { payload }) => {\n state.courseId = payload.courseId;\n state.courseStatus = FAILED;\n },\n fetchCourseDenied: (state, { payload }) => {\n state.courseId = payload.courseId;\n state.courseStatus = DENIED;\n },\n fetchSequenceRequest: (state, { payload }) => {\n state.sequenceId = payload.sequenceId;\n state.sequenceStatus = LOADING;\n state.sequenceMightBeUnit = false;\n },\n fetchSequenceSuccess: (state, { payload }) => {\n state.sequenceId = payload.sequenceId;\n state.sequenceStatus = LOADED;\n state.sequenceMightBeUnit = false;\n },\n fetchSequenceFailure: (state, { payload }) => {\n state.sequenceId = payload.sequenceId;\n state.sequenceStatus = FAILED;\n state.sequenceMightBeUnit = payload.sequenceMightBeUnit || false;\n },\n fetchCourseOutlineRequest: (state) => {\n state.courseOutline = {};\n state.courseOutlineStatus = LOADING;\n },\n fetchCourseOutlineSuccess: (state, { payload }) => {\n state.courseOutline = payload.courseOutline;\n state.courseOutlineStatus = LOADED;\n state.courseOutlineShouldUpdate = false;\n },\n fetchCourseOutlineFailure: (state) => {\n state.courseOutline = {};\n state.courseOutlineStatus = FAILED;\n },\n setCoursewareOutlineSidebarToggles: (state, { payload }) => {\n state.coursewareOutlineSidebarSettings = payload;\n },\n updateCourseOutlineCompletion: (state, { payload }) => {\n const { unitId, isComplete: isUnitComplete } = payload;\n if (!isUnitComplete) {\n return state;\n }\n\n state.courseOutline.units[unitId].complete = true;\n\n const sequenceId = Object.keys(state.courseOutline.sequences)\n .find(id => state.courseOutline.sequences[id].unitIds.includes(unitId));\n const sequenceUnits = state.courseOutline.sequences[sequenceId].unitIds;\n const completedUnits = sequenceUnits.filter((id) => state.courseOutline.units[id].complete);\n const isAllUnitsAreComplete = sequenceUnits.every((id) => state.courseOutline.units[id].complete);\n\n // Update amount of completed units of the sequence\n state.courseOutline.sequences[sequenceId].completionStat.completed = completedUnits.length;\n\n if (isAllUnitsAreComplete) {\n state.courseOutline.sequences[sequenceId].complete = true;\n }\n\n const sectionId = Object.keys(state.courseOutline.sections)\n .find(id => state.courseOutline.sections[id].sequenceIds.includes(sequenceId));\n const sectionSequences = state.courseOutline.sections[sectionId].sequenceIds;\n const isAllSequencesAreComplete = sectionSequences.every((id) => state.courseOutline.sequences[id].complete);\n const hasLockedSequence = sectionSequences.some((id) => state.courseOutline.sequences[id].type === 'lock');\n\n // This block of code checks whether all units in the current sequence are complete\n // and if the parent section has a locked (prerequisites) sequence. If both conditions\n // are met, it switches the state of the 'courseOutlineShouldUpdate' flag to true,\n // indicating that the sidebar outline structure needs to be refetched.\n if (isAllUnitsAreComplete && hasLockedSequence) {\n state.courseOutlineShouldUpdate = true;\n }\n\n // Update amount of completed units of the section\n state.courseOutline.sections[sectionId].completionStat.completed = sectionSequences.reduce(\n (acc, id) => acc + state.courseOutline.sequences[id].completionStat.completed,\n 0,\n );\n\n if (isAllSequencesAreComplete) {\n state.courseOutline.sections[sectionId].complete = true;\n }\n\n return state;\n },\n },\n});\n\nexport const {\n fetchCourseRequest,\n fetchCourseSuccess,\n fetchCourseFailure,\n fetchCourseDenied,\n fetchSequenceRequest,\n fetchSequenceSuccess,\n fetchSequenceFailure,\n fetchCourseRecommendationsRequest,\n fetchCourseRecommendationsSuccess,\n fetchCourseRecommendationsFailure,\n fetchCourseOutlineRequest,\n fetchCourseOutlineSuccess,\n fetchCourseOutlineFailure,\n setCoursewareOutlineSidebarToggles,\n updateCourseOutlineCompletion,\n} = slice.actions;\n\nexport const {\n reducer,\n} = slice;\n","import { logError, logInfo } from '@edx/frontend-platform/logging';\nimport { getCourseHomeCourseMetadata } from '../../course-home/data/api';\nimport {\n addModel, addModelsMap, updateModel, updateModels, updateModelsMap,\n} from '../../generic/model-store';\nimport {\n getBlockCompletion,\n getCourseDiscussionConfig,\n getCourseMetadata,\n getCourseOutline,\n getCourseTopics,\n getCoursewareOutlineSidebarToggles,\n getLearningSequencesOutline,\n getSequenceMetadata,\n postIntegritySignature,\n postSequencePosition,\n} from './api';\nimport {\n fetchCourseDenied,\n fetchCourseFailure,\n fetchCourseRequest,\n fetchCourseSuccess,\n fetchSequenceFailure,\n fetchSequenceRequest,\n fetchSequenceSuccess,\n fetchCourseOutlineRequest,\n fetchCourseOutlineSuccess,\n fetchCourseOutlineFailure,\n setCoursewareOutlineSidebarToggles,\n updateCourseOutlineCompletion,\n} from './slice';\n\nexport function fetchCourse(courseId) {\n return async (dispatch) => {\n dispatch(fetchCourseRequest({ courseId }));\n Promise.allSettled([\n getCourseMetadata(courseId),\n getLearningSequencesOutline(courseId),\n getCourseHomeCourseMetadata(courseId, 'courseware'),\n getCoursewareOutlineSidebarToggles(courseId),\n ]).then(([\n courseMetadataResult,\n learningSequencesOutlineResult,\n courseHomeMetadataResult,\n coursewareOutlineSidebarTogglesResult]) => {\n const fetchedMetadata = courseMetadataResult.status === 'fulfilled';\n const fetchedCourseHomeMetadata = courseHomeMetadataResult.status === 'fulfilled';\n const fetchedOutline = learningSequencesOutlineResult.status === 'fulfilled';\n const fetchedCoursewareOutlineSidebarTogglesResult = coursewareOutlineSidebarTogglesResult.status === 'fulfilled';\n\n if (fetchedMetadata) {\n dispatch(addModel({\n modelType: 'coursewareMeta',\n model: courseMetadataResult.value,\n }));\n }\n\n if (fetchedCourseHomeMetadata) {\n dispatch(addModel({\n modelType: 'courseHomeMeta',\n model: {\n id: courseId,\n ...courseHomeMetadataResult.value,\n },\n }));\n }\n\n if (fetchedOutline) {\n const {\n courses, sections, sequences,\n } = learningSequencesOutlineResult.value;\n\n // This updates the course with a sectionIds array from the Learning Sequence data.\n dispatch(updateModelsMap({\n modelType: 'coursewareMeta',\n modelsMap: courses,\n }));\n dispatch(addModelsMap({\n modelType: 'sections',\n modelsMap: sections,\n }));\n // We update for sequences because the sequence metadata may have come back first.\n dispatch(updateModelsMap({\n modelType: 'sequences',\n modelsMap: sequences,\n }));\n }\n\n if (fetchedCoursewareOutlineSidebarTogglesResult) {\n const {\n enable_navigation_sidebar: enableNavigationSidebar,\n always_open_auxiliary_sidebar: alwaysOpenAuxiliarySidebar,\n } = coursewareOutlineSidebarTogglesResult.value;\n dispatch(setCoursewareOutlineSidebarToggles({ enableNavigationSidebar, alwaysOpenAuxiliarySidebar }));\n }\n\n // Log errors for each request if needed. Outline failures may occur\n // even if the course metadata request is successful\n if (!fetchedOutline) {\n const { response } = learningSequencesOutlineResult.reason;\n if (response && response.status === 403) {\n // 403 responses are normal - they happen when the learner is logged out.\n // We'll redirect them in a moment to the outline tab by calling fetchCourseDenied() below.\n logInfo(learningSequencesOutlineResult.reason);\n } else {\n logError(learningSequencesOutlineResult.reason);\n }\n }\n if (!fetchedMetadata) {\n logError(courseMetadataResult.reason);\n }\n if (!fetchedCourseHomeMetadata) {\n logError(courseHomeMetadataResult.reason);\n }\n if (!fetchedCoursewareOutlineSidebarTogglesResult) {\n logError(coursewareOutlineSidebarTogglesResult.reason);\n }\n if (fetchedMetadata && fetchedCourseHomeMetadata) {\n if (courseHomeMetadataResult.value.courseAccess.hasAccess && fetchedOutline) {\n // User has access\n dispatch(fetchCourseSuccess({ courseId }));\n return;\n }\n // User either doesn't have access or only has partial access\n // (can't access course blocks)\n dispatch(fetchCourseDenied({ courseId }));\n return;\n }\n\n // Definitely an error happening\n dispatch(fetchCourseFailure({ courseId }));\n });\n };\n}\n\nexport function fetchSequence(sequenceId) {\n return async (dispatch) => {\n dispatch(fetchSequenceRequest({ sequenceId }));\n try {\n const { sequence, units } = await getSequenceMetadata(sequenceId);\n if (sequence.blockType !== 'sequential') {\n // Some other block types (particularly 'chapter') can be returned\n // by this API. We want to error in that case, since downstream\n // courseware code is written to render Sequences of Units.\n logError(\n `Requested sequence '${sequenceId}' `\n + `has block type '${sequence.blockType}'; expected block type 'sequential'.`,\n );\n dispatch(fetchSequenceFailure({ sequenceId }));\n } else {\n dispatch(updateModel({\n modelType: 'sequences',\n model: sequence,\n }));\n dispatch(updateModels({\n modelType: 'units',\n models: units,\n }));\n dispatch(fetchSequenceSuccess({ sequenceId }));\n }\n } catch (error) {\n // Some errors are expected - for example, CoursewareContainer may request sequence metadata for a unit and rely\n // on the request failing to notice that it actually does have a unit (mostly so it doesn't have to know anything\n // about the opaque key structure). In such cases, the backend gives us a 422.\n const sequenceMightBeUnit = error?.response?.status === 422;\n if (!sequenceMightBeUnit) {\n logError(error);\n }\n dispatch(fetchSequenceFailure({ sequenceId, sequenceMightBeUnit }));\n }\n };\n}\n\nexport function checkBlockCompletion(courseId, sequenceId, unitId) {\n return async (dispatch, getState) => {\n const { models } = getState();\n if (models.units[unitId]?.complete) {\n return {}; // do nothing. Things don't get uncompleted after they are completed.\n }\n\n try {\n const isComplete = await getBlockCompletion(courseId, sequenceId, unitId);\n dispatch(updateModel({\n modelType: 'units',\n model: {\n id: unitId,\n complete: isComplete,\n },\n }));\n dispatch(updateCourseOutlineCompletion({ sequenceId, unitId, isComplete }));\n return isComplete;\n } catch (error) {\n logError(error);\n }\n return {};\n };\n}\n\nexport function saveSequencePosition(courseId, sequenceId, activeUnitIndex) {\n return async (dispatch, getState) => {\n const { models } = getState();\n const initialActiveUnitIndex = models.sequences[sequenceId].activeUnitIndex;\n // Optimistically update the position.\n dispatch(updateModel({\n modelType: 'sequences',\n model: {\n id: sequenceId,\n activeUnitIndex,\n },\n }));\n try {\n await postSequencePosition(courseId, sequenceId, activeUnitIndex);\n // Update again under the assumption that the above call succeeded, since it doesn't return a\n // meaningful response.\n dispatch(updateModel({\n modelType: 'sequences',\n model: {\n id: sequenceId,\n activeUnitIndex,\n },\n }));\n } catch (error) {\n logError(error);\n dispatch(updateModel({\n modelType: 'sequences',\n model: {\n id: sequenceId,\n activeUnitIndex: initialActiveUnitIndex,\n },\n }));\n }\n };\n}\n\nexport function saveIntegritySignature(courseId, isMasquerading) {\n return async (dispatch) => {\n try {\n // If the request is made by a staff user masquerading as a specific learner,\n // don't actually create a signature for them on the backend,\n // only the modal dialog will be dismissed\n if (!isMasquerading) {\n await postIntegritySignature(courseId);\n }\n dispatch(updateModel({\n modelType: 'coursewareMeta',\n model: {\n id: courseId,\n userNeedsIntegritySignature: false,\n },\n }));\n } catch (error) {\n logError(error);\n }\n };\n}\n\nexport function getCourseDiscussionTopics(courseId) {\n return async (dispatch) => {\n try {\n const config = await getCourseDiscussionConfig(courseId);\n // Only load topics for the openedx provider, the legacy provider uses\n // the xblock\n if (config.provider === 'openedx') {\n const topics = await getCourseTopics(courseId);\n dispatch(updateModels({\n modelType: 'discussionTopics',\n models: topics.filter(topic => topic.usageKey),\n idField: 'usageKey',\n }));\n }\n } catch (error) {\n logError(error);\n }\n };\n}\n\nexport function getCourseOutlineStructure(courseId) {\n return async (dispatch) => {\n dispatch(fetchCourseOutlineRequest());\n try {\n const courseOutline = await getCourseOutline(courseId);\n dispatch(fetchCourseOutlineSuccess({ courseOutline }));\n } catch (error) {\n logError(error);\n dispatch(fetchCourseOutlineFailure());\n }\n };\n}\n","// This file holds some convenience methods for dealing with localStorage.\n//\n// NOTE: These storage keys are not namespaced. That means that it's shared for the current fully\n// qualified domain. Namespacing could be added, but we'll cross that bridge when we need it.\n\nfunction getLocalStorage(key) {\n try {\n if (global.localStorage) {\n const rawItem = global.localStorage.getItem(key);\n if (rawItem) {\n return JSON.parse(rawItem);\n }\n }\n } catch (e) {\n // If this fails for some reason, just return null.\n }\n return null;\n}\n\nfunction setLocalStorage(key, value) {\n try {\n if (global.localStorage) {\n global.localStorage.setItem(key, JSON.stringify(value));\n }\n } catch (e) {\n // If this fails, just bail.\n }\n}\n\nfunction clearLocalStorage(key) {\n try {\n if (global.localStorage) {\n global.localStorage.removeItem(key);\n }\n } catch (e) {\n // If this fails, just bail.\n }\n}\n\nfunction popLocalStorage(key) {\n const value = getLocalStorage(key);\n clearLocalStorage(key);\n return value;\n}\n\nexport {\n clearLocalStorage,\n getLocalStorage,\n popLocalStorage,\n setLocalStorage,\n};\n","/* eslint-disable import/prefer-default-export */\n\nimport {\n useCallback, useEffect, useRef, useState,\n} from 'react';\n\nexport function useEventListener(type, handler) {\n // We use this ref so that we can hold a reference to the currently active event listener.\n const eventListenerRef = useRef(null);\n useEffect(() => {\n // If we currently have an event listener, remove it.\n if (eventListenerRef.current !== null) {\n global.removeEventListener(type, eventListenerRef.current);\n eventListenerRef.current = null;\n }\n // Now add our new handler as the event listener.\n global.addEventListener(type, handler);\n // And then save it to our ref for next time.\n eventListenerRef.current = handler;\n // When the component finally unmounts, use the ref to remove the correct handler.\n return () => global.removeEventListener(type, eventListenerRef.current);\n }, [type, handler]);\n}\n\n/**\n * Hooks up post messages to callbacks\n * @param {Object.{intl.formatMessage(messages.noNotificationsMessage)}
\n )}\n\n {isRedirected === true ? null : children}\n
\n );\n};\n\nNoticesProvider.propTypes = {\n children: PropTypes.node.isRequired,\n};\n\nexport default NoticesProvider;\n","/* eslint-disable import/prefer-default-export */\nimport { getConfig } from '@edx/frontend-platform';\nimport { getAuthenticatedHttpClient, getAuthenticatedUser } from '@edx/frontend-platform/auth';\nimport { logError, logInfo } from '@edx/frontend-platform/logging';\n\nexport const getNotices = async () => {\n const authenticatedUser = getAuthenticatedUser();\n const url = new URL(`${getConfig().LMS_BASE_URL}/notices/api/v1/unacknowledged`);\n if (authenticatedUser) {\n try {\n const { data } = await getAuthenticatedHttpClient().get(url.href, {});\n return data;\n } catch (e) {\n // we will just swallow error, as that probably means the notices app is not installed.\n // Notices are not necessary for the rest of courseware to function.\n const { customAttributes: { httpErrorStatus } } = e;\n if (httpErrorStatus === 404) {\n logInfo(`${e}. This probably happened because the notices plugin is not installed on platform.`);\n } else {\n logError(e);\n }\n }\n }\n return null;\n};\n","import { Navigate, useLocation } from 'react-router-dom';\nimport PropTypes from 'prop-types';\n\nimport { sendTrackEvent } from '@edx/frontend-platform/analytics';\n\n/**\n * We have seen evidence of learners hitting MFE pages with spaces instead of plus signs (which are used commonly\n * in our course keys). It's possible something out there is un-escaping our paths before sending learners to them.\n *\n * So this provider fixes those paths up and logs it so that we can try to fix the source.\n *\n * This might be temporary, based on how much we can fix the sources of these urls-with-spaces.\n */\nconst PathFixesProvider = ({ children }) => {\n const location = useLocation();\n\n // We only check for spaces. That's not the only kind of character that is escaped in URLs, but it would always be\n // present for our cases, and I believe it's the only one we use normally.\n if (location.pathname.includes(' ') || location.pathname.includes('%20')) {\n const newLocation = {\n ...location,\n pathname: (location.pathname.replaceAll(' ', '+')).replaceAll('%20', '+'),\n };\n\n sendTrackEvent('edx.ui.lms.path_fixed', {\n new_path: newLocation.pathname,\n old_path: location.pathname,\n referrer: document.referrer,\n search: location.search,\n });\n\n return (\n
\n \n );\n};\n\nUpgradeButton.defaultProps = {\n offer: null,\n onClick: null,\n variant: 'primary',\n};\n\nUpgradeButton.propTypes = {\n intl: intlShape.isRequired,\n offer: PropTypes.shape({\n upgradeUrl: PropTypes.string.isRequired,\n }),\n onClick: PropTypes.func,\n verifiedMode: PropTypes.shape({\n upgradeUrl: PropTypes.string.isRequired,\n }).isRequired,\n variant: PropTypes.string,\n};\n\nexport default injectIntl(UpgradeButton);\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport { FormattedMessage, injectIntl, intlShape } from '@edx/frontend-platform/i18n';\nimport { Button } from '@openedx/paragon';\n\nimport FormattedPricing from './FormattedPricing';\n\nconst UpgradeNowButton = (props) => {\n const {\n intl,\n offer,\n variant,\n onClick,\n verifiedMode,\n ...rest\n } = props;\n\n // Prefer offer's url in case it is different (might hold a coupon code that the normal does not)\n const url = offer ? offer.upgradeUrl : verifiedMode.upgradeUrl;\n\n return (\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\nexport default AlertList;\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 // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isVisible, code, text, topic, type, payload, dismissible]);\n}\n","import { getConfig, camelCaseObject } from '@edx/frontend-platform';\nimport { getAuthenticatedHttpClient } from '@edx/frontend-platform/auth';\n\nexport async function getMasqueradeOptions(courseId) {\n const url = new URL(`${getConfig().LMS_BASE_URL}/courses/${courseId}/masquerade`);\n const { data } = await getAuthenticatedHttpClient().get(url.href, {});\n return camelCaseObject(data);\n}\n\nexport async function postMasqueradeOptions(courseId, payload) {\n const url = new URL(`${getConfig().LMS_BASE_URL}/courses/${courseId}/masquerade`);\n const { data } = await getAuthenticatedHttpClient().post(url.href, payload);\n return camelCaseObject(data);\n}\n","import { defineMessages } from '@edx/frontend-platform/i18n';\n\nconst messages = defineMessages({\n genericError: {\n id: 'masquerade-widget.userName.error.generic',\n defaultMessage: 'An error has occurred; please try again.',\n description: 'Message shown after a general error when attempting to masquerade',\n },\n placeholder: {\n id: 'masquerade-widget.userName.input.placeholder',\n defaultMessage: 'Username or email',\n description: 'Placeholder text to prompt for a user to masquerade as',\n },\n userNameLabel: {\n id: 'masquerade-widget.userName.input.label',\n defaultMessage: 'Masquerade as this user',\n description: 'Label for the masquerade user input',\n },\n});\n\nexport default messages;\n","import { camelCaseObject, getConfig } from '@edx/frontend-platform';\nimport { getAuthenticatedHttpClient } from '@edx/frontend-platform/auth';\n\nexport async function getTourData(username) {\n const url = `${getConfig().LMS_BASE_URL}/api/user_tours/v1/${username}`;\n try {\n const { data } = await getAuthenticatedHttpClient().get(url);\n return { toursEnabled: true, ...camelCaseObject(data) };\n } catch (error) {\n const { httpErrorStatus } = error && error.customAttributes;\n /** The API will return a\n * 401 if the user is not authenticated\n * 403 if the tour waffle flag is inactive\n * 404 if no User Tour objects exist for the given username\n */\n if (httpErrorStatus === 401 || httpErrorStatus === 403 || httpErrorStatus === 404) {\n return { toursEnabled: false };\n }\n throw error;\n }\n}\n\nexport async function patchTourData(username, tourData) {\n const url = `${getConfig().LMS_BASE_URL}/api/user_tours/v1/${username}`;\n return getAuthenticatedHttpClient().patch(url, tourData);\n}\n","import { logError } from '@edx/frontend-platform/logging';\n\nimport { getTourData, patchTourData } from './api';\nimport {\n disableCourseHomeTour,\n disableCoursewareTour,\n disableNewUserCourseHomeModal,\n setTourData,\n} from './slice';\n\nexport function closeNewUserCourseHomeModal() {\n return async (dispatch) => dispatch(disableNewUserCourseHomeModal());\n}\n\nexport function endCourseHomeTour(username) {\n return async (dispatch) => {\n try {\n await patchTourData(username, {\n course_home_tour_status: 'no-tour',\n });\n dispatch(disableCourseHomeTour());\n } catch (error) {\n logError(error);\n }\n };\n}\n\nexport function endCoursewareTour(username) {\n return async (dispatch) => {\n try {\n await patchTourData(username, {\n show_courseware_tour: false,\n });\n dispatch(disableCoursewareTour());\n } catch (error) {\n logError(error);\n }\n };\n}\n\nexport function fetchTourData(username) {\n return async (dispatch) => {\n try {\n const data = await getTourData(username);\n dispatch(setTourData(data));\n } catch (error) {\n logError(error);\n }\n };\n}\n","/* eslint-disable no-param-reassign */\nimport { createSlice } from '@reduxjs/toolkit';\n\nconst slice = createSlice({\n name: 'tours',\n initialState: {\n showCoursewareTour: false,\n showExistingUserCourseHomeTour: false,\n showNewUserCourseHomeModal: false,\n showNewUserCourseHomeTour: false,\n toursEnabled: false,\n },\n reducers: {\n disableCourseHomeTour: (state) => {\n state.showNewUserCourseHomeModal = false;\n state.showNewUserCourseHomeTour = false;\n state.showExistingUserCourseHomeTour = false;\n },\n disableCoursewareTour: (state) => {\n state.showCoursewareTour = false;\n },\n disableNewUserCourseHomeModal: (state) => {\n state.showNewUserCourseHomeModal = false;\n },\n launchCourseHomeTour: (state) => {\n if (state.showExistingUserCourseHomeTour) {\n state.showExistingUserCourseHomeTour = false;\n }\n\n if (!state.showNewUserCourseHomeModal || !state.showNewUserCourseHomeTour) {\n state.showNewUserCourseHomeTour = true;\n }\n },\n setTourData: (state, { payload }) => {\n const {\n courseHomeTourStatus,\n showCoursewareTour,\n toursEnabled,\n } = payload;\n state.showCoursewareTour = showCoursewareTour;\n state.showExistingUserCourseHomeTour = courseHomeTourStatus === 'show-existing-user-tour';\n state.showNewUserCourseHomeModal = courseHomeTourStatus === 'show-new-user-tour';\n state.toursEnabled = toursEnabled;\n },\n },\n});\n\nexport const {\n disableCourseHomeTour,\n disableCoursewareTour,\n disableNewUserCourseHomeModal,\n launchCourseHomeTour,\n setTourData,\n} = slice.actions;\n\nexport const {\n reducer,\n} = slice;\n","import { defineMessages } from '@edx/frontend-platform/i18n';\n\nconst messages = defineMessages({\n beginTour: {\n id: 'tours.button.beginTour',\n defaultMessage: 'Begin tour',\n description: 'A button used to start a tour of the website',\n },\n launchTour: {\n id: 'tours.button.launchTour',\n defaultMessage: 'Launch tour',\n description: 'A button used to launch a tour of the website',\n },\n newUserModalBody: {\n id: 'tours.newUserModal.body',\n defaultMessage: 'Let’s take a quick tour of {siteName} so you can get the most out of your course.',\n },\n newUserModalTitleWelcome: {\n id: 'tours.newUserModal.title.welcome',\n defaultMessage: 'Welcome to your',\n description: 'The beginning of the phrase \"Welcome to your edX course!\"',\n },\n skipForNow: {\n id: 'tours.button.skipForNow',\n defaultMessage: 'Skip for now',\n description: 'A button used to dismiss the modal and skip the optional tour of the website',\n },\n});\n\nexport default messages;\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) {\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 'course_not_started_enterprise_learner':\n url = '/redirect/enterprise-learner-dashboard';\n break;\n case 'survey_required':\n url = `/redirect/survey/${courseId}`;\n break;\n case 'data_sharing_access_required':\n url = `/redirect/consent?consentPath=${encodeURIComponent(courseAccess.developerMessage)}`;\n break;\n case 'incorrect_active_enterprise':\n url = `/course/${courseId}/access-denied`;\n break;\n case 'unfulfilled_milestones':\n url = '/redirect/dashboard';\n break;\n case 'authentication_required':\n case 'enrollment_required':\n default:\n if (activeTabSlug !== 'outline') {\n url = `/course/${courseId}/home`;\n }\n }\n return url;\n}\n","import { defineMessages } from '@edx/frontend-platform/i18n';\n\nconst messages = defineMessages({\n activities: {\n id: 'learning.effortEstimation.activities',\n defaultMessage: '{activityCount, plural, one {# activity} other {# activities}}',\n },\n minutesAbbreviated: {\n id: 'learning.effortEstimation.minutesAbbreviated',\n defaultMessage: '{minuteCount, plural, one {# min} other {# min}}',\n description: 'Number of minutes in a casual, shorthand manner: 5 min',\n },\n minutesFull: {\n id: 'learning.effortEstimation.minutesFull',\n defaultMessage: '{minuteCount, plural, one {# minute} other {# minutes}}',\n description: 'Number of minutes spelled out: 5 minutes',\n },\n});\n\nexport default messages;\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport { FormattedMessage, injectIntl, intlShape } from '@edx/frontend-platform/i18n';\n\nimport messages from './messages';\n\n// This component shows an effort estimate provided by the backend block data. Either time, activities, or both.\n\nconst EffortEstimate = (props) => {\n const {\n block: {\n effortActivities,\n effortTime,\n },\n className,\n intl,\n } = props;\n\n const minuteCount = Math.ceil(effortTime / 60); // effortTime is in seconds\n const minutesAbbreviated = intl.formatMessage(messages.minutesAbbreviated, { minuteCount });\n const minutesFull = intl.formatMessage(messages.minutesFull, { minuteCount });\n const minutes = (\n <>\n {minutesAbbreviated}\n {minutesFull}\n \n );\n const activities = intl.formatMessage(messages.activities, { activityCount: effortActivities });\n let content = null;\n\n if (effortTime && effortActivities) {\n content = (\n {intl.formatMessage(messages.streakBody)}
\n\n {!wideScreen && }\n {wideScreen &&
}\n
\n
\n )}\n { !queryingDiscount && showOffer && (\n \n {randomFactoid}\n
\n \n
\n \n {intl.formatMessage(messages.congratulations)}\n {intl.formatMessage(messages.streakDiscountMessage, {\n percent: (discountPercent * 100).toFixed(0),\n })} \n
\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
\n {items.map((item) => {\n const { badges: itemBadges } = 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 {item.description && {item.description}
}\n - \n {groupedDates.map((groupedDate) => (\n
\n {intl.formatMessage(messages.suggestedSchedule)}\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 '@openedx/paragon';\n\nimport { useModel } from '../../generic/model-store';\nimport messages from './messages';\n\nconst 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 {isSelfPaced && hasDeadlines && (\n <>\n {header}
\n \n
\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 React, { useEffect } from 'react';\nimport { useSelector } from 'react-redux';\n\nconst LiveTab = () => {\n const { courseId } = useSelector(state => state.courseHome);\n const liveModel = useSelector(state => state.models.live);\n useEffect(() => {\n const iframe = document.getElementById('lti-tab-embed');\n if (iframe) {\n iframe.className += ' vh-100 w-100 border-0';\n }\n }, []);\n return (\n {description}
\n \n
\n \n
\n {hideFromTOC && (\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 {due ? dueDateMessage : noDueDateMessage}\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
\n {hideFromTOC && (\n \n {hideFromTOC && (\n \n
\n )}\n - \n {sequenceIds.map((sequenceId, index) => (\n
\n {buttonIcon}\n
\n \n {title}\n
\n \n {text}\n
\n \n);\n\nFlagButton.propTypes = {\n buttonIcon: PropTypes.element.isRequired,\n title: PropTypes.string.isRequired,\n text: PropTypes.string.isRequired,\n handleSelect: PropTypes.func.isRequired,\n isSelected: PropTypes.bool.isRequired,\n};\n\nexport default FlagButton;\n","import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { injectIntl, intlShape } from '@edx/frontend-platform/i18n';\n// These flag svgs are derivatives of the Flag icon from paragon\nimport { ReactComponent as FlagIntenseIcon } from './flag_black.svg';\nimport { ReactComponent as FlagCasualIcon } from './flag_outline.svg';\nimport { ReactComponent as FlagRegularIcon } from './flag_gray.svg';\nimport FlagButton from './FlagButton';\nimport messages from '../messages';\n\nconst LearningGoalButton = ({\n level,\n isSelected,\n handleSelect,\n intl,\n}) => {\n const buttonDetails = {\n casual: {\n daysPerWeek: 1,\n title: messages.casualGoalButtonTitle,\n text: messages.casualGoalButtonText,\n icon: {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 {!isCurrentlySubmitted(status) && (\n intl.formatMessage(messages.proctoringPanelGeneralInfo)\n )}\n {isCurrentlySubmitted(status) && (\n intl.formatMessage(messages.proctoringPanelGeneralInfoSubmitted)\n )}\n
\n{intl.formatMessage(messages.proctoringPanelGeneralTime)}
\n \n )}\n {isSubmissionRequired(readableStatus) && (\n onboardingExamButton\n )}\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 donutLabel: {\n id: 'progress.completion.donut.label',\n defaultMessage: 'completed',\n description: 'Label text for progress donut chart',\n },\n completionBody: {\n id: 'progress.completion.body',\n defaultMessage: 'This represents how much of the course content you have completed. Note that some content may not yet be released.',\n description: 'It explains the meaning of progress donut chart',\n },\n completeContentTooltip: {\n id: 'progress.completion.tooltip.locked',\n defaultMessage: 'Content that you have completed.',\n description: 'It expalains the meaning of content that is completed',\n },\n courseCompletion: {\n id: 'progress.completion.header',\n defaultMessage: 'Course completion',\n description: 'Header text for (completion donut chart) section of the progress tab',\n },\n incompleteContentTooltip: {\n id: 'progress.completion.tooltip',\n defaultMessage: 'Content that you have access to and have not completed.',\n description: 'It explain the meaning for content is completed',\n },\n lockedContentTooltip: {\n id: 'progress.completion.tooltip.complete',\n defaultMessage: 'Content that is locked and available only to those who upgrade.',\n description: 'It expalains the meaning of content that is locked',\n },\n percentComplete: {\n id: 'progress.completion.donut.percentComplete',\n defaultMessage: 'You have completed {percent}% of content in this course.',\n description: 'It summarize the progress in the course (100% - %incomplete)',\n },\n percentIncomplete: {\n id: 'progress.completion.donut.percentIncomplete',\n defaultMessage: 'You have not completed {percent}% of content in this course that you have access to.',\n description: 'It summarize the progress in the course (100% - %complete)',\n },\n percentLocked: {\n id: 'progress.completion.donut.percentLocked',\n defaultMessage: '{percent}% of content in this course is locked and available only for those who upgrade.',\n description: 'It indicate the relative size of content that is locked in the course (100% - %open_content)',\n },\n});\n\nexport default messages;\n","import React, { useState } from 'react';\nimport PropTypes from 'prop-types';\n\nimport { injectIntl, intlShape } from '@edx/frontend-platform/i18n';\nimport { OverlayTrigger, Popover } from '@openedx/paragon';\n\nimport messages from './messages';\n\nconst CompleteDonutSegment = ({ completePercentage, intl, lockedPercentage }) => {\n const [showCompletePopover, setShowCompletePopover] = useState(false);\n\n if (!completePercentage) {\n return null;\n }\n\n const completeSegmentOffset = (3.6 * completePercentage) / 8;\n let completeTooltipDegree = completePercentage < 100 ? -completeSegmentOffset : 0;\n\n const lockedSegmentOffset = lockedPercentage - 75;\n if (lockedPercentage > 0) {\n completeTooltipDegree = (lockedSegmentOffset + completePercentage) * -3.6 + 90 + completeSegmentOffset;\n }\n\n return (\n {pageTitle}
\n {administrator && studioUrl && (\n \n )}\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\nconst CourseCompletion = ({ intl }) => (\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 '@openedx/paragon/icons';\nimport { Button, Icon } from '@openedx/paragon';\n\nimport { useModel } from '../../../../generic/model-store';\nimport messages from '../messages';\n\nconst 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 {!wideScreen && (\n \n {footerText}\n {hasLetterGrades && (\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 '@openedx/paragon';\n\nimport { useModel } from '../../../../generic/model-store';\n\nimport messages from '../messages';\n\nconst CurrentGradeTooltip = ({ intl, tooltipClassName }) => {\n const {\n courseId,\n } = useSelector(state => state.courseHome);\n\n const {\n courseGrade: {\n isPassing,\n percent,\n },\n } = useModel('progress', courseId);\n\n const currentGrade = Number((percent * 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 { defineMessages } from '@edx/frontend-platform/i18n';\n\nconst messages = defineMessages({\n completed: {\n id: 'progress.creditInformation.completed',\n defaultMessage: 'Completed',\n description: 'Label text if a requirement for (course credit) is satisfied',\n },\n courseCredit: {\n id: 'progress.creditInformation.courseCredit',\n defaultMessage: 'course credit',\n description: 'Anchor text for link that redirects (course credit) help page',\n },\n minimumGrade: {\n id: 'progress.creditInformation.minimumGrade',\n defaultMessage: 'Minimum grade for credit ({minGrade}%)',\n },\n requirementsHeader: {\n id: 'progress.creditInformation.requirementsHeader',\n defaultMessage: 'Requirements for course credit',\n description: 'Header for the requirements section in course credit',\n },\n upcoming: {\n id: 'progress.creditInformation.upcoming',\n defaultMessage: 'Upcoming',\n description: 'It indicate that the a (credit requirement) status is not known yet',\n },\n verificationFailed: {\n id: 'progress.creditInformation.verificationFailed',\n defaultMessage: 'Verification failed',\n description: 'It indicate that the learner submitted a requirement but is either failed or declined',\n },\n verificationSubmitted: {\n id: 'progress.creditInformation.verificationSubmitted',\n defaultMessage: 'Verification submitted',\n description: 'It indicate that the learner submitted a requirement but is not graded or reviewed yet',\n },\n});\n\nexport default messages;\n","import React from 'react';\nimport { useSelector } from 'react-redux';\nimport { getConfig } from '@edx/frontend-platform';\nimport { FormattedMessage, injectIntl, intlShape } from '@edx/frontend-platform/i18n';\nimport { CheckCircle, WarningFilled, WatchFilled } from '@openedx/paragon/icons';\nimport { Hyperlink, Icon } from '@openedx/paragon';\n\nimport { useModel } from '../../../generic/model-store';\nimport { DashboardLink } from '../../../shared/links';\n\nimport messages from './messages';\n\nconst CreditInformation = ({ intl }) => {\n const {\n courseId,\n } = useSelector(state => state.courseHome);\n\n const {\n creditCourseRequirements,\n } = useModel('progress', courseId);\n\n if (!creditCourseRequirements) { return null; }\n\n let eligibilityStatus;\n let requirementStatus;\n const requirements = [];\n const dashboardLink = {intl.formatMessage(messages.courseGradeBarAltText, { currentGrade, passingGrade })}
\n \n \n
\n ));\n });\n\n return (\n <>\n \n {requirement.namespace === 'grade'\n ? `${intl.formatMessage(messages.minimumGrade, { minGrade: Number(requirement.criteria.minGrade) * 100 })}:`\n : `${requirement.displayName}:`}\n
\n\n {requirementStatus}\n
\n {intl.formatMessage(messages.requirementsHeader)}
\n{eligibilityStatus}
\n {requirements}\n \n );\n};\n\nCreditInformation.propTypes = {\n intl: intlShape.isRequired,\n};\n\nexport default injectIntl(CreditInformation);\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';\nimport CreditInformation from '../../credit-information/CreditInformation';\n\nimport messages from '../messages';\n\nconst CourseGrade = ({ intl }) => {\n const {\n courseId,\n } = useSelector(state => state.courseHome);\n\n const {\n creditCourseRequirements,\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\n
\n \n
\n \n
\n {creditCourseRequirements\n ? intl.formatMessage(messages.gradesAndCredit)\n : intl.formatMessage(messages.grades)}\n
\n\n {intl.formatMessage(messages.courseGradeBody)}\n
\n\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 '@openedx/paragon';\nimport {\n ArrowDropDown, ArrowDropUp, Blocked, Info,\n} from '@openedx/paragon/icons';\n\nimport messages from '../messages';\nimport { useModel } from '../../../../generic/model-store';\nimport ProblemScoreDrawer from './ProblemScoreDrawer';\n\nconst 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, i) => (\n // eslint-disable-next-line react/no-array-index-key\n
- {problemScore.earned}{isLocaleRtl ? '\\\\' : '/'}{problemScore.possible} \n ))}\n
\n { subsection.override && (\n
\n \n
\n )}\n \n
\n {intl.formatMessage(messages.sectionGradeOverridden)}
\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 { 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 '@openedx/paragon/icons';\nimport { Icon, Hyperlink } from '@openedx/paragon';\nimport { useModel } from '../../../../generic/model-store';\n\nimport DetailedGradesTable from './DetailedGradesTable';\n\nimport messages from '../messages';\n\nconst DetailedGrades = ({ intl }) => {\n const { administrator } = getAuthenticatedUser();\n const {\n courseId,\n } = useSelector(state => state.courseHome);\n const {\n org,\n tabs,\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 overviewTab = tabs.find(tab => tab.slug === 'outline');\n const overviewTabUrl = overviewTab && overviewTab.url;\n\n const outlineLink = overviewTabUrl && (\n {intl.formatMessage(messages.detailedGrades)}
\n {gradesFeatureIsPartiallyLocked && (\n\n
\n )}\n {hasSectionScores && (\n {intl.formatMessage(messages.detailedGradesEmpty)}
\n )}\n {overviewTabUrl && (\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 '@openedx/paragon/icons';\nimport { Icon } from '@openedx/paragon';\nimport { useModel } from '../../../../generic/model-store';\nimport messages from '../messages';\n\nconst 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\nconst 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}{isLocaleRtl && '\\u200f'}%
\n {intl.formatMessage(messages.relatedLinks)}
\n- \n {datesTabUrl && (\n
- \n
logLinkClicked('dates')}>\n {intl.formatMessage(messages.datesCardLink)}\n \n{intl.formatMessage(messages.datesCardDescription)}
\n \n )}\n {overviewTabUrl && (\n - \n
logLinkClicked('course_outline')}>\n {intl.formatMessage(messages.outlineCardLink)}\n \n{intl.formatMessage(messages.outlineCardDescription)}
\n \n )}\n
\n \n \n
\n);\n\nexport default CoursewareRedirectLandingPage;\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport { Dropdown } from '@openedx/paragon';\n\nimport {\n sendTrackingLogEvent,\n sendTrackEvent,\n} from '@edx/frontend-platform/analytics';\nimport { useNavigate } from 'react-router-dom';\n\nconst JumpNavMenuItem = ({\n title,\n courseId,\n currentSequence,\n currentUnit,\n sequences,\n isDefault,\n onClick,\n}) => {\n const navigate = useNavigate();\n\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 destinationUrl() {\n if (isDefault) {\n return `/course/${courseId}/${currentSequence}/${currentUnit}`;\n }\n return `/course/${courseId}/${sequences[0].id}`;\n }\n function handleClick(e) {\n const url = destinationUrl();\n logEvent(url);\n navigate(url);\n if (onClick) { onClick(e); }\n }\n\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';\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 '@openedx/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\nconst CourseInProgress = ({ intl }) => {\n const { courseId } = useSelector(state => state.courseware);\n const {\n org,\n tabs,\n title,\n } = useModel('courseHomeMeta', 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
\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 '@openedx/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\nconst CourseNonPassing = ({ intl }) => {\n const { courseId } = useSelector(state => state.courseware);\n const {\n org,\n tabs,\n title,\n } = useModel('courseHomeMeta', 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","/* eslint-disable react/jsx-no-useless-fragment */\nimport 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 '@openedx/paragon';\nimport PropTypes from 'prop-types';\nimport truncate from 'truncate-html';\nimport { useModel } from '../../../generic/model-store';\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 recommendationsCourseFooter: {\n id: 'courseCelebration.recommendations.label', // not very descriptive, but is historical\n description: 'Label on a discovery-card that lets a user know that it is a course card',\n defaultMessage: 'Course',\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\nconst 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 const subtitle = (\n \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.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 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 '@openedx/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\nconst DashboardFootnote = ({ intl, variant }) => {\n const { courseId } = useSelector(state => state.courseware);\n const { org } = useModel('courseHomeMeta', courseId);\n const { administrator } = getAuthenticatedUser();\n\n const dashboardLink = (\n {intl.formatMessage(messages.recommendationsHeading)}
\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 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 '@openedx/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\nconst 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 \n
\n {intl.formatMessage(messages.programsLastCourseHeader, { title })}
\n \n
\n
\n {intl.formatMessage(messages.microMastersMessage)}\n {' '}\n
\n
\n \n {SIDEBAR_ORDER.map((sidebarId) => {\n const { Trigger } = SIDEBARS[sidebarId];\n return (\n toggleSidebar(sidebarId)} key={sidebarId} />\n );\n })}\n
\n );\n};\n\nexport default SidebarTriggers;\n","import { defineMessages } from '@edx/frontend-platform/i18n';\n\nconst messages = defineMessages({\n 'learn.honorCode.name': {\n id: 'learn.honorCode.name',\n defaultMessage: 'Honor Code',\n description: 'Honor code name.',\n },\n 'learn.honorCode.cancel': {\n id: 'learn.honorCode.cancel',\n defaultMessage: 'Cancel',\n description: '\"Cancel\" button.',\n },\n 'learn.honorCode.agree': {\n id: 'learn.honorCode.agree',\n defaultMessage: 'I agree',\n description: '\"I agree\" button.',\n },\n});\n\nexport default messages;\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport { useDispatch } from 'react-redux';\nimport { getConfig } from '@edx/frontend-platform';\nimport { getAuthenticatedUser } from '@edx/frontend-platform/auth';\nimport { FormattedMessage, injectIntl, intlShape } from '@edx/frontend-platform/i18n';\nimport { ActionRow, Alert, Button } from '@openedx/paragon';\n\nimport { useNavigate } from 'react-router-dom';\nimport { useModel } from '../../../../generic/model-store';\nimport { saveIntegritySignature } from '../../../data';\nimport messages from './messages';\n\nconst HonorCode = ({ intl, courseId }) => {\n const navigate = useNavigate();\n const dispatch = useDispatch();\n const {\n isMasquerading,\n username,\n } = useModel('courseHomeMeta', courseId);\n const authUser = getAuthenticatedUser();\n const siteName = getConfig().SITE_NAME;\n const honorCodeUrl = `${getConfig().TERMS_OF_SERVICE_URL}#honor-code`;\n\n const handleCancel = () => navigate(`/course/${courseId}/home`);\n\n const handleAgree = () => dispatch(\n // If the request is made by a staff user masquerading as a specific learner,\n // don't actually create a signature for them on the backend.\n // Only the modal dialog will be dismissed.\n // Otherwise, even for staff users, we want to record the signature.\n saveIntegritySignature(\n courseId,\n isMasquerading && username !== authUser.username,\n ),\n );\n\n return (\n \n {siteName}{' '}\n {intl.formatMessage(messages['learn.honorCode.name'])}\n
\n\n\n
\n \n
\n )}\n \n \n
\n\n {pastExpirationDeadline\n ? null\n : (\n \n {intl.formatMessage(messages['learn.lockPaywall.title'])}\n
\n {pastExpirationDeadline ? (\n\n {intl.formatMessage(messages['learn.lockPaywall.content.pastExpiration'])}\n {intl.formatMessage(messages['learn.lockPaywall.courseDetails'])} \n
\n ) : (\n \n {intl.formatMessage(messages['learn.lockPaywall.content'])}\n
\n )}\n\n \n
\n \n
\n\n \n
\n \n {intl.formatMessage(messages['learn.lockPaywall.list.intro'])}\n
\n - \n
\n {SIDEBAR_ORDER.map((sidebarId) => {\n const { Trigger } = SIDEBARS[sidebarId];\n const isActive = sidebarId === currentSidebar;\n return (\n \n toggleSidebar(sidebarId)} key={sidebarId} />\n
\n );\n })}\n \n );\n};\n\nSidebarTriggers.propTypes = {};\n\nexport default SidebarTriggers;\n","import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';\nimport { Icon, IconButton } from '@openedx/paragon';\nimport { ArrowBackIos, Close } from '@openedx/paragon/icons';\nimport classNames from 'classnames';\nimport PropTypes from 'prop-types';\nimport { useCallback, useContext } from 'react';\nimport { useEventListener } from '@src/generic/hooks';\nimport messages from '../../messages';\nimport SidebarContext from '../SidebarContext';\n\nconst SidebarBase = ({\n intl,\n title,\n ariaLabel,\n sidebarId,\n className,\n children,\n showTitleBar,\n width,\n}) => {\n const {\n toggleSidebar,\n shouldDisplayFullScreen,\n currentSidebar,\n } = useContext(SidebarContext);\n\n const receiveMessage = useCallback(({ data }) => {\n const { type } = data;\n if (type === 'learning.events.sidebar.close') {\n toggleSidebar(null);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [sidebarId, toggleSidebar]);\n\n useEventListener('message', receiveMessage);\n\n return (\n \n {title}\n {shouldDisplayFullScreen\n ? null\n : (\n
\n \n )}\n {children}\n \n );\n};\n\nSidebarBase.propTypes = {\n intl: intlShape.isRequired,\n title: PropTypes.string.isRequired,\n ariaLabel: PropTypes.string.isRequired,\n sidebarId: PropTypes.string.isRequired,\n className: PropTypes.string.isRequired,\n children: PropTypes.element.isRequired,\n showTitleBar: PropTypes.bool,\n width: PropTypes.string,\n};\n\nSidebarBase.defaultProps = {\n width: '31rem',\n showTitleBar: true,\n};\n\nexport default injectIntl(SidebarBase);\n","import { injectIntl } from '@edx/frontend-platform/i18n';\nimport PropTypes from 'prop-types';\nimport React from 'react';\n\nconst SidebarTriggerBase = ({\n onClick,\n ariaLabel,\n children,\n}) => (\n \n toggleSidebar(null)}\n variant=\"primary\"\n alt={intl.formatMessage(messages.closeNotificationTrigger)}\n />\n
\n )}\n \n {children}\n
\n \n);\n\nSidebarTriggerBase.propTypes = {\n onClick: PropTypes.func.isRequired,\n ariaLabel: PropTypes.string.isRequired,\n children: PropTypes.element.isRequired,\n};\n\nexport default injectIntl(SidebarTriggerBase);\n","import PropTypes from 'prop-types';\n\nconst DashedCircleIcon = (props) => (\n \n
\n \n {title}\n \n , {intl.formatMessage(complete\n ? courseOutlineMessages.completedSection\n : courseOutlineMessages.incompleteSection)}\n \n
\n \n );\n\n return (\n \n
\n \n \n {title}\n \n \n , {intl.formatMessage(complete ? messages.completedUnit : messages.incompleteUnit)}\n \n
\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';\n\nimport { useNavigate, useParams } from 'react-router-dom';\n\nconst withParamsAndNavigation = WrappedComponent => {\n const WithParamsNavigationComponent = props => {\n const { courseId, sequenceId, unitId } = useParams();\n const navigate = useNavigate();\n return (\n \n \n
\n \n );\n }\n}\n\nPageLoading.propTypes = {\n srMessage: PropTypes.node.isRequired,\n};\n","import React, { useMemo } from 'react';\nimport PropTypes from 'prop-types';\nimport { Dropdown } from '@openedx/paragon';\nimport { FormattedMessage } from '@edx/frontend-platform/i18n';\nimport classNames from 'classnames';\n\nimport useIndexOfLastVisibleChild from './useIndexOfLastVisibleChild';\n\nconst 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(\n indexOfOverflowStart,\n 0, (\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\nconst PastExpirationCardContent = () => (\n \n
\n
\n
\n);\n\nconst ExpirationCountdown = ({\n courseId, hoursToExpiration, setupgradeNotificationCurrentState, type,\n}) => {\n let expirationText;\n if (hoursToExpiration >= 24) { // More than 1 day left\n // setupgradeNotificationCurrentState is available in NotificationTray (not course home)\n if (setupgradeNotificationCurrentState) {\n if (type === 'access') {\n setupgradeNotificationCurrentState('accessDaysLeft');\n setLocalStorage(`upgradeNotificationCurrentState.${courseId}`, 'accessDaysLeft');\n }\n if (type === 'offer') {\n setupgradeNotificationCurrentState('FPDdaysLeft');\n setLocalStorage(`upgradeNotificationCurrentState.${courseId}`, 'FPDdaysLeft');\n }\n }\n expirationText = (\n \n
{expirationText}
);\n};\n\nExpirationCountdown.propTypes = {\n courseId: PropTypes.string.isRequired,\n hoursToExpiration: PropTypes.number.isRequired,\n setupgradeNotificationCurrentState: PropTypes.func,\n type: PropTypes.string,\n};\nExpirationCountdown.defaultProps = {\n setupgradeNotificationCurrentState: null,\n type: null,\n};\n\nconst AccessExpirationDateBanner = ({\n courseId, accessExpirationDate, timezoneFormatArgs, setupgradeNotificationCurrentState,\n}) => {\n if (setupgradeNotificationCurrentState) {\n setupgradeNotificationCurrentState('accessDateView');\n setLocalStorage(`upgradeNotificationCurrentState.${courseId}`, 'accessDateView');\n }\n return (\n \n
\n );\n};\n\nAccessExpirationDateBanner.propTypes = {\n courseId: PropTypes.string.isRequired,\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\nconst PastExpirationDateBanner = ({\n courseId, accessExpirationDate, timezoneFormatArgs, setupgradeNotificationCurrentState,\n}) => {\n if (setupgradeNotificationCurrentState) {\n setupgradeNotificationCurrentState('PastExpirationDate');\n setLocalStorage(`upgradeNotificationCurrentState.${courseId}`, 'PastExpirationDate');\n }\n return (\n \n
\n );\n};\n\nPastExpirationDateBanner.propTypes = {\n courseId: PropTypes.string.isRequired,\n accessExpirationDate: PropTypes.PropTypes.instanceOf(Date).isRequired,\n timezoneFormatArgs: PropTypes.shape({\n timeZone: PropTypes.string,\n }),\n setupgradeNotificationCurrentState: PropTypes.func,\n};\n\nPastExpirationDateBanner.defaultProps = {\n timezoneFormatArgs: {},\n setupgradeNotificationCurrentState: null,\n};\n\nconst UpgradeNotification = ({\n accessExpiration,\n contentTypeGatingEnabled,\n marketingUrl,\n courseId,\n offer,\n org,\n setupgradeNotificationCurrentState,\n shouldDisplayBorder,\n timeOffsetMillis,\n upsellPageName,\n userTimezone,\n verifiedMode,\n toggleSidebar,\n}) => {\n const intl = useIntl();\n const dateNow = Date.now();\n const timezoneFormatArgs = userTimezone ? { timeZone: userTimezone } : {};\n const correctedTime = new Date(dateNow + timeOffsetMillis);\n const accessExpirationDate = accessExpiration ? new Date(accessExpiration.expirationDate) : null;\n const pastExpirationDeadline = accessExpiration ? new Date(dateNow) > accessExpirationDate : false;\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 // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n if (!verifiedMode) {\n return null;\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 const logClickPastExpiration = () => {\n sendTrackEvent('edx.bi.ecommerce.upgrade_notification.past_expiration.button_clicked', {\n ...eventProperties,\n linkCategory: 'upgrade_notification',\n linkName: `${upsellPageName}_course_details`,\n linkType: 'button',\n pageName: upsellPageName,\n });\n };\n\n /*\n There are 5 parts that change in the upgrade card:\n upgradeNotificationHeaderText\n expirationBanner\n upsellMessage\n callToActionButton\n offerCode\n */\n let upgradeNotificationHeaderText;\n let expirationBanner;\n let upsellMessage;\n let callToActionButton;\n let offerCode;\n\n if (!!accessExpiration && !!contentTypeGatingEnabled) {\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 \n {upgradeNotificationHeaderText}\n {!!toggleSidebar && (\n
\n \n
\n )}\n \n {expirationBanner}\n \n {upsellMessage}\n
\n \n {callToActionButton}\n
\n {offerCode}\n - \nexport const VerifiedCertBullet = () => {\n const verifiedCertLink = (\n \n
- \n
\n \n );\n};\n\n// Must be child of a - \n
\n \n );\n};\n\n// Must be child of a - \n
\n \n );\n};\n\n// Must be child of a - \n
\n \n );\n};\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport { Alert as ParagonAlert } from '@openedx/paragon';\nimport { CheckCircle, Info, WarningFilled } from '@openedx/paragon/icons';\n\nimport { ALERT_TYPES } from './UserMessagesProvider';\n\nfunction getAlertVariant(type) {\n switch (type) {\n case ALERT_TYPES.ERROR:\n return 'warning';\n case ALERT_TYPES.DANGER:\n return 'danger';\n case ALERT_TYPES.SUCCESS:\n return 'success';\n default:\n return 'info';\n }\n}\n\nfunction getAlertIcon(type) {\n switch (type) {\n case ALERT_TYPES.ERROR:\n return WarningFilled;\n case ALERT_TYPES.SUCCESS:\n return CheckCircle;\n default:\n return Info;\n }\n}\n\nconst Alert = ({\n type, dismissible, children, onDismiss, stacked,\n}) => (\n
- \nexport const UnlockGradedBullet = () => {\n const gradedAssignmentsInBoldText = (\n \n
- \nexport const FullAccessBullet = () => {\n const fullAccessInBoldText = (\n \n
- \nexport const SupportMissionBullet = () => {\n const missionInBoldText = (\n \n
\n \n \n
\n );\n};\n\nexport default PreferencesUnsubscribe;\n","import { getConfig } from '@edx/frontend-platform';\nimport { getAuthenticatedHttpClient } from '@edx/frontend-platform/auth';\n\nexport const getUnsubscribeUrl = (userToken, updatePatch) => (\n `${getConfig().LMS_BASE_URL}/api/notifications/preferences/update/${userToken}/${updatePatch}/`\n);\n\nexport async function unsubscribeNotificationPreferences(userToken, updatePatch) {\n const url = getUnsubscribeUrl(userToken, updatePatch);\n return getAuthenticatedHttpClient().get(url);\n}\n","import React from 'react';\nimport { FormattedMessage } from '@edx/frontend-platform/i18n';\n\nexport const DismissButtonFormattedMessage = () => (\n \n
\n \n {status === LOADING && \n {intl.formatMessage(messages.preferenceCenterUrl)}\n \n ),\n }}\n />\n \n \n )}\n
\n \n {intl.formatMessage(pageContent.headingText)}\n
\n\n {intl.formatMessage(pageContent.bodyText)}\n
\n \n {intl.formatMessage(messages.newUserModalBody, { siteName: getConfig().SITE_NAME })}
\n \n);\n\nNewUserCourseHomeTourModal.propTypes = {\n intl: intlShape.isRequired,\n isOpen: PropTypes.bool.isRequired,\n onDismiss: PropTypes.func.isRequired,\n onStartTour: PropTypes.func.isRequired,\n};\n\nexport default injectIntl(NewUserCourseHomeTourModal);\n","/* eslint-disable react-hooks/exhaustive-deps */\nimport React, { useEffect, useState } from 'react';\nimport { useDispatch, useSelector } from 'react-redux';\nimport PropTypes from 'prop-types';\nimport { sendTrackEvent } from '@edx/frontend-platform/analytics';\nimport { getAuthenticatedUser } from '@edx/frontend-platform/auth';\nimport { ProductTour } from '@openedx/paragon';\n\nimport abandonTour from './AbandonTour';\nimport coursewareTour from './CoursewareTour';\nimport existingUserCourseHomeTour from './ExistingUserCourseHomeTour';\nimport newUserCourseHomeTour from './newUserCourseHomeTour/NewUserCourseHomeTour';\nimport NewUserCourseHomeTourModal from './newUserCourseHomeTour/NewUserCourseHomeTourModal';\nimport {\n closeNewUserCourseHomeModal,\n endCourseHomeTour,\n endCoursewareTour,\n fetchTourData,\n} from './data';\n\nconst ProductTours = ({\n activeTab,\n courseId,\n isStreakCelebrationOpen,\n org,\n}) => {\n const {\n proctoringPanelStatus,\n } = useSelector(state => state.courseHome);\n\n const {\n showCoursewareTour,\n showExistingUserCourseHomeTour,\n showNewUserCourseHomeModal,\n showNewUserCourseHomeTour,\n } = useSelector(state => state.tours);\n\n const [isAbandonTourEnabled, setIsAbandonTourEnabled] = useState(false);\n const [isCoursewareTourEnabled, setIsCoursewareTourEnabled] = useState(false);\n const [isExistingUserCourseHomeTourEnabled, setIsExistingUserCourseHomeTourEnabled] = useState(false);\n const [isNewUserCourseHomeTourEnabled, setIsNewUserCourseHomeTourEnabled] = useState(false);\n\n const dispatch = useDispatch();\n const {\n administrator,\n username,\n } = getAuthenticatedUser() || {};\n const isCoursewareTab = activeTab === 'courseware';\n const isOutlineTab = activeTab === 'outline';\n\n useEffect(() => {\n const isOutlineTabResolved = isOutlineTab && proctoringPanelStatus === 'loaded';\n const userIsAuthenticated = !!username;\n\n // Tours currently only exist on the Outline Tab and within Courseware, so we'll avoid\n // calling the tour endpoint unnecessarily.\n if (userIsAuthenticated && (isCoursewareTab || isOutlineTabResolved)) {\n dispatch(fetchTourData(username));\n }\n }, [proctoringPanelStatus]);\n\n useEffect(() => {\n if (isCoursewareTab && showCoursewareTour) {\n setIsCoursewareTourEnabled(true);\n }\n }, [showCoursewareTour]);\n\n useEffect(() => {\n if (isOutlineTab) {\n setIsExistingUserCourseHomeTourEnabled(!!showExistingUserCourseHomeTour);\n }\n }, [showExistingUserCourseHomeTour]);\n\n useEffect(() => {\n if (isOutlineTab && showNewUserCourseHomeTour) {\n setIsAbandonTourEnabled(false);\n setIsNewUserCourseHomeTourEnabled(true);\n }\n }, [showNewUserCourseHomeTour]);\n\n if (isStreakCelebrationOpen) {\n return null;\n }\n\n // The