From 65bc186cb211bf8be2ae68bd88bab0195b25da90 Mon Sep 17 00:00:00 2001
From: Mashal Malik <107556986+Mashal-m@users.noreply.github.com>
Date: Fri, 5 May 2023 11:39:22 +0500
Subject: [PATCH] refactor: migrate off modal paragon deprecated component
 (#71)

* refactor: migrate off modal paragon deprecated component

* refactor: fixed ModalDialog body uppercase

* refactor: change button tag
---
 .../proctored_exam/WarningModal.jsx           | 38 +++++++++++--------
 1 file changed, 22 insertions(+), 16 deletions(-)

diff --git a/src/instructions/proctored_exam/WarningModal.jsx b/src/instructions/proctored_exam/WarningModal.jsx
index d8c6678e..f946e692 100644
--- a/src/instructions/proctored_exam/WarningModal.jsx
+++ b/src/instructions/proctored_exam/WarningModal.jsx
@@ -1,25 +1,31 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { Button, Modal } from '@edx/paragon';
+import { ActionRow, ModalDialog, Button } from '@edx/paragon';
 
 const WarningModal = ({
   isOpen, handleClose, title, body,
 }) => (
-  <Modal
-    title={title}
-    open={isOpen}
-    onClose={() => {}}
-    renderDefaultCloseButton={false}
-    renderHeaderCloseButton={false}
-    buttons={[
-      <Button variant="tertiary" onClick={handleClose}>Ok</Button>,
-    ]}
-    body={(
-      <p>
-        {body}
-      </p>
-    )}
-  />
+  <ModalDialog
+    isOpen={isOpen}
+    hasCloseButton={false}
+  >
+
+    <ModalDialog.Header>
+      <ModalDialog.Title>
+        {title}
+      </ModalDialog.Title>
+    </ModalDialog.Header>
+    <ModalDialog.Body>
+      {body}
+    </ModalDialog.Body>
+    <ModalDialog.Footer>
+      <ActionRow>
+        <Button onClick={handleClose} variant="tertiary">
+          Ok
+        </Button>
+      </ActionRow>
+    </ModalDialog.Footer>
+  </ModalDialog>
 );
 
 WarningModal.propTypes = {