refactor: add typescript support to project

src/common/component/Message/useInView.ts

@@ -0,0 +1,32 @@
+import { useRef, useEffect } from "react";
+
+export default function useInView<T extends HTMLElement>() {
+  const ref = useRef<T>(null);
+  const observer = new IntersectionObserver(
+    (entries) => {
+      entries.forEach((entry) => {
+        const intersecting = entry.isIntersecting;
+        const currEle = entry.target;
+        if (intersecting) {
+          currEle.classList.add("in_view");
+        } else {
+          currEle.classList.remove("in_view");
+        }
+      });
+    },
+    { threshold: 0 }
+  );
+  useEffect(() => {
+    const currEle = ref.current;
+    if (currEle) {
+      observer.observe(ref.current);
+    }
+    return () => {
+      if (currEle) {
+        observer.unobserve(currEle);
+      }
+    };
+  }, [ref]);
+
+  return ref;
+}