feat: add report button component

src/courseware/course/sequence/Sequence.jsx

@@ -9,7 +9,7 @@ import {
 import { useIntl } from '@edx/frontend-platform/i18n';
 import { useSelector } from 'react-redux';
 import SequenceExamWrapper from '@edx/frontend-lib-special-exams';
-import { LikeDislikeUnit } from '@edunext/frontend-essentials';
+import { ReportButton, LikeDislikeUnit } from '@edunext/frontend-essentials';
 
 import PageLoading from '@src/generic/PageLoading';
 import { useModel } from '@src/generic/model-store';
@@ -151,6 +151,7 @@ const Sequence = ({
     <>
       <div className="nelp-container">
         <LikeDislikeUnit courseId={courseId} unitId={unitId} />
+        <ReportButton courseId={courseId} unitId={unitId} />
       </div>
 
       <UnitNavigation

src/courseware/course/sequence/Sequence.scss

@@ -0,0 +1,5 @@
+.nelp-container {
+  display: flex;
+  text-align: center;
+  justify-content: center;
+}

src/courseware/course/sequence/Sequence.test.jsx

@@ -105,7 +105,7 @@ describe('Sequence', () => {
 
     await waitFor(() => expect(screen.queryByText('Loading locked content messaging...')).toBeInTheDocument());
     // `Previous`, `Prerequisite` and `Close Tray` buttons.
-    expect(screen.getAllByRole('button').length).toEqual(5); // two more buttons like and dislike
+    expect(screen.getAllByRole('button').length).toEqual(6); // three more buttons like, dislike and report
     // `Next` button.
     expect(screen.getAllByRole('link').length).toEqual(1);
 
@@ -159,7 +159,7 @@ describe('Sequence', () => {
     render(<SidebarWrapper />, { wrapWithRouter: true });
     expect(await screen.findByText('Loading learning sequence...')).toBeInTheDocument();
     // `Previous`, `Prerequisite` and `Close Tray` buttons.
-    expect(screen.getAllByRole('button')).toHaveLength(5); // two more buttons like and dislike
+    expect(screen.getAllByRole('button')).toHaveLength(6); // three more buttons like, dislike and report
     // Renders `Next` button.
     expect(screen.getAllByRole('link')).toHaveLength(1);
 

src/index.scss

@@ -446,4 +446,5 @@
 @import "course-home/courseware-search/courseware-search.scss";
 @import "course-tabs/course-tabs-navigation.scss";
 @import "courseware/course/sidebar/common/SidebarBase.scss";
-@import "courseware/course/sidebar/sidebars/course-outline/CourseOutlineTray.scss";
+@import "courseware/course/sidebar/sidebars/course-outline/CourseOutlineTray.scss";
+@import "courseware/course/sequence/Sequence.scss";