From 7037c0e3ab84d748776e89ba4f41d39898321c78 Mon Sep 17 00:00:00 2001
From: Aaron Pham <contact@aarnphm.xyz>
Date: Sat, 18 Jan 2025 17:09:20 -0500
Subject: [PATCH] fix(popover): handle same page resolution

Signed-off-by: Aaron Pham <contact@aarnphm.xyz>
---
 quartz/components/scripts/popover.inline.ts | 33 ++++++++++++++++++++-
 1 file changed, 32 insertions(+), 1 deletion(-)

diff --git a/quartz/components/scripts/popover.inline.ts b/quartz/components/scripts/popover.inline.ts
index b01af0e85..b37263e71 100644
--- a/quartz/components/scripts/popover.inline.ts
+++ b/quartz/components/scripts/popover.inline.ts
@@ -38,6 +38,11 @@ async function mouseEnterHandler(
   targetUrl.hash = ""
   targetUrl.search = ""
 
+  // If it's the same page, just return without fetching
+  if (thisUrl.toString() === targetUrl.toString()) {
+    return
+  }
+
   const response = await fetchCanonical(targetUrl).catch((err) => {
     console.error(err)
   })
@@ -100,10 +105,36 @@ async function mouseEnterHandler(
   }
 }
 
+function handleSamePageClick(evt: MouseEvent) {
+  const link = evt.currentTarget as HTMLAnchorElement
+  const thisUrl = new URL(document.location.href)
+  thisUrl.hash = ""
+  thisUrl.search = ""
+  const targetUrl = new URL(link.href)
+  const hash = decodeURIComponent(targetUrl.hash)
+  targetUrl.hash = ""
+  targetUrl.search = ""
+
+  if (thisUrl.toString() === targetUrl.toString() && hash !== "") {
+    evt.preventDefault()
+    const mainContent = document.querySelector("article")
+    const heading = mainContent?.querySelector(hash) as HTMLElement | null
+    if (heading) {
+      heading.scrollIntoView({ behavior: "smooth" })
+      // Optionally update the URL without a page reload
+      history.pushState(null, "", hash)
+    }
+  }
+}
+
 document.addEventListener("nav", () => {
   const links = [...document.getElementsByClassName("internal")] as HTMLAnchorElement[]
   for (const link of links) {
     link.addEventListener("mouseenter", mouseEnterHandler)
-    window.addCleanup(() => link.removeEventListener("mouseenter", mouseEnterHandler))
+    link.addEventListener("click", handleSamePageClick)
+    window.addCleanup(() => {
+      link.removeEventListener("mouseenter", mouseEnterHandler)
+      link.removeEventListener("click", handleSamePageClick)
+    })
   }
 })