github-mirror/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2024-11-22 14:03:22 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

UX: Avoid header topic-info flicker when using ?page= params (#28117)

Browse Source 
In this case, there is no 'nearPost' param in the URL. Instead, the server preloads a post-stream with whichever page of posts is requested. We can check for that situation using `postStream.firstPostPresent`.

Also updates the widget-header version to fetch a value from the service on initial render, instead of relying on the observer triggering.

Followup to bdec564d14
This commit is contained in:
David Taylor 2024-07-29 20:36:23 +01:00 committed by GitHub
parent 5b51ed3856
commit b44190307f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 7 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/assets/javascripts/discourse/app/components/site-header.js
View File

@ -239,7 +239,7 @@ const SiteHeaderComponent = MountWidget.extend(
const headerService = getOwner(this).lookup("service:header");
headerService.addObserver("topicInfoVisible", this, "setTopic");
headerService.topicInfoVisible; // Access property to set up observer
this.setTopic();
this.appEvents.on("user-menu:rendered", this, "_animateMenu");

5
app/assets/javascripts/discourse/app/routes/topic-from-params.js
View File

@ -46,7 +46,10 @@ export default class TopicFromParams extends DiscourseRoute {
this.pmTopicTrackingState.startTracking();
}
this.header.enterTopic(topic, model.nearPost);
const isLoadingFirstPost =
topic.postStream.firstPostPresent &&
!(model.nearPost && model.nearPost > 1);
this.header.enterTopic(topic, isLoadingFirstPost);
}
deactivate() {

4
app/assets/javascripts/discourse/app/services/header.js
View File

@ -133,9 +133,9 @@ export default class Header extends Service {
* and makes a guess about whether the main topic title is likely to be visible
* on initial load. The IntersectionObserver will correct this later if needed.
*/
enterTopic(topic, postNumber) {
enterTopic(topic, isLoadingFirstPost) {
this.topicInfo = topic;
this.mainTopicTitleVisible = !postNumber || postNumber === 1;
this.mainTopicTitleVisible = isLoadingFirstPost;
}
clearTopic() {