feat: add unit title to pluginslot (#1383)

src/courseware/course/sequence/Unit/__snapshots__/index.test.jsx.snap

@@ -31,6 +31,7 @@ exports[`Unit component output snapshot: not bookmarked, do not show content 1`]
     <UnitTitleSlot
       courseId="test-course-id"
       unitId="test-props-id"
+      unitTitle="unit-title"
     />
   </div>
   <h2

src/courseware/course/sequence/Unit/index.jsx

@@ -43,7 +43,7 @@ const Unit = ({
     <div className="unit">
       <div className="mb-0">
         <h3 className="h3">{unit.title}</h3>
-        <UnitTitleSlot courseId={courseId} unitId={id} />
+        <UnitTitleSlot courseId={courseId} unitId={id} unitTitle={unit.title} />
       </div>
       <h2 className="sr-only">{formatMessage(messages.headerPlaceholder)}</h2>
       <BookmarkButton

src/plugin-slots/UnitTitleSlot/README.md

@@ -4,6 +4,7 @@
 ### Props:
 * `courseId`
 * `unitId`
+* `unitTitle`
 
 ## Description
 
@@ -11,7 +12,7 @@ This slot is used for adding content after the Unit title.
 
 ## Example
 
-The following `env.config.jsx` will render the `course_id` and `unit_id` of the course as `<p>` elements.
+The following `env.config.jsx` will render the `course_id`, `unit_id` and `unitTitle` of the course as `<p>` elements.
 
 ![Screenshot of Content added after the Unit Title](./images/post_unit_title.png)
 
@@ -28,10 +29,11 @@ const config = {
           widget: {
             id: 'custom_unit_title_content',
             type: DIRECT_PLUGIN,
-            RenderWidget: ({courseId, unitId}) => (
+            RenderWidget: ({courseId, unitId, unitTitle}) => (
               <>
                 <p>📚: {courseId}</p>
                 <p>📙: {unitId}</p>
+                <p>📙: {unitTitle}</p>
               </>
             ),
           },

src/plugin-slots/UnitTitleSlot/index.jsx

@@ -1,12 +1,13 @@
 import PropTypes from 'prop-types';
 import { PluginSlot } from '@openedx/frontend-plugin-framework';
 
-const UnitTitleSlot = ({ courseId, unitId }) => (
+const UnitTitleSlot = ({ courseId, unitId, unitTitle }) => (
   <PluginSlot
     id="unit_title_slot"
     pluginProps={{
       courseId,
       unitId,
+      unitTitle,
     }}
   />
 );
@@ -14,6 +15,7 @@ const UnitTitleSlot = ({ courseId, unitId }) => (
 UnitTitleSlot.propTypes = {
   courseId: PropTypes.string.isRequired,
   unitId: PropTypes.string.isRequired,
+  unitTitle: PropTypes.string.isRequired,
 };
 
 export default UnitTitleSlot;