From 0a16f36b8afc23f335c1146d6ea53329f9e27df7 Mon Sep 17 00:00:00 2001
From: Kristóf Marussy <kristof@marussy.com>
Date: Fri, 15 Mar 2024 18:01:48 +0100
Subject: Add landing page sections and update resume

---
 src/components/TrackActiveSection.tsx | 47 +++++++++++++++++++++++++++++++++++
 1 file changed, 47 insertions(+)
 create mode 100644 src/components/TrackActiveSection.tsx

(limited to 'src/components/TrackActiveSection.tsx')

diff --git a/src/components/TrackActiveSection.tsx b/src/components/TrackActiveSection.tsx
new file mode 100644
index 0000000..bb1b2ee
--- /dev/null
+++ b/src/components/TrackActiveSection.tsx
@@ -0,0 +1,47 @@
+/*
+ * SPDX-FileCopyrightText: 2023 Kristóf Marussy
+ *
+ * SPDX-License-Identifier: MIT
+ */
+
+import { type ReactNode, useEffect, useCallback, useRef } from 'react';
+
+import { useActiveSection } from './ActiveSectionProvider';
+
+export default function TrackActiveSection({
+  children,
+}: {
+  children: ReactNode;
+}) {
+  const { setHash } = useActiveSection();
+  const elementRef = useRef<HTMLDivElement | null>(null);
+  const callback = useCallback(() => {
+    const { current: element } = elementRef;
+    if (!element) {
+      return;
+    }
+    const currentID = Array.from(element.children)
+      .reverse()
+      .find((child) => child.getBoundingClientRect().top <= 60)?.id;
+    const currentHash =
+      currentID === undefined || currentID === '' ? '' : `#${currentID}`;
+    setHash(currentHash);
+  }, [setHash]);
+  const setElement = useCallback(
+    (element: HTMLDivElement | null) => {
+      elementRef.current = element;
+      if (element) {
+        callback();
+      } else {
+        setHash(undefined);
+      }
+    },
+    [setHash],
+  );
+  useEffect(() => {
+    window.addEventListener('scroll', callback);
+    return () => window.removeEventListener('scroll', callback);
+  });
+
+  return <div ref={setElement}>{children}</div>;
+}
-- 
cgit v1.2.3-54-g00ecf