changes + improvements

layouts/MainLayout.tsx

@@ -1,11 +1,12 @@
 import Navbar from "@/components/Navbar";
 import Sidebar from "@/components/Sidebar";
-import { ReactNode } from "react";
+import { ReactNode, useEffect } from "react";
 import { useSession } from "next-auth/react";
 import Loader from "../components/Loader";
 import useRedirect from "@/hooks/useRedirect";
 import { useRouter } from "next/router";
 import ModalManagement from "@/components/ModalManagement";
+import useModalStore from "@/store/modals";
 
 interface Props {
   children: ReactNode;
@@ -16,6 +17,13 @@ export default function MainLayout({ children }: Props) {
   const router = useRouter();
   const redirect = useRedirect();
   const routeExists = router.route === "/_error" ? false : true;
+  const { modal } = useModalStore();
+
+  useEffect(() => {
+    modal
+      ? (document.body.style.overflow = "hidden")
+      : (document.body.style.overflow = "auto");
+  }, [modal]);
 
   if (status === "authenticated" && !redirect && routeExists)
     return (