From 01554e98cd60736f0a0866e8c2995f52184ffb1b Mon Sep 17 00:00:00 2001
From: hamki <me@hamki.org>
Date: Fri, 16 Jan 2026 05:15:29 +0800
Subject: [PATCH] refactor: replace scroll event with IntersectionObserver for
 sidebar position updates

- Utilize IntersectionObserver to enhance performance and avoid issues associated with scroll events.
- Implement fine-grained position updates using multiple thresholds for better responsiveness during scrolling.
---
 web_src/js/features/file-view.ts | 20 ++++++++++++--------
 1 file changed, 12 insertions(+), 8 deletions(-)

diff --git a/web_src/js/features/file-view.ts b/web_src/js/features/file-view.ts
index dd1f8e3cde..de1d00e49c 100644
--- a/web_src/js/features/file-view.ts
+++ b/web_src/js/features/file-view.ts
@@ -165,15 +165,19 @@ function initSidebarToggle(elFileView: HTMLElement): void {
   });
   resizeObserver.observe(document.body);
 
-  // Update position on scroll - use requestAnimationFrame for smooth updates
-  let scrollRafId: number | null = null;
-  window.addEventListener('scroll', () => {
-    if (scrollRafId !== null) return; // Already scheduled
-    scrollRafId = requestAnimationFrame(() => {
+  // Update position using IntersectionObserver instead of scroll event
+  // This provides better performance and avoids scroll event issues
+  const fileHeader = elFileView.querySelector('.file-header');
+  const segment = elFileView.querySelector('.ui.bottom.segment');
+  if (fileHeader && segment) {
+    // Use many thresholds to get fine-grained position updates during scroll
+    const thresholds = Array.from({length: 101}, (_, i) => i / 100);
+    const positionObserver = new IntersectionObserver(() => {
       updatePosition();
-      scrollRafId = null;
-    });
-  }, {passive: true});
+    }, {threshold: thresholds});
+    positionObserver.observe(segment);
+    positionObserver.observe(fileHeader);
+  }
 
   toggleBtn.addEventListener('click', () => {
     const isCurrentlyVisible = !sidebar.classList.contains('sidebar-panel-hidden');