From 16bd20e0e87e55d8ff67c10e03833a658bd627f4 Mon Sep 17 00:00:00 2001 From: Michael Terry Date: Mon, 20 Jul 2020 09:24:26 -0400 Subject: [PATCH] AA-121: Support showing handouts in the course outline (#112) And add translation support for the outline. --- .../__factories__/outlineTabData.factory.js | 3 +- .../data/__snapshots__/redux.test.js.snap | 1 + src/course-home/data/api.js | 8 +++- .../outline-tab/LmsHtmlFragment.jsx | 39 +++++++++++++++++++ src/course-home/outline-tab/OutlineTab.jsx | 18 ++++++++- src/course-home/outline-tab/messages.js | 26 +++++++++++++ .../outline-tab/widgets/CourseDates.jsx | 20 +++++++--- .../outline-tab/widgets/CourseHandouts.jsx | 35 +++++++++++++++++ .../outline-tab/widgets/CourseTools.jsx | 13 +++++-- 9 files changed, 150 insertions(+), 13 deletions(-) create mode 100644 src/course-home/outline-tab/LmsHtmlFragment.jsx create mode 100644 src/course-home/outline-tab/messages.js create mode 100644 src/course-home/outline-tab/widgets/CourseHandouts.jsx diff --git a/src/course-home/data/__factories__/outlineTabData.factory.js b/src/course-home/data/__factories__/outlineTabData.factory.js index 10c73219..c9f5d39b 100644 --- a/src/course-home/data/__factories__/outlineTabData.factory.js +++ b/src/course-home/data/__factories__/outlineTabData.factory.js @@ -12,4 +12,5 @@ Factory.define('outlineTabData') })) .attr('course_blocks', ['courseId'], courseId => ({ blocks: Factory.build('courseBlocks', { courseId }).blocks, - })); + })) + .attr('handouts_html', [], () => ''); diff --git a/src/course-home/data/__snapshots__/redux.test.js.snap b/src/course-home/data/__snapshots__/redux.test.js.snap index 8473c1c3..39a0878a 100644 --- a/src/course-home/data/__snapshots__/redux.test.js.snap +++ b/src/course-home/data/__snapshots__/redux.test.js.snap @@ -196,6 +196,7 @@ Object { "url": "http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/bookmarks/", }, "datesWidget": undefined, + "handoutsHtml": "", "id": "course-v1:edX+DemoX+Demo_Course_1", }, }, diff --git a/src/course-home/data/api.js b/src/course-home/data/api.js index 463a4a8b..c1310535 100644 --- a/src/course-home/data/api.js +++ b/src/course-home/data/api.js @@ -71,8 +71,14 @@ export async function getOutlineTabData(courseId) { const courseBlocks = normalizeBlocks(courseId, data.course_blocks.blocks); const courseTools = camelCaseObject(data.course_tools); const datesWidget = camelCaseObject(data.dates_widget); + const handoutsHtml = data.handouts_html; - return { courseTools, courseBlocks, datesWidget }; + return { + courseTools, + courseBlocks, + datesWidget, + handoutsHtml, + }; } export async function postCourseDeadlines(courseId) { diff --git a/src/course-home/outline-tab/LmsHtmlFragment.jsx b/src/course-home/outline-tab/LmsHtmlFragment.jsx new file mode 100644 index 00000000..5496ce3b --- /dev/null +++ b/src/course-home/outline-tab/LmsHtmlFragment.jsx @@ -0,0 +1,39 @@ +import React, { useRef } from 'react'; +import PropTypes from 'prop-types'; + +import { getConfig } from '@edx/frontend-platform'; + +export default function LmsHtmlFragment({ html, title, ...rest }) { + const wholePage = ` + + + + + + ${html} + +`; + + const iframe = useRef(null); + function handleLoad() { + iframe.current.height = iframe.current.contentWindow.document.body.scrollHeight; + } + + return ( +