From a8fea0df803a44feb6e7095c19ffb465e40871d4 Mon Sep 17 00:00:00 2001
From: Americo Barros <46950469+americobarros@users.noreply.github.com>
Date: Mon, 5 Dec 2022 22:42:08 -0500
Subject: [PATCH] Fix URL Modal scrolling and size (#2410)

* Change iframe style to block
- this removes the double scrollbar issue that was occurring

* Change and Add default modal sizes
---
 web/components/ui/Modal/Modal.tsx | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/web/components/ui/Modal/Modal.tsx b/web/components/ui/Modal/Modal.tsx
index 0aa4f5feb..ccf3e5074 100644
--- a/web/components/ui/Modal/Modal.tsx
+++ b/web/components/ui/Modal/Modal.tsx
@@ -27,10 +27,17 @@ export const Modal: FC<ModalProps> = ({
 }) => {
   const [loading, setLoading] = useState(!!url);
 
+  let defaultHeight = '100%';
+  let defaultWidth = '520px';
+  if (url) {
+    defaultHeight = '70vh';
+    defaultWidth = '900px';
+  }
+
   const modalStyle = {
     padding: '0px',
     minHeight: height,
-    height: height ?? '100%',
+    height: height ?? defaultHeight,
   };
 
   const iframe = url && (
@@ -42,6 +49,7 @@ export const Modal: FC<ModalProps> = ({
       sandbox="allow-same-origin allow-scripts allow-popups allow-forms"
       frameBorder="0"
       allowFullScreen
+      style={{ display: 'block' }}
       // eslint-disable-next-line react/no-unknown-property
       onLoad={() => setLoading(false)}
     />
@@ -57,7 +65,7 @@ export const Modal: FC<ModalProps> = ({
       onCancel={handleCancel}
       afterClose={afterClose}
       bodyStyle={modalStyle}
-      width={width}
+      width={width ?? defaultWidth}
       zIndex={999}
       footer={null}
       centered