modal animation

src/components/Layout.tsx

@@ -1,14 +1,24 @@
 import { Outlet } from "react-router-dom";
 import useStore from "../store/store";
+import { FullScreen, useFullScreenHandle } from "react-full-screen";
+import { useEffect } from "react";
+import { ModalContainer } from "./ModalContainer";
 
 const Layout = () => {
-  const { modal, loader } = useStore();
+  const { loader, setOnFullscreen } = useStore();
+  const onFullscreenHandle = useFullScreenHandle();
+
+  useEffect(() => {
+    setOnFullscreen(onFullscreenHandle);
+  }, []);
+
   return (
-    <>
-      {modal}
+    <FullScreen handle={onFullscreenHandle}>
+      {/* {modal} */}
       {loader}
       <Outlet />
-    </>
+      <ModalContainer />
+    </FullScreen>
   );
 };