feat: added alert for successful unit movement

src/course-unit/CourseUnit.jsx

@@ -1,15 +1,15 @@
-import { useEffect, useMemo, useState } from 'react';
+import React, { useEffect, useMemo, useState } from 'react';
 import PropTypes from 'prop-types';
 import { useSelector } from 'react-redux';
 import { useParams } from 'react-router-dom';
 import {
-  Container, Layout, Stack, Button,
+  Container, Layout, Stack, Button, TransitionReplace,
 } from '@openedx/paragon';
 import { useIntl, injectIntl } from '@edx/frontend-platform/i18n';
 import {
   Warning as WarningIcon,
   ArrowDropDown as ArrowDownIcon,
-  ArrowDropUp as ArrowUpIcon,
+  ArrowDropUp as ArrowUpIcon, CheckCircle,
 } from '@openedx/paragon/icons';
 import { DraggableList } from '@edx/frontend-lib-content-components';
 import { SortableContext, verticalListSortingStrategy } from '@dnd-kit/sortable';
@@ -111,6 +111,25 @@ const CourseUnit = ({ courseId }) => {
     <>
       <Container size="xl" className="course-unit px-4">
         <section className="course-unit-container mb-4 mt-5">
+          <TransitionReplace>
+            {true ? (
+              <AlertMessage
+                key="TEST"
+                show={true}
+                variant="success"
+                icon={CheckCircle}
+                title="Success! 'Discussion' has been moved."
+                aria-hidden="true"
+                aria-labelledby="TEST"
+                aria-describedby="TEST"
+                dismissible
+                actions={[
+                  <Button>Undo move</Button>,
+                ]}
+                onClose={(e) => { console.log('closed', e); }}
+              />
+            ) : null}
+          </TransitionReplace>
           <SubHeader
             hideBorder
             title={(