From 379ef7cc1133822e2353ff8c3cfbcdb341c8a7b5 Mon Sep 17 00:00:00 2001
From: Lim Chee Aun <cheeaun@gmail.com>
Date: Sun, 28 Jul 2024 16:09:44 +0800
Subject: [PATCH] Random unused IntersectionView

Keeping this for future use
---
 src/components/intersection-view.jsx | 29 ++++++++++++++++++++++++++++
 1 file changed, 29 insertions(+)
 create mode 100644 src/components/intersection-view.jsx

diff --git a/src/components/intersection-view.jsx b/src/components/intersection-view.jsx
new file mode 100644
index 00000000..0763e6b9
--- /dev/null
+++ b/src/components/intersection-view.jsx
@@ -0,0 +1,29 @@
+import { useLayoutEffect, useRef, useState } from 'preact/hooks';
+
+const IntersectionView = ({ children, root = null, fallback = null }) => {
+  const ref = useRef();
+  const [show, setShow] = useState(false);
+  useLayoutEffect(() => {
+    const observer = new IntersectionObserver(
+      (entries) => {
+        const entry = entries[0];
+        if (entry.isIntersecting) {
+          setShow(true);
+          observer.unobserve(ref.current);
+        }
+      },
+      {
+        root,
+        rootMargin: `${screen.height}px`,
+      },
+    );
+    if (ref.current) observer.observe(ref.current);
+    return () => {
+      if (ref.current) observer.unobserve(ref.current);
+    };
+  }, []);
+
+  return show ? children : <div ref={ref}>{fallback}</div>;
+};
+
+export default IntersectionView;