From c44bb5da795726c1ea58fe91fdbd61e85260e92a Mon Sep 17 00:00:00 2001
From: Shekar Siri <sshekarsiri@gmail.com>
Date: Tue, 28 Jun 2022 14:09:37 +0200
Subject: [PATCH] fix(ui) - disable body scroll on modal open

---
 frontend/app/components/Modal/index.tsx                         | 2 ++
 .../app/components/shared/SessionSettings/SessionSettings.tsx   | 2 +-
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/frontend/app/components/Modal/index.tsx b/frontend/app/components/Modal/index.tsx
index 55d18b6f9..04e2acd91 100644
--- a/frontend/app/components/Modal/index.tsx
+++ b/frontend/app/components/Modal/index.tsx
@@ -26,10 +26,12 @@ export class ModalProvider extends Component {
       props
     });
     document.addEventListener('keydown', this.handleKeyDown);
+    document.querySelector("body").style.overflow = 'hidden';
   };
 
   hideModal = () => {
     document.removeEventListener('keydown', this.handleKeyDown);
+    document.querySelector("body").style.overflow = 'visible';
     const { props } = this.state;
     if (props.onClose) {
       props.onClose();
diff --git a/frontend/app/components/shared/SessionSettings/SessionSettings.tsx b/frontend/app/components/shared/SessionSettings/SessionSettings.tsx
index 680c343b1..0c8fedd37 100644
--- a/frontend/app/components/shared/SessionSettings/SessionSettings.tsx
+++ b/frontend/app/components/shared/SessionSettings/SessionSettings.tsx
@@ -7,7 +7,7 @@ import CaptureRate from './components/CaptureRate';
 
 function SessionSettings() {
     return useObserver(() => (
-        <div className="bg-white box-shadow h-screen" style={{ width: '450px'}}>
+        <div className="bg-white box-shadow h-screen overflow-y-auto" style={{ width: '450px'}}>
             <div className="px-6 pt-6">
                 <h1 className="text-2xl">Sessions Settings</h1>
             </div>