[READ-ONLY] Mirror of https://github.com/improsocial/impro
An extensible Bluesky client for web
impro.social
Update home tab scroll logic
Grace Kind
(May 31, 2026, 12:00 AM -0500)
2821cdae
a6da0264
+32
-20
+1
-1
package.json
+1
-1
package.json
+31
-19
src/js/views/home.view.js
+31
-19
src/js/views/home.view.js
···
147
147
feedScrollState.set(currentFeedUri, window.scrollY);
148
148
// Switch feed
149
149
$currentFeedUri.set(feedUri);
150
-
scrollActiveTabIntoView({ behavior: "smooth" });
151
-
// Scroll to saved scroll state
152
-
if (feedScrollState.has(feedUri)) {
153
-
window.scrollTo(0, feedScrollState.get(feedUri));
154
-
} else {
155
-
window.scrollTo(0, 0);
156
-
}
150
+
// Scroll to saved position for new feed
151
+
const savedScrollY = feedScrollState.get(feedUri) ?? 0;
152
+
requestAnimationFrame(() => {
153
+
window.scrollTo(0, savedScrollY);
154
+
});
157
155
if (!dataLayer.hasCachedFeed(feedUri)) {
158
156
await loadCurrentFeed();
159
157
}
···
276
274
});
277
275
});
278
276
277
+
let isFirstTabScroll = true;
278
+
279
+
// Scroll to active tab when current feed uri changes
280
+
pageEffect(root, () => {
281
+
const feedGenerators =
282
+
dataLayer.derived.$hydratedPinnedFeedGenerators.get();
283
+
if (!feedGenerators) return;
284
+
$currentFeedUri.get();
285
+
const behavior = isFirstTabScroll ? "instant" : "smooth";
286
+
isFirstTabScroll = false;
287
+
requestAnimationFrame(() => {
288
+
const container = root.querySelector(
289
+
".tab-bar-horizontal-scroll-container",
290
+
);
291
+
const activeTabButton = container?.querySelector(
292
+
".tab-bar-button.active",
293
+
);
294
+
if (activeTabButton) {
295
+
activeTabButton.scrollIntoView({
296
+
behavior,
297
+
block: "nearest",
298
+
});
299
+
}
300
+
});
301
+
});
302
+
279
303
async function loadCurrentFeed({ reload = false } = {}) {
280
304
const currentFeedUri = $currentFeedUri.get();
281
305
await dataLayer.requests.loadNextFeedPage(currentFeedUri, {
···
296
320
}
297
321
}
298
322
299
-
function scrollActiveTabIntoView({ behavior = "instant" } = {}) {
300
-
const activeTabButton = document.querySelector(".tab-bar-button.active");
301
-
if (activeTabButton) {
302
-
activeTabButton.scrollIntoView({
303
-
behavior,
304
-
block: "nearest",
305
-
// inline: "center",
306
-
});
307
-
}
308
-
}
309
-
310
323
root.addEventListener("page-enter", async () => {
311
324
window.scrollTo(0, 0);
312
325
const currentFeedUri = $currentFeedUri.get();
···
322
335
323
336
preloadHiddenFeeds(pinnedFeedGenerators);
324
337
initializePostSeenObservers(pinnedFeedGenerators);
325
-
scrollActiveTabIntoView();
326
338
window.scrollTo(0, 0);
327
339
});
328
340