From d5f9af19543d31a819212cdd6da70b579a9774d4 Mon Sep 17 00:00:00 2001 From: Carla Duarte Date: Tue, 11 Aug 2020 11:08:29 -0400 Subject: [PATCH] AA-129: Resume Course button (#133) --- .../data/__factories__/outlineTabData.factory.js | 7 ++++++- .../data/__snapshots__/redux.test.js.snap | 6 +++++- src/course-home/data/api.js | 2 ++ .../dates-banner/DatesBannerContainer.jsx | 4 ++-- src/course-home/outline-tab/OutlineTab.jsx | 13 ++++++++++--- src/course-home/outline-tab/messages.js | 4 ++++ src/course-home/outline-tab/widgets/CourseDates.jsx | 4 ++-- .../outline-tab/widgets/CourseHandouts.jsx | 2 +- src/course-home/outline-tab/widgets/CourseTools.jsx | 2 +- 9 files changed, 33 insertions(+), 11 deletions(-) diff --git a/src/course-home/data/__factories__/outlineTabData.factory.js b/src/course-home/data/__factories__/outlineTabData.factory.js index a523bb7f..4f332c33 100644 --- a/src/course-home/data/__factories__/outlineTabData.factory.js +++ b/src/course-home/data/__factories__/outlineTabData.factory.js @@ -22,4 +22,9 @@ Factory.define('outlineTabData') extra_text: 'Contact the administrator.', }) .attr('handouts_html', [], () => '') - .attr('offer_html', [], () => '
Great offer here
'); + .attr('offer_html', [], () => '
Great offer here
') + .attr('resume_course', ['host', 'courseId'], (host, courseId) => ({ + has_visited_course: false, + url: `${host}/courses/${courseId}/jump_to/block-v1:edX+Test+Block@12345abcde`, + })) + .attr('welcome_message_html', [], () => '

Welcome to this course!

'); diff --git a/src/course-home/data/__snapshots__/redux.test.js.snap b/src/course-home/data/__snapshots__/redux.test.js.snap index 48e6635b..8a26fb65 100644 --- a/src/course-home/data/__snapshots__/redux.test.js.snap +++ b/src/course-home/data/__snapshots__/redux.test.js.snap @@ -211,7 +211,11 @@ Object { "handoutsHtml": "", "id": "course-v1:edX+DemoX+Demo_Course_1", "offerHtml": "
Great offer here
", - "welcomeMessageHtml": undefined, + "resumeCourse": Object { + "hasVisitedCourse": false, + "url": "http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+Test+Block@12345abcde", + }, + "welcomeMessageHtml": "

Welcome to this course!

", }, }, }, diff --git a/src/course-home/data/api.js b/src/course-home/data/api.js index 7faffb92..f362a5df 100644 --- a/src/course-home/data/api.js +++ b/src/course-home/data/api.js @@ -75,6 +75,7 @@ export async function getOutlineTabData(courseId) { const enrollAlert = camelCaseObject(data.enroll_alert); const handoutsHtml = data.handouts_html; const offerHtml = data.offer_html; + const resumeCourse = camelCaseObject(data.resume_course); const welcomeMessageHtml = data.welcome_message_html; return { @@ -85,6 +86,7 @@ export async function getOutlineTabData(courseId) { enrollAlert, handoutsHtml, offerHtml, + resumeCourse, welcomeMessageHtml, }; } diff --git a/src/course-home/dates-banner/DatesBannerContainer.jsx b/src/course-home/dates-banner/DatesBannerContainer.jsx index ec6fcdf7..ce7c6dad 100644 --- a/src/course-home/dates-banner/DatesBannerContainer.jsx +++ b/src/course-home/dates-banner/DatesBannerContainer.jsx @@ -46,12 +46,12 @@ function DatesBannerContainer(props) { { name: 'upgradeToCompleteGradedBanner', shouldDisplay: upgradeToCompleteGraded, - clickHandler: () => window.location.replace(verifiedUpgradeLink), + clickHandler: () => global.location.replace(verifiedUpgradeLink), }, { name: 'upgradeToResetBanner', shouldDisplay: upgradeToReset, - clickHandler: () => window.location.replace(verifiedUpgradeLink), + clickHandler: () => global.location.replace(verifiedUpgradeLink), }, { name: 'resetDatesBanner', diff --git a/src/course-home/outline-tab/OutlineTab.jsx b/src/course-home/outline-tab/OutlineTab.jsx index 25a81364..d249d1a4 100644 --- a/src/course-home/outline-tab/OutlineTab.jsx +++ b/src/course-home/outline-tab/OutlineTab.jsx @@ -1,6 +1,5 @@ import React from 'react'; import { useSelector } from 'react-redux'; -import { Button } from '@edx/paragon'; import { injectIntl, intlShape } from '@edx/frontend-platform/i18n'; import { AlertList } from '../../generic/user-messages'; @@ -41,6 +40,10 @@ function OutlineTab({ intl }) { sections, }, courseExpiredHtml, + resumeCourse: { + hasVisitedCourse, + url: resumeCourseUrl, + }, offerHtml, } = useModel('outline', courseId); @@ -69,8 +72,12 @@ function OutlineTab({ intl }) { }} />
-

{title}

- +
{title}
+ {resumeCourseUrl && ( + + {hasVisitedCourse ? intl.formatMessage(messages.resume) : intl.formatMessage(messages.start)} + + )}
diff --git a/src/course-home/outline-tab/messages.js b/src/course-home/outline-tab/messages.js index ee0e0190..c914ad0f 100644 --- a/src/course-home/outline-tab/messages.js +++ b/src/course-home/outline-tab/messages.js @@ -17,6 +17,10 @@ const messages = defineMessages({ id: 'learning.outline.resume', defaultMessage: 'Resume Course', }, + start: { + id: 'learning.outline.start', + defaultMessage: 'Start Course', + }, tools: { id: 'learning.outline.tools', defaultMessage: 'Course Tools', diff --git a/src/course-home/outline-tab/widgets/CourseDates.jsx b/src/course-home/outline-tab/widgets/CourseDates.jsx index 33bcae3b..2d2c1d77 100644 --- a/src/course-home/outline-tab/widgets/CourseDates.jsx +++ b/src/course-home/outline-tab/widgets/CourseDates.jsx @@ -14,7 +14,7 @@ function CourseDates({ courseId, intl }) { return (
-

{intl.formatMessage(messages.dates)}

+

{intl.formatMessage(messages.dates)}

{datesWidget.courseDateBlocks.map((courseDateBlock) => ( ))} - + {intl.formatMessage(messages.allDates)}
diff --git a/src/course-home/outline-tab/widgets/CourseHandouts.jsx b/src/course-home/outline-tab/widgets/CourseHandouts.jsx index 5ed67b0a..d709827c 100644 --- a/src/course-home/outline-tab/widgets/CourseHandouts.jsx +++ b/src/course-home/outline-tab/widgets/CourseHandouts.jsx @@ -18,7 +18,7 @@ function CourseHandouts({ courseId, intl }) { return (
-

{intl.formatMessage(messages.handouts)}

+

{intl.formatMessage(messages.handouts)}

-

{intl.formatMessage(messages.tools)}

+

{intl.formatMessage(messages.tools)}

{courseTools.map((courseTool) => (