fix: fix conflicts

src/courseware/course/sequence/Unit.jsx

@@ -3,7 +3,7 @@ import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
 import { logError } from '@edx/frontend-platform/logging';
 import { AppContext, ErrorPage } from '@edx/frontend-platform/react';
 import { getExamAccess, fetchExamAccess, isExam } from '@edx/frontend-lib-special-exams';
-import { Modal } from '@edx/paragon';
+import { ModalDialog, ActionRow } from '@edx/paragon';
 import PropTypes from 'prop-types';
 import React, {
   Suspense, useCallback, useContext, useEffect, useLayoutEffect, useState,
@@ -107,6 +107,7 @@ const Unit = ({
   const [modalOptions, setModalOptions] = useState({ open: false });
   const [shouldDisplayHonorCode, setShouldDisplayHonorCode] = useState(false);
   const [examAccessToken, setExamAccessToken] = useState('');
+  // eslint-disable-next-line no-unused-vars
   const [blockExamAccess, setBlockExamAccess] = useState(isExam());
 
   const unit = useModel('units', id);
@@ -200,7 +201,7 @@ const Unit = ({
           <HonorCode courseId={courseId} />
         </Suspense>
       )}
-      {(!shouldDisplayHonorCode || blockExamAccess) && !hasLoaded && !showError && (
+      {!shouldDisplayHonorCode && !hasLoaded && !showError && (
         <PageLoading
           srMessage={intl.formatMessage(messages.loadingSequence)}
         />
@@ -209,31 +210,47 @@ const Unit = ({
         <ErrorPage />
       )}
       {modalOptions.open && (
-        <Modal
-          body={(
+        <ModalDialog
+          title="My dialog"
+          isOpen
+          onClose={() => { setModalOptions({ open: false }); }}
+          isFullscreenOnMobile
+          // size="xl"
+          className="modal-lti"
+          hasCloseButton
+        >
+          <ModalDialog.Body>
             <>
               {modalOptions.body
-                ? <div className="unit-modal">{ modalOptions.body }</div>
+                ? <div className="unit-modal">{modalOptions.body}</div>
                 : (
-                  <iframe
-                    title={modalOptions.title}
-                    allow={IFRAME_FEATURE_POLICY}
-                    frameBorder="0"
-                    src={modalOptions.url}
-                    style={{
-                      width: '100%',
-                      height: '100vh',
-                    }}
-                  />
+                  <>
+                    <iframe
+                      title={modalOptions.title}
+                      allow={IFRAME_FEATURE_POLICY}
+                      frameBorder="0"
+                      src={modalOptions.url}
+                      style={{
+                        width: '100%',
+                        height: '100vh',
+                      }}
+                    />
+                  </>
                 )}
             </>
-          )}
-          onClose={() => { setModalOptions({ open: false }); }}
-          open
-          dialogClassName="modal-lti"
-        />
+          </ModalDialog.Body>
+
+          <ModalDialog.Footer>
+            <ActionRow>
+              <ModalDialog.CloseButton variant="primary">
+                Close
+              </ModalDialog.CloseButton>
+            </ActionRow>
+          </ModalDialog.Footer>
+        </ModalDialog>
+
       )}
-      {!shouldDisplayHonorCode && !blockExamAccess && (
+      {!shouldDisplayHonorCode && (
         <div className="unit-iframe-wrapper">
           <iframe
             id="unit-iframe"