diff --git a/src/learning-sequence/CourseContainer.jsx b/src/courseware/CourseContainer.jsx similarity index 100% rename from src/learning-sequence/CourseContainer.jsx rename to src/courseware/CourseContainer.jsx diff --git a/src/learning-sequence/PageLoading.jsx b/src/courseware/PageLoading.jsx similarity index 100% rename from src/learning-sequence/PageLoading.jsx rename to src/courseware/PageLoading.jsx diff --git a/src/learning-sequence/course/Course.jsx b/src/courseware/course/Course.jsx similarity index 66% rename from src/learning-sequence/course/Course.jsx rename to src/courseware/course/Course.jsx index c2bc7e9c..f612a8eb 100644 --- a/src/learning-sequence/course/Course.jsx +++ b/src/courseware/course/Course.jsx @@ -6,6 +6,8 @@ import CourseBreadcrumbs from './CourseBreadcrumbs'; import SequenceContainer from './SequenceContainer'; import { createSequenceIdList } from '../utils'; import AlertList from '../../user-messages/AlertList'; +import CourseHeader from './CourseHeader'; +import CourseTabsNavigation from './CourseTabsNavigation'; export default function Course({ courseUsageKey, courseId, sequenceId, unitId, models, @@ -33,26 +35,32 @@ export default function Course({ }); return ( -
- - - -
+ <> + +
+
+ + + +
+ +
+ ); } diff --git a/src/learning-sequence/course/CourseBreadcrumb.jsx b/src/courseware/course/CourseBreadcrumb.jsx similarity index 100% rename from src/learning-sequence/course/CourseBreadcrumb.jsx rename to src/courseware/course/CourseBreadcrumb.jsx diff --git a/src/learning-sequence/course/CourseBreadcrumbs.jsx b/src/courseware/course/CourseBreadcrumbs.jsx similarity index 100% rename from src/learning-sequence/course/CourseBreadcrumbs.jsx rename to src/courseware/course/CourseBreadcrumbs.jsx diff --git a/src/courseware/course/CourseHeader.jsx b/src/courseware/course/CourseHeader.jsx new file mode 100644 index 00000000..3c3dbe3d --- /dev/null +++ b/src/courseware/course/CourseHeader.jsx @@ -0,0 +1,58 @@ +import React, { useContext } from 'react'; +import PropTypes from 'prop-types'; +import { Dropdown } from '@edx/paragon'; +import { getConfig } from '@edx/frontend-platform'; +import { AppContext } from '@edx/frontend-platform/react'; +import logo from './logo.svg'; + +function LinkedLogo({ + href, + src, + alt, + ...attributes +}) { + return ( + + {alt} + + ); +} + +LinkedLogo.propTypes = { + href: PropTypes.string.isRequired, + src: PropTypes.string.isRequired, + alt: PropTypes.string.isRequired, +}; + +export default function CourseHeader({ courseId, models }) { + const { authenticatedUser } = useContext(AppContext); + const course = models[courseId]; + return ( +
+ +
+ edX DemoX + {course.displayName} +
+ + + + {authenticatedUser.username} + + + Resume your last course + Dashboard + Profile + Account + Order History + Sign Out + + +
+ ); +} diff --git a/src/components/CourseTabsNavigation.jsx b/src/courseware/course/CourseTabsNavigation.jsx similarity index 88% rename from src/components/CourseTabsNavigation.jsx rename to src/courseware/course/CourseTabsNavigation.jsx index 7ef35b6a..2c4fc06b 100644 --- a/src/components/CourseTabsNavigation.jsx +++ b/src/courseware/course/CourseTabsNavigation.jsx @@ -1,10 +1,14 @@ import React from 'react'; import PropTypes from 'prop-types'; import { injectIntl, intlShape } from '@edx/frontend-platform/i18n'; +import classNames from 'classnames'; + import messages from './messages'; import NavTab from './NavTab'; -function CourseTabsNavigation({ activeTabSlug, courseTabs, intl }) { +function CourseTabsNavigation({ + activeTabSlug, courseTabs, intl, className, +}) { const courseNavTabs = courseTabs.map(({ slug, ...courseTab }) => ( {courseNavTabs} @@ -25,6 +29,7 @@ function CourseTabsNavigation({ activeTabSlug, courseTabs, intl }) { CourseTabsNavigation.propTypes = { activeTabSlug: PropTypes.string, + className: PropTypes.string, courseTabs: PropTypes.arrayOf(PropTypes.shape({ title: PropTypes.string.isRequired, priority: PropTypes.number.isRequired, @@ -36,6 +41,7 @@ CourseTabsNavigation.propTypes = { CourseTabsNavigation.defaultProps = { activeTabSlug: undefined, + className: null, courseTabs: [ { title: 'Course', diff --git a/src/components/NavTab.jsx b/src/courseware/course/NavTab.jsx similarity index 100% rename from src/components/NavTab.jsx rename to src/courseware/course/NavTab.jsx diff --git a/src/learning-sequence/course/SequenceContainer.jsx b/src/courseware/course/SequenceContainer.jsx similarity index 100% rename from src/learning-sequence/course/SequenceContainer.jsx rename to src/courseware/course/SequenceContainer.jsx diff --git a/src/courseware/course/logo.svg b/src/courseware/course/logo.svg new file mode 100644 index 00000000..1fbac450 --- /dev/null +++ b/src/courseware/course/logo.svg @@ -0,0 +1,15 @@ + + + + logo + Created with Sketch. + + \ No newline at end of file diff --git a/src/components/messages.js b/src/courseware/course/messages.js similarity index 100% rename from src/components/messages.js rename to src/courseware/course/messages.js diff --git a/src/learning-sequence/index.scss b/src/courseware/index.scss similarity index 100% rename from src/learning-sequence/index.scss rename to src/courseware/index.scss diff --git a/src/learning-sequence/messages.js b/src/courseware/messages.js similarity index 100% rename from src/learning-sequence/messages.js rename to src/courseware/messages.js diff --git a/src/learning-sequence/sequence/CompleteIcon.jsx b/src/courseware/sequence/CompleteIcon.jsx similarity index 100% rename from src/learning-sequence/sequence/CompleteIcon.jsx rename to src/courseware/sequence/CompleteIcon.jsx diff --git a/src/learning-sequence/sequence/Sequence.jsx b/src/courseware/sequence/Sequence.jsx similarity index 91% rename from src/learning-sequence/sequence/Sequence.jsx rename to src/courseware/sequence/Sequence.jsx index e0d74feb..11231af4 100644 --- a/src/learning-sequence/sequence/Sequence.jsx +++ b/src/courseware/sequence/Sequence.jsx @@ -91,15 +91,17 @@ function Sequence({ return (
- - +
+ + +
{isGated ? ( +