aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorGravatar Joe Banks <[email protected]>2024-09-11 17:05:14 +0100
committerGravatar Joe Banks <[email protected]>2024-09-11 17:05:14 +0100
commit298b27bf8c6b350f1b9ba150beab24598a706f52 (patch)
tree4c31cc3a9bb85bbe2474a240504a3c612464e967
parentDisplay cart status on the store page (diff)
Add hook for visibility detection
-rw-r--r--thallium-frontend/src/utils/hooks.ts15
1 files changed, 15 insertions, 0 deletions
diff --git a/thallium-frontend/src/utils/hooks.ts b/thallium-frontend/src/utils/hooks.ts
new file mode 100644
index 0000000..9b478f7
--- /dev/null
+++ b/thallium-frontend/src/utils/hooks.ts
@@ -0,0 +1,15 @@
+import { useMemo, useState, useEffect } from "react";
+
+export function useVisible(ref: RefObject<HTMLElement>) {
+ const [isVisible, setVisible] = useState(false)
+
+ useEffect(() => {
+ const observer = new IntersectionObserver(
+ ([entry]) => setVisible(entry.isIntersecting)
+ )
+ observer.observe(ref.current)
+ return () => observer.disconnect()
+ }, [])
+
+ return isVisible
+}