3fe5bb1733
This is the first step toward clearing out the redundant metadata from the coursewareMetadata and getting it from a common source - the courseHomeMetadata. remove username from coursewareMetadata Remove courseAccess from coursewareMetadata. Fix all unit tests Modify classes that use metadataModel to use courseHomeMetadata for common data. metadataModel still exists as a mechanism to distinguish if a component is under courseware or courseHome, and it will be renamed or removed in a later refactor.
107 lines
3.2 KiB
JavaScript
107 lines
3.2 KiB
JavaScript
import React from 'react';
|
|
import PropTypes from 'prop-types';
|
|
import { Helmet } from 'react-helmet';
|
|
|
|
import { getConfig } from '@edx/frontend-platform';
|
|
import { useToggle } from '@edx/paragon';
|
|
|
|
import { CourseTabsNavigation } from '../course-tabs';
|
|
import { useModel } from '../generic/model-store';
|
|
import { AlertList } from '../generic/user-messages';
|
|
import StreakModal from '../shared/streak-celebration';
|
|
import InstructorToolbar from '../instructor-toolbar';
|
|
import useEnrollmentAlert from '../alerts/enrollment-alert';
|
|
import useLogistrationAlert from '../alerts/logistration-alert';
|
|
|
|
import ProductTours from '../product-tours/ProductTours';
|
|
|
|
function LoadedTabPage({
|
|
activeTabSlug,
|
|
children,
|
|
courseId,
|
|
metadataModel,
|
|
unitId,
|
|
}) {
|
|
const {
|
|
celebrations,
|
|
canViewLegacyCourseware,
|
|
org,
|
|
originalUserIsStaff,
|
|
tabs,
|
|
title,
|
|
verifiedMode,
|
|
} = useModel('courseHomeMeta', courseId);
|
|
|
|
// Logistration and enrollment alerts are only really used for the outline tab, but loaded here to put them above
|
|
// breadcrumbs when they are visible.
|
|
const logistrationAlert = useLogistrationAlert(courseId);
|
|
const enrollmentAlert = useEnrollmentAlert(courseId);
|
|
|
|
const activeTab = tabs.filter(tab => tab.slug === activeTabSlug)[0];
|
|
|
|
const streakLengthToCelebrate = celebrations && celebrations.streakLengthToCelebrate;
|
|
const streakDiscountCouponEnabled = celebrations && celebrations.streakDiscountEnabled && verifiedMode;
|
|
const [isStreakCelebrationOpen,, closeStreakCelebration] = useToggle(streakLengthToCelebrate);
|
|
|
|
return (
|
|
<>
|
|
<ProductTours
|
|
activeTab={activeTabSlug}
|
|
courseId={courseId}
|
|
isStreakCelebrationOpen={isStreakCelebrationOpen}
|
|
org={org}
|
|
/>
|
|
<Helmet>
|
|
<title>{`${activeTab ? `${activeTab.title} | ` : ''}${title} | ${getConfig().SITE_NAME}`}</title>
|
|
</Helmet>
|
|
{originalUserIsStaff && (
|
|
<InstructorToolbar
|
|
courseId={courseId}
|
|
unitId={unitId}
|
|
canViewLegacyCourseware={canViewLegacyCourseware}
|
|
tab={activeTabSlug}
|
|
/>
|
|
)}
|
|
<StreakModal
|
|
courseId={courseId}
|
|
metadataModel={metadataModel}
|
|
streakLengthToCelebrate={streakLengthToCelebrate}
|
|
isStreakCelebrationOpen={!!isStreakCelebrationOpen}
|
|
closeStreakCelebration={closeStreakCelebration}
|
|
streakDiscountCouponEnabled={streakDiscountCouponEnabled}
|
|
verifiedMode={verifiedMode}
|
|
/>
|
|
<main id="main-content" className="d-flex flex-column flex-grow-1">
|
|
<AlertList
|
|
topic="outline"
|
|
className="mx-5 mt-3"
|
|
customAlerts={{
|
|
...enrollmentAlert,
|
|
...logistrationAlert,
|
|
}}
|
|
/>
|
|
<CourseTabsNavigation tabs={tabs} className="mb-3" activeTabSlug={activeTabSlug} />
|
|
<div className="container-xl">
|
|
{children}
|
|
</div>
|
|
</main>
|
|
</>
|
|
);
|
|
}
|
|
|
|
LoadedTabPage.propTypes = {
|
|
activeTabSlug: PropTypes.string.isRequired,
|
|
children: PropTypes.node,
|
|
courseId: PropTypes.string.isRequired,
|
|
metadataModel: PropTypes.string,
|
|
unitId: PropTypes.string,
|
|
};
|
|
|
|
LoadedTabPage.defaultProps = {
|
|
children: null,
|
|
metadataModel: 'courseHomeMeta',
|
|
unitId: null,
|
|
};
|
|
|
|
export default LoadedTabPage;
|