From 52ffa355d1398fdd79dc2c25df5b5022b4cdd0b4 Mon Sep 17 00:00:00 2001
From: Shinpei <react-native@kakao.com>
Date: Wed, 22 Apr 2020 00:15:59 +0900
Subject: [PATCH] at now, consumer can use scrollLock to toggle

---
 src/hooks/useScrollLock/index.ts | 36 ++++++++++++++++++++------------
 1 file changed, 23 insertions(+), 13 deletions(-)

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;