From e7fb9af3cbe649a1fc7e0722655461cda01ca4ed Mon Sep 17 00:00:00 2001
From: hamki <me@hamki.org>
Date: Sun, 28 Dec 2025 15:48:23 +0800
Subject: [PATCH] refactor: enhance TOC position updates with ResizeObserver
 and IntersectionObserver

- Replace window resize and scroll event listeners with a ResizeObserver to monitor changes in the document body.
- Implement an IntersectionObserver for the file header to trigger TOC position updates based on its visibility.
- This improves performance and responsiveness of the TOC sidebar in file views.
---
 web_src/js/features/file-view.ts | 18 ++++++++++++++++--
 1 file changed, 16 insertions(+), 2 deletions(-)

diff --git a/web_src/js/features/file-view.ts b/web_src/js/features/file-view.ts
index 08f5ce35c9..430a6d5ef8 100644
--- a/web_src/js/features/file-view.ts
+++ b/web_src/js/features/file-view.ts
@@ -142,8 +142,22 @@ function initTocToggle(elFileView: HTMLElement): void {
   }
 
   // Update TOC position on resize/scroll to keep aligned with file content
-  window.addEventListener('resize', updatePosition);
-  window.addEventListener('scroll', updatePosition);
+  const resizeObserver = new ResizeObserver(() => {
+    updatePosition();
+  });
+  resizeObserver.observe(document.body);
+
+  const fileHeader = elFileView.querySelector('.file-header');
+  if (fileHeader) {
+    const intersectionObserver = new IntersectionObserver(() => {
+      updatePosition();
+    }, {
+      root: null,
+      rootMargin: '0px',
+      threshold: [0, 0.25, 0.5, 0.75, 1.0],
+    });
+    intersectionObserver.observe(fileHeader);
+  }
 
   toggleBtn.addEventListener('click', () => {
     const isCurrentlyVisible = !tocSidebar.classList.contains('toc-panel-hidden');