From ed51abc348137b3999c95fcf4668b78440e04c3f Mon Sep 17 00:00:00 2001
From: Roie Natan <roie.natan@gmail.com>
Date: Thu, 30 Nov 2023 20:00:51 -0500
Subject: [PATCH] use useLockedBody in <SplitView />

---
 src/pages/commonFeed/CommonFeedPage.tsx               |  4 ----
 .../FeedLayout/components/SplitView/SplitView.tsx     | 11 ++++++++++-
 2 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/src/pages/commonFeed/CommonFeedPage.tsx b/src/pages/commonFeed/CommonFeedPage.tsx
index ce66a04a23..256c09382e 100644
--- a/src/pages/commonFeed/CommonFeedPage.tsx
+++ b/src/pages/commonFeed/CommonFeedPage.tsx
@@ -4,7 +4,6 @@ import { useParams } from "react-router-dom";
 import { selectUser } from "@/pages/Auth/store/selectors";
 import { InboxItemType } from "@/shared/constants";
 import { MainRoutesProvider } from "@/shared/contexts";
-import { useLockedBody } from "@/shared/hooks";
 import { useLastVisitedCommon } from "@/shared/hooks/useCases";
 import { MultipleSpacesLayoutPageContent } from "@/shared/layouts";
 import {
@@ -59,7 +58,6 @@ const renderContentWrapper: RenderCommonFeedContentWrapper = ({
 
 const CommonFeedPage: FC = () => {
   const { id: commonId } = useParams<CommonFeedPageRouterParams>();
-  const { lockBodyScroll, unlockBodyScroll } = useLockedBody();
   const dispatch = useDispatch();
   const layoutMainWidth = useSelector(selectMultipleSpacesLayoutMainWidth);
   const user = useSelector(selectUser());
@@ -99,9 +97,7 @@ const CommonFeedPage: FC = () => {
   }, [commonId]);
 
   useEffect(() => {
-    lockBodyScroll();
     return () => {
-      unlockBodyScroll();
       dispatch(multipleSpacesLayoutActions.clearBreadcrumbs());
     };
   }, []);
diff --git a/src/pages/commonFeed/components/FeedLayout/components/SplitView/SplitView.tsx b/src/pages/commonFeed/components/FeedLayout/components/SplitView/SplitView.tsx
index ba8e530b8c..144f7aac41 100644
--- a/src/pages/commonFeed/components/FeedLayout/components/SplitView/SplitView.tsx
+++ b/src/pages/commonFeed/components/FeedLayout/components/SplitView/SplitView.tsx
@@ -1,5 +1,6 @@
-import React, { FC } from "react";
+import React, { FC, useEffect } from "react";
 import SplitPane from "react-split-pane";
+import { useLockedBody } from "@/shared/hooks";
 import styles from "./SplitView.module.scss";
 
 interface SplitViewProps {
@@ -14,6 +15,14 @@ interface SplitViewProps {
 const SplitView: FC<SplitViewProps> = (props) => {
   const { className, size, minSize, maxSize, defaultSize, onChange, children } =
     props;
+  const { lockBodyScroll, unlockBodyScroll } = useLockedBody();
+
+  useEffect(() => {
+    lockBodyScroll();
+    return () => {
+      unlockBodyScroll();
+    };
+  }, []);
 
   return (
     <SplitPane