diff --git a/src/course-home/data/__factories__/courseBlocks.factory.js b/src/course-home/data/__factories__/courseBlocks.factory.js
index 56041725..a6708899 100644
--- a/src/course-home/data/__factories__/courseBlocks.factory.js
+++ b/src/course-home/data/__factories__/courseBlocks.factory.js
@@ -56,7 +56,7 @@ Factory.define('courseBlocks')
export default function buildSimpleCourseBlocks(courseId, title, options = {}) {
const sequenceBlock = options.sequenceBlock || [Factory.build(
'block',
- { type: 'sequential' },
+ { display_name: 'Title of Sequence', type: 'sequential' },
{ courseId },
)];
const sectionBlock = options.sectionBlock || Factory.build(
diff --git a/src/course-home/data/__factories__/courseHomeMetadata.factory.js b/src/course-home/data/__factories__/courseHomeMetadata.factory.js
index 4db203d9..9d7bc728 100644
--- a/src/course-home/data/__factories__/courseHomeMetadata.factory.js
+++ b/src/course-home/data/__factories__/courseHomeMetadata.factory.js
@@ -13,6 +13,7 @@ Factory.define('courseHomeMetadata')
title: 'Demonstration Course',
is_self_paced: false,
is_enrolled: false,
+ can_load_courseware: false,
})
.attr(
'tabs', ['courseId', 'host'], (courseId, host) => {
diff --git a/src/course-home/data/__snapshots__/redux.test.js.snap b/src/course-home/data/__snapshots__/redux.test.js.snap
index e837efef..7eeb2583 100644
--- a/src/course-home/data/__snapshots__/redux.test.js.snap
+++ b/src/course-home/data/__snapshots__/redux.test.js.snap
@@ -18,6 +18,7 @@ Object {
"models": Object {
"courseHomeMeta": Object {
"course-v1:edX+DemoX+Demo_Course_1": Object {
+ "canLoadCourseware": false,
"courseId": "course-v1:edX+DemoX+Demo_Course_1",
"id": "course-v1:edX+DemoX+Demo_Course_1",
"isEnrolled": false,
@@ -303,6 +304,7 @@ Object {
"models": Object {
"courseHomeMeta": Object {
"course-v1:edX+DemoX+Demo_Course_1": Object {
+ "canLoadCourseware": false,
"courseId": "course-v1:edX+DemoX+Demo_Course_1",
"id": "course-v1:edX+DemoX+Demo_Course_1",
"isEnrolled": false,
@@ -385,9 +387,10 @@ Object {
"effortTime": undefined,
"icon": null,
"id": "block-v1:edX+DemoX+Demo_Course+type@sequential+block@bcdabcdabcdabcdabcdabcdabcdabcd1",
+ "lmsWebUrl": "http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@sequential+block@bcdabcdabcdabcdabcdabcdabcdabcd1",
"sectionId": "block-v1:edX+DemoX+Demo_Course+type@chapter+block@bcdabcdabcdabcdabcdabcdabcdabcd2",
"showLink": true,
- "title": "bcdabcdabcdabcdabcdabcdabcdabcd1",
+ "title": "Title of Sequence",
},
},
},
diff --git a/src/course-home/data/api.js b/src/course-home/data/api.js
index 3f92e6bb..130a6e66 100644
--- a/src/course-home/data/api.js
+++ b/src/course-home/data/api.js
@@ -56,6 +56,7 @@ export function normalizeOutlineBlocks(courseId, blocks) {
effortTime: block.effort_time,
icon: block.icon,
id: block.id,
+ lmsWebUrl: block.lms_web_url,
showLink: !!block.lms_web_url, // we reconstruct the url ourselves as an MFE-internal
title: block.display_name,
};
diff --git a/src/course-home/outline-tab/OutlineTab.test.jsx b/src/course-home/outline-tab/OutlineTab.test.jsx
index 77ebd162..b8849a20 100644
--- a/src/course-home/outline-tab/OutlineTab.test.jsx
+++ b/src/course-home/outline-tab/OutlineTab.test.jsx
@@ -123,6 +123,34 @@ describe('Outline Tab', () => {
await fetchAndRender();
expect(screen.getByTitle('Incomplete section')).toBeInTheDocument();
});
+
+ it('SequenceLink displays points to legacy courseware', async () => {
+ const { courseBlocks } = await buildSimpleCourseBlocks(courseId, 'Title', { resumeBlock: true });
+ setMetadata({
+ can_load_courseware: false,
+ });
+ setTabData({
+ course_blocks: { blocks: courseBlocks.blocks },
+ });
+ await fetchAndRender();
+
+ const sequenceLink = screen.getByText('Title of Sequence');
+ expect(sequenceLink.getAttribute('href')).toContain(`/courses/${courseId}`);
+ });
+
+ it('SequenceLink displays points to courseware MFE', async () => {
+ const { courseBlocks } = await buildSimpleCourseBlocks(courseId, 'Title', { resumeBlock: true });
+ setMetadata({
+ can_load_courseware: true,
+ });
+ setTabData({
+ course_blocks: { blocks: courseBlocks.blocks },
+ });
+ await fetchAndRender();
+
+ const sequenceLink = screen.getByText('Title of Sequence');
+ expect(sequenceLink.getAttribute('href')).toContain(`/course/${courseId}`);
+ });
});
describe('Welcome Message', () => {
diff --git a/src/course-home/outline-tab/SequenceLink.jsx b/src/course-home/outline-tab/SequenceLink.jsx
index 530d278a..b79d75f0 100644
--- a/src/course-home/outline-tab/SequenceLink.jsx
+++ b/src/course-home/outline-tab/SequenceLink.jsx
@@ -2,6 +2,7 @@ import React from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import { Link } from 'react-router-dom';
+import { Hyperlink } from '@edx/paragon';
import {
FormattedMessage,
FormattedTime,
@@ -27,6 +28,7 @@ function SequenceLink({
complete,
description,
due,
+ lmsWebUrl,
showLink,
title,
} = sequence;
@@ -35,10 +37,15 @@ function SequenceLink({
userTimezone,
},
} = useModel('outline', courseId);
+ const {
+ canLoadCourseware,
+ } = useModel('courseHomeMeta', courseId);
const timezoneFormatArgs = userTimezone ? { timeZone: userTimezone } : {};
- const displayTitle = showLink ? {title} : title;
+ // canLoadCourseware is true if the Courseware MFE is enabled, false otherwise
+ const coursewareUrl = canLoadCourseware ? {title} :