feat: add scroll state persistence to RantFeed with per-page state keys
Implement saveScrollState, restoreScrollState, and clearScrollState methods in RantFeed component, storing anchor rant ID and scroll offset per page. Wire up initFeed calls in CollabsPage, HomePage, StoriesPage, WeeklyPage, and SearchPage to set unique state keys (feed_state_collabs, feed_state_home, etc.) enabling seamless scroll restoration on navigation back.
This commit is contained in:
@@ -10,6 +10,7 @@ import { BaseComponent } from '../components/base-component.js';
|
||||
class CollabsPage extends BaseComponent {
|
||||
init() {
|
||||
this.render();
|
||||
this.initFeed();
|
||||
}
|
||||
|
||||
render() {
|
||||
@@ -23,6 +24,13 @@ class CollabsPage extends BaseComponent {
|
||||
`);
|
||||
}
|
||||
|
||||
initFeed() {
|
||||
const feed = this.$('rant-feed');
|
||||
if (feed) {
|
||||
feed.setStateKey('feed_state_collabs');
|
||||
}
|
||||
}
|
||||
|
||||
refresh() {
|
||||
const feed = this.$('rant-feed');
|
||||
if (feed) {
|
||||
|
||||
@@ -14,6 +14,7 @@ class HomePage extends BaseComponent {
|
||||
|
||||
init() {
|
||||
this.render();
|
||||
this.initFeed();
|
||||
}
|
||||
|
||||
render() {
|
||||
@@ -26,6 +27,13 @@ class HomePage extends BaseComponent {
|
||||
`);
|
||||
}
|
||||
|
||||
initFeed() {
|
||||
const feed = this.$('rant-feed');
|
||||
if (feed) {
|
||||
feed.setStateKey('feed_state_home');
|
||||
}
|
||||
}
|
||||
|
||||
onAttributeChanged(name, oldValue, newValue) {
|
||||
if (name === 'sort') {
|
||||
const feed = this.$('rant-feed');
|
||||
|
||||
@@ -13,6 +13,7 @@ class SearchPage extends BaseComponent {
|
||||
}
|
||||
|
||||
init() {
|
||||
this.currentQuery = null;
|
||||
this.render();
|
||||
this.bindEvents();
|
||||
}
|
||||
@@ -50,10 +51,19 @@ class SearchPage extends BaseComponent {
|
||||
`);
|
||||
|
||||
if (query) {
|
||||
this.currentQuery = query;
|
||||
this.initFeed();
|
||||
this.search(query);
|
||||
}
|
||||
}
|
||||
|
||||
initFeed() {
|
||||
const feed = this.$('rant-feed');
|
||||
if (feed && this.currentQuery) {
|
||||
feed.setStateKey('feed_state_search_' + this.currentQuery);
|
||||
}
|
||||
}
|
||||
|
||||
bindEvents() {
|
||||
this.on(this, 'submit', this.handleSubmit);
|
||||
}
|
||||
|
||||
@@ -10,6 +10,7 @@ import { BaseComponent } from '../components/base-component.js';
|
||||
class StoriesPage extends BaseComponent {
|
||||
init() {
|
||||
this.render();
|
||||
this.initFeed();
|
||||
}
|
||||
|
||||
render() {
|
||||
@@ -23,6 +24,13 @@ class StoriesPage extends BaseComponent {
|
||||
`);
|
||||
}
|
||||
|
||||
initFeed() {
|
||||
const feed = this.$('rant-feed');
|
||||
if (feed) {
|
||||
feed.setStateKey('feed_state_stories');
|
||||
}
|
||||
}
|
||||
|
||||
refresh() {
|
||||
const feed = this.$('rant-feed');
|
||||
if (feed) {
|
||||
|
||||
@@ -10,6 +10,7 @@ import { BaseComponent } from '../components/base-component.js';
|
||||
class WeeklyPage extends BaseComponent {
|
||||
init() {
|
||||
this.render();
|
||||
this.initFeed();
|
||||
}
|
||||
|
||||
render() {
|
||||
@@ -23,6 +24,13 @@ class WeeklyPage extends BaseComponent {
|
||||
`);
|
||||
}
|
||||
|
||||
initFeed() {
|
||||
const feed = this.$('rant-feed');
|
||||
if (feed) {
|
||||
feed.setStateKey('feed_state_weekly');
|
||||
}
|
||||
}
|
||||
|
||||
refresh() {
|
||||
const feed = this.$('rant-feed');
|
||||
if (feed) {
|
||||
|
||||
Reference in New Issue
Block a user