aboutsummaryrefslogtreecommitdiffstats
path: root/src/utils/hooks/use-scroll-position/use-scroll-position.ts
diff options
context:
space:
mode:
authorArmand Philippot <git@armandphilippot.com>2023-11-15 16:37:16 +0100
committerArmand Philippot <git@armandphilippot.com>2023-11-15 17:26:17 +0100
commitc826ad66df066b90b09009f2f4b83b56d018436e (patch)
tree6320b85c7a4fdedf8e4384eaca290c02ea2a71e2 /src/utils/hooks/use-scroll-position/use-scroll-position.ts
parent0f38aee374029213a47ef7c29bd164093fe63c85 (diff)
refactor(hooks): rewrite useScrollPosition hook
* return the scroll position (both X and Y) * no longer accepts arguments * add tests
Diffstat (limited to 'src/utils/hooks/use-scroll-position/use-scroll-position.ts')
-rw-r--r--src/utils/hooks/use-scroll-position/use-scroll-position.ts31
1 files changed, 31 insertions, 0 deletions
diff --git a/src/utils/hooks/use-scroll-position/use-scroll-position.ts b/src/utils/hooks/use-scroll-position/use-scroll-position.ts
new file mode 100644
index 0000000..e20fda5
--- /dev/null
+++ b/src/utils/hooks/use-scroll-position/use-scroll-position.ts
@@ -0,0 +1,31 @@
+import { useCallback, useEffect, useState } from 'react';
+
+export type ScrollPosition = {
+ x: number;
+ y: number;
+};
+
+const defaultPosition: ScrollPosition = { x: 0, y: 0 };
+
+/**
+ * React hook to retrieve the current scroll position based on window.
+ *
+ * @returns {ScrollPosition} The scroll position.
+ */
+export const useScrollPosition = (): ScrollPosition => {
+ const [pos, setPos] = useState(defaultPosition);
+
+ const updatePos = useCallback(() => {
+ setPos({ x: window.scrollX, y: window.scrollY });
+ }, []);
+
+ useEffect(() => {
+ if (typeof window === 'undefined') return undefined;
+
+ window.addEventListener('scroll', updatePos);
+
+ return () => window.removeEventListener('scroll', updatePos);
+ }, [updatePos]);
+
+ return pos;
+};