diff --git a/src/hooks/useScrollLock/index.ts b/src/hooks/useScrollLock/index.ts
index 04538dd..75f7523 100644
--- a/src/hooks/useScrollLock/index.ts
+++ b/src/hooks/useScrollLock/index.ts
@@ -1,17 +1,27 @@
-import { useEffect, useState } from "react";
+import { useCallback, useEffect, useState } from 'react';
 
-export const useScrollLock = (on: boolean) => {
-    useEffect(() => {
-        const body = window.document.getElementsByTagName("body")[0];
-        if (on) {
-            body && (body.style.overflow = "hidden");
-        } else {
-            body && (body.style.overflow = "scroll");
-        }
-        return () => {
-            body && (body.style.overflow = "scroll");
-        };
-    }, [on]);
+export const useScrollLock: (initialFlag?: boolean) => [boolean, () => void] = (
+  initialFlag = false
+) => {
+  const [flag, setFlag] = useState<boolean>(initialFlag);
+
+  const toggleFlag = useCallback(() => {
+    setFlag(prevFlag => !prevFlag);
+  }, []);
+
+  useEffect(() => {
+    const body = window.document.getElementsByTagName('body')[0];
+    if (flag) {
+      body.style.overflow = 'hidden';
+    } else {
+      body.style.overflow = 'scroll';
+    }
+    return () => {
+      body.style.overflow = 'scroll';
+    };
+  }, [flag]);
+
+  return [flag, toggleFlag];
 };
 
 export default useScrollLock;