From c532e7809351ae3ac1ff13622c69c6026d062537 Mon Sep 17 00:00:00 2001
From: Truong Vo <41848815+vmtruong301296@users.noreply.github.com>
Date: Tue, 2 Dec 2025 09:08:58 +0700
Subject: [PATCH] fix

---
 FRONTEND/src/components/ModalHistory.tsx | 21 ++++++++++++++++-----
 1 file changed, 16 insertions(+), 5 deletions(-)

diff --git a/FRONTEND/src/components/ModalHistory.tsx b/FRONTEND/src/components/ModalHistory.tsx
index 963f87f..efe4a8e 100644
--- a/FRONTEND/src/components/ModalHistory.tsx
+++ b/FRONTEND/src/components/ModalHistory.tsx
@@ -201,14 +201,25 @@ function ModalHistory({
   const scrollToStation = (stationId: number) => {
     // Try to scroll to content first (line group đầu tiên hoặc message)
     const contentElement = stationContentRefs.current.get(stationId);
+    const stationHeader = stationRefs.current.get(stationId);
+    
     if (contentElement && scrollViewportRef.current) {
       const scrollContainer = scrollViewportRef.current;
-      const containerTop = scrollContainer.getBoundingClientRect().top;
-      const elementTop = contentElement.getBoundingClientRect().top;
-      const scrollTop = scrollContainer.scrollTop;
+      const containerRect = scrollContainer.getBoundingClientRect();
+      const contentRect = contentElement.getBoundingClientRect();
+      const currentScrollTop = scrollContainer.scrollTop;
+      
+      // Tính toán vị trí scroll để content nằm ngay dưới sticky header
+      // Sticky header có position: sticky, top: 0, nên luôn ở top của viewport
+      const headerHeight = stationHeader ? stationHeader.offsetHeight : 0;
+      
+      // Scroll đến vị trí sao cho content nằm ngay dưới sticky header
+      // contentRect.top - containerRect.top là khoảng cách từ content đến top của container
+      // Trừ đi headerHeight để content nằm ngay dưới header
+      const targetScrollTop = currentScrollTop + (contentRect.top - containerRect.top) - headerHeight;
       
       scrollContainer.scrollTo({
-        top: scrollTop + elementTop - containerTop - 10, // 10px offset from top
+        top: Math.max(0, targetScrollTop),
         behavior: "smooth",
       });
       return;
@@ -223,7 +234,7 @@ function ModalHistory({
       const scrollTop = scrollContainer.scrollTop;
       
       scrollContainer.scrollTo({
-        top: scrollTop + elementTop - containerTop - 10, // 10px offset from top
+        top: scrollTop + elementTop - containerTop,
         behavior: "smooth",
       });
     }