From 12bf92f679229a591ef33fb15c3f61c88f87256a Mon Sep 17 00:00:00 2001
From: D <8084679-z1su7@users.noreply.gitlab.com>
Date: Mon, 22 Nov 2021 14:57:16 +0100
Subject: [PATCH 1/2] + debounce responsive hooks

---
 package.json |  3 +++
 src/index.ts | 22 ++++++++++++++++++----
 yarn.lock    |  5 +++++
 3 files changed, 26 insertions(+), 4 deletions(-)

diff --git a/package.json b/package.json
index aff4b3c..c078483 100644
--- a/package.json
+++ b/package.json
@@ -64,5 +64,8 @@
     "react-native": "^0.61.5",
     "react-test-renderer": "^16.13.1",
     "typescript": "^3.8.3"
+  },
+  "dependencies": {
+    "lodash": "^4.17.21"
   }
 }
diff --git a/src/index.ts b/src/index.ts
index a0930aa..3815002 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -1,11 +1,25 @@
-import { useState, useEffect, useRef } from "react";
-import { Dimensions, ScaledSize } from "react-native";
+import { useState, useEffect, useRef,useCallback } from "react";
+import {Dimensions, ScaledSize} from "react-native";
+import {debounce} from "lodash"
+
+// declare debounced state functionality
+const useDebouncedState = (initialValue: any, durationInMs = 200) => {
+  const [internalState, setInternalState] = useState(initialValue);
+  const debouncedFunction = useCallback(debounce(setInternalState, durationInMs), [
+    setInternalState,
+    durationInMs
+  ]);
+  return [internalState, debouncedFunction];
+};
+
 
 const useDimensionsListener = () => {
-  const [screenDimension, setScreenDimension] = useState(
+
+  // use debounced state for dimensions
+  const [screenDimension, setScreenDimension] = useDebouncedState(
     Dimensions.get("screen")
   );
-  const [windowDimension, setWindowDimension] = useState(
+  const [windowDimension, setWindowDimension] = useDebouncedState(
     Dimensions.get("window")
   );
 
diff --git a/yarn.lock b/yarn.lock
index d47e8cd..03ba9fe 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -5253,6 +5253,11 @@ lodash@^4.17.10, lodash@^4.17.13, lodash@^4.17.14, lodash@^4.17.15, lodash@^4.17
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.15.tgz#b447f6670a0455bbfeedd11392eff330ea097548"
   integrity sha512-8xOcRHvCjnocdS5cpwXQXVzmmh5e5+saE2QGoeQmbKmRS6J3VQppPOIt0MnmE+4xlZoumy0GPG0D0MVIQbNA1A==
 
+lodash@^4.17.21:
+  version "4.17.21"
+  resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c"
+  integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==
+
 log-symbols@^2.2.0:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/log-symbols/-/log-symbols-2.2.0.tgz#5740e1c5d6f0dfda4ad9323b5332107ef6b4c40a"

From 10417315639165060612be20f81de5913af212ce Mon Sep 17 00:00:00 2001
From: jakob <100858883+ZMH3G@users.noreply.github.com>
Date: Mon, 10 Oct 2022 09:33:14 +0200
Subject: [PATCH 2/2] Update index.ts

---
 src/index.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/index.ts b/src/index.ts
index 3815002..33be716 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -35,9 +35,9 @@ const useDimensionsListener = () => {
       setScreenDimension(screen);
     }
 
-    Dimensions.addEventListener("change", handleDimensionChange);
+    const listener = Dimensions.addEventListener("change", handleDimensionChange);
     return () => {
-      Dimensions.removeEventListener("change", handleDimensionChange);
+      listener.remove();
     };
   }, []);