refactor: replace deprecated paragon components

eduNEXT · Apr 11, 2024 · 7262756 · 7262756
1 parent 0f59529
commit 7262756
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 17 deletions.
diff --git a/src/courseware/course/sequence/Unit/ContentIFrame.jsx b/src/courseware/course/sequence/Unit/ContentIFrame.jsx
@@ -3,7 +3,7 @@ import React from 'react';
 
 import { ErrorPage } from '@edx/frontend-platform/react';
 import { StrictDict } from '@edx/react-unit-test-utils';
-import { Modal } from '@edx/paragon';
+import { ModalDialog } from '@edx/paragon';
 
 import PageLoading from '../../../../generic/PageLoading';
 import * as hooks from './hooks';
@@ -75,22 +75,25 @@ const ContentIFrame = ({
         </div>
       )}
       {modalOptions.isOpen && (
-        <Modal
-          body={modalOptions.body
-            ? <div className="unit-modal">{ modalOptions.body }</div>
-            : (
-              <iframe
-                title={modalOptions.title}
-                allow={IFRAME_FEATURE_POLICY}
-                frameBorder="0"
-                src={modalOptions.url}
-                style={{ width: '100%', height: modalOptions.height }}
-              />
-            )}
+        <ModalDialog
           dialogClassName="modal-lti"
           onClose={handleModalClose}
-          open
-        />
+          isOpen
+        >
+          <ModalDialog.Body>
+            {modalOptions.body
+              ? <div className="unit-modal">{ modalOptions.body }</div>
+              : (
+                <iframe
+                  title={modalOptions.title}
+                  allow={IFRAME_FEATURE_POLICY}
+                  frameBorder="0"
+                  src={modalOptions.url}
+                  style={{ width: '100%', height: modalOptions.height }}
+                />
+              )}
+          </ModalDialog.Body>
+        </ModalDialog>
       )}
     </>
   );

diff --git a/src/instructor-toolbar/masquerade-widget/MasqueradeUserNameInput.jsx b/src/instructor-toolbar/masquerade-widget/MasqueradeUserNameInput.jsx
@@ -3,7 +3,7 @@ import React, {
 } from 'react';
 import PropTypes from 'prop-types';
 import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
-import { Input } from '@edx/paragon';
+import { Form } from '@edx/paragon';
 
 import messages from './messages';
 
@@ -46,7 +46,7 @@ class MasqueradeUserNameInput extends Component {
       ...rest
     } = this.props;
     return (
-      <Input
+      <Form.Control
         aria-labelledby="masquerade-search-label"
         label={intl.formatMessage(messages.userNameLabel)}
         onKeyPress={(event) => this.onKeyPress(event)}