Fix back button from posts going back twice instead of once (#2220)

This commit is contained in:
SleeplessOne1917 2023-11-14 13:14:28 +00:00 committed by GitHub
parent b40a3c3e27
commit ad300f19d0
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 12 additions and 96 deletions

@ -1 +1 @@
Subproject commit abd40d4737fa732321fd7b62e42bbfcd51081cb6 Subproject commit b0d80808047eb547aa995e923e9c742e87cd8be7

View file

@ -78,12 +78,7 @@ import {
InitialFetchRequest, InitialFetchRequest,
} from "../../interfaces"; } from "../../interfaces";
import { mdToHtml } from "../../markdown"; import { mdToHtml } from "../../markdown";
import { import { FirstLoadService, I18NextService, UserService } from "../../services";
FirstLoadService,
HomeCacheService,
I18NextService,
UserService,
} from "../../services";
import { import {
EMPTY_REQUEST, EMPTY_REQUEST,
HttpService, HttpService,
@ -288,18 +283,12 @@ export class Home extends Component<any, HomeState> {
postsRes, postsRes,
isIsomorphic: true, isIsomorphic: true,
}; };
HomeCacheService.postsRes = postsRes;
} }
this.state.tagline = getRandomFromList(this.state?.siteRes?.taglines ?? []) this.state.tagline = getRandomFromList(this.state?.siteRes?.taglines ?? [])
?.content; ?.content;
} }
componentWillUnmount() {
HomeCacheService.activate();
}
async componentDidMount() { async componentDidMount() {
if ( if (
!this.state.isIsomorphic || !this.state.isIsomorphic ||
@ -812,15 +801,6 @@ export class Home extends Component<any, HomeState> {
const { dataType, pageCursor, listingType, sort } = getHomeQueryParams(); const { dataType, pageCursor, listingType, sort } = getHomeQueryParams();
if (dataType === DataType.Post) { if (dataType === DataType.Post) {
if (HomeCacheService.active) {
const { postsRes, scrollY } = HomeCacheService;
HomeCacheService.deactivate();
this.setState({ postsRes });
window.scrollTo({
left: 0,
top: scrollY,
});
} else {
this.setState({ postsRes: LOADING_REQUEST }); this.setState({ postsRes: LOADING_REQUEST });
this.setState({ this.setState({
postsRes: await HttpService.client.getPosts({ postsRes: await HttpService.client.getPosts({
@ -831,9 +811,6 @@ export class Home extends Component<any, HomeState> {
type_: listingType, type_: listingType,
}), }),
}); });
HomeCacheService.postsRes = this.state.postsRes;
}
} else { } else {
this.setState({ commentsRes: LOADING_REQUEST }); this.setState({ commentsRes: LOADING_REQUEST });
this.setState({ this.setState({

View file

@ -1,60 +0,0 @@
import { GetPostsResponse } from "lemmy-js-client";
import { EMPTY_REQUEST, RequestState } from "./HttpService";
/**
* Service to cache home post listings and restore home state when user uses the browser back buttons.
*/
export class HomeCacheService {
static #_instance: HomeCacheService;
historyIdx = 0;
scrollY = 0;
posts: RequestState<GetPostsResponse> = EMPTY_REQUEST;
get active() {
return (
this.historyIdx === window.history.state.idx + 1 &&
this.posts.state === "success"
);
}
deactivate() {
this.historyIdx = 0;
}
activate() {
this.scrollY = window.scrollY;
this.historyIdx = window.history.state.idx;
}
static get #Instance() {
return this.#_instance ?? (this.#_instance = new this());
}
public static get scrollY() {
return this.#Instance.scrollY;
}
public static get historyIdx() {
return this.#Instance.historyIdx;
}
public static set postsRes(posts: RequestState<GetPostsResponse>) {
this.#Instance.posts = posts;
}
public static get postsRes() {
return this.#Instance.posts;
}
public static get active() {
return this.#Instance.active;
}
public static deactivate() {
this.#Instance.deactivate();
}
public static activate() {
this.#Instance.activate();
}
}

View file

@ -1,5 +1,4 @@
export { FirstLoadService } from "./FirstLoadService"; export { FirstLoadService } from "./FirstLoadService";
export { HomeCacheService } from "./HomeCacheService";
export { HttpService } from "./HttpService"; export { HttpService } from "./HttpService";
export { I18NextService } from "./I18NextService"; export { I18NextService } from "./I18NextService";
export { UserService } from "./UserService"; export { UserService } from "./UserService";