fix: Fixed issue where some dialogs would become unresponsive

packages/web/src/javascripts/Components/AlertDialog/AlertDialog.tsx

@@ -14,7 +14,14 @@ const AlertDialog = ({
   })
 
   return (
-    <Dialog store={dialog} role="alertdialog" className="fixed top-0 left-0 z-modal h-full w-full">
+    <Dialog
+      store={dialog}
+      role="alertdialog"
+      className="fixed top-0 left-0 z-modal h-full w-full"
+      modal={false}
+      portal={true}
+      preventBodyScroll={true}
+    >
       <div
         className="absolute z-0 h-full w-full bg-passive-5 opacity-25 md:opacity-75"
         role="presentation"

packages/web/src/javascripts/Components/Modal/ModalOverlay.tsx

@@ -32,11 +32,9 @@ const ModalOverlay = forwardRef(
         className="fixed top-0 left-0 z-modal h-full w-full"
         ref={mergeRefs([setElement, ref])}
         store={dialog}
-        getPersistentElements={() =>
+        modal={false}
-          Array.from(document.querySelectorAll('[role="dialog"], [role="alertdialog"]')).map((el) => {
+        portal={true}
-            return el.parentElement ? el.parentElement : el
+        preventBodyScroll={true}
-          })
-        }
         {...props}
       >
         {children}