fix: vertical scrolling after opening the Mobile paring modal (#1295)

* chore: fix vertical scrolling after opening the Mobile paring modal

* cheking CLA

* alternative fix: make Dialog a controlled component

Co-authored-by: katspaugh <381895+katspaugh@users.noreply.github.com>

src/services/pairing/QRModal.tsx

@@ -1,7 +1,7 @@
+import { useState } from 'react'
 import { Dialog, DialogContent, DialogTitle, IconButton } from '@mui/material'
 import { createRoot } from 'react-dom/client'
 import CloseIcon from '@mui/icons-material/Close'
-
 import PairingQRCode from '@/components/common/PairingDetails/PairingQRCode'
 import PairingDescription from '@/components/common/PairingDetails/PairingDescription'
 import { StoreHydrator } from '@/store'
@@ -49,15 +49,18 @@ const close = () => {
 }
 
 const Modal = ({ uri, cb }: { uri: string; cb: () => void }) => {
+  const [open, setOpen] = useState(true)
+
   const handleClose = () => {
     cb()
+    setOpen(false)
     close()
   }
 
   return (
     <StoreHydrator>
       <AppProviders>
-        <Dialog open onClose={handleClose} disablePortal className={css.modal}>
+        <Dialog open={open} onClose={handleClose} disablePortal className={css.modal}>
           <DialogTitle sx={{ m: 0, p: 2, display: 'flex', justifyContent: 'space-between' }}>
             {PAIRING_MODULE_LABEL}
             <IconButton