From f43309377791b0eb6a59972ae90b30d8cd3f48b9 Mon Sep 17 00:00:00 2001
From: Jannis Braun <151788261+TheZwiss@users.noreply.github.com>
Date: Wed, 25 Mar 2026 04:50:24 +0100
Subject: [PATCH] fix: remove 150px threshold from scroll observers
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The dist < 150 check caused the ResizeObserver and media load
listener to miss large layout shifts (e.g., GIF loading adding
400+ px of height). The isAtBottomRef gate already determines
whether to auto-scroll — the pixel threshold is redundant.
---
 .../web/src/components/chat/MessageList.tsx     | 17 ++++-------------
 1 file changed, 4 insertions(+), 13 deletions(-)

diff --git a/packages/web/src/components/chat/MessageList.tsx b/packages/web/src/components/chat/MessageList.tsx
index 4ee20531..e985f6f6 100644
--- a/packages/web/src/components/chat/MessageList.tsx
+++ b/packages/web/src/components/chat/MessageList.tsx
@@ -170,14 +170,8 @@ export function MessageList({ channelId, jumpToMessageId, onJumpComplete }: Mess
 
     const observer = new ResizeObserver(() => {
       const c = containerRef.current;
-      if (!c) return;
-      // Use a tight threshold (150px) checked at fire time instead of the
-      // generous 5000px isNearBottomRef — prevents snapping the user back
-      // to bottom during momentum/inertial scrolling on mobile.
-      const dist = c.scrollHeight - c.scrollTop - c.clientHeight;
-      if (isAtBottomRef.current && dist < 150) {
-        c.scrollTop = c.scrollHeight;
-      }
+      if (!c || !isAtBottomRef.current) return;
+      c.scrollTop = c.scrollHeight;
     });
     observer.observe(content);
     return () => observer.disconnect();
@@ -192,11 +186,8 @@ export function MessageList({ channelId, jumpToMessageId, onJumpComplete }: Mess
 
     const handleMediaLoad = () => {
       const c = containerRef.current;
-      if (!c) return;
-      const dist = c.scrollHeight - c.scrollTop - c.clientHeight;
-      if (isAtBottomRef.current && dist < 150) {
-        c.scrollTop = c.scrollHeight;
-      }
+      if (!c || !isAtBottomRef.current) return;
+      c.scrollTop = c.scrollHeight;
     };
 
     content.addEventListener('load', handleMediaLoad, true);