[READ-ONLY] Mirror of https://github.com/improsocial/impro
An extensible Bluesky client for web
impro.social
Pin chat scroll to bottom
Grace Kind
(Jun 26, 2026, 3:49 PM -0500)
89e3d741
63e00e4e
+28
-4
+1
-1
package.json
+1
-1
package.json
+27
-3
src/js/views/chatDetail.view.js
+27
-3
src/js/views/chatDetail.view.js
···
111
111
scroller.scrollTop = scroller.scrollHeight;
112
112
}
113
113
114
+
// Scroll to bottom, rescrolling on resize events
115
+
function pinScrollToBottom({ durationMs = 1000 } = {}) {
116
+
const scroller = getMessageScroller();
117
+
if (!scroller) {
118
+
return;
119
+
}
120
+
scroller.scrollTop = scroller.scrollHeight;
121
+
const messageList = scroller.querySelector(".message-list");
122
+
if (!messageList || typeof ResizeObserver === "undefined") {
123
+
return;
124
+
}
125
+
const observer = new ResizeObserver(() => {
126
+
scroller.scrollTop = scroller.scrollHeight;
127
+
});
128
+
observer.observe(messageList);
129
+
observer.observe(scroller);
130
+
const stop = () => observer.disconnect();
131
+
scroller.addEventListener("touchmove", stop, {
132
+
once: true,
133
+
passive: true,
134
+
});
135
+
scroller.addEventListener("wheel", stop, { once: true, passive: true });
136
+
setTimeout(stop, durationMs);
137
+
}
138
+
114
139
function isScrolledToBottom() {
115
140
const scroller = getMessageScroller();
116
141
if (!scroller) {
117
142
return false;
118
143
}
119
-
// 10px threshold
120
144
return (
121
-
scroller.scrollHeight - scroller.scrollTop - scroller.clientHeight <= 10
145
+
scroller.scrollHeight - scroller.scrollTop - scroller.clientHeight <= 60
122
146
);
123
147
}
124
148
···
1151
1175
initialLoad = false;
1152
1176
newestMessageId = latestMessageId;
1153
1177
requestAnimationFrame(() => {
1154
-
scrollToBottom({ onlyIfNeeded: true });
1178
+
pinScrollToBottom();
1155
1179
// Only enable loading after scroll, otherwise the infinite scroll container will start loading immediately
1156
1180
state.$loadingEnabled.set(true);
1157
1181
});