discourse/discourse
1
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2025-07-12 11:53:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

FIX: Correctly unhighlight glimmer topic list items (#27713)

Browse Source 
set `highlight` to `false` regardless of the animation finishing
This commit is contained in:
Jarek Radosz 2024-07-04 15:46:46 +02:00 committed by GitHub
parent 0d608ceff8
commit 32149e6fa1
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 11 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
app/assets/javascripts/discourse/app/components/topic-list/topic-list-item.gjs
View File

@ -3,6 +3,7 @@ import { concat, hash } from "@ember/helper";
import { on } from "@ember/modifier"; import { on } from "@ember/modifier";
import { action } from "@ember/object"; import { action } from "@ember/object";
import didInsert from "@ember/render-modifiers/modifiers/did-insert"; import didInsert from "@ember/render-modifiers/modifiers/did-insert";
import { next } from "@ember/runloop";
import { service } from "@ember/service"; import { service } from "@ember/service";
import { modifier } from "ember-modifier"; import { modifier } from "ember-modifier";
import { eq, gt } from "truth-helpers"; import { eq, gt } from "truth-helpers";
@ -46,18 +47,16 @@ export default class TopicListItem extends Component {
if (this.args.topic.id === this.historyStore.get("lastTopicIdViewed")) { if (this.args.topic.id === this.historyStore.get("lastTopicIdViewed")) {
element.dataset.isLastViewedTopic = true; element.dataset.isLastViewedTopic = true;
this.highlightRow(element).then(() => this.highlightRow(element);
this.historyStore.delete("lastTopicIdViewed") next(() => this.historyStore.delete("lastTopicIdViewed"));
);
if (this.shouldFocusLastVisited) { if (this.shouldFocusLastVisited) {
element.querySelector(".main-link .title")?.focus(); element.querySelector(".main-link .title")?.focus();
} }
} else if (this.args.topic.get("highlight")) { } else if (this.args.topic.get("highlight")) {
// highlight new topics that have been loaded from the server or the one we just created // highlight new topics that have been loaded from the server or the one we just created
this.highlightRow(element).then(() => this.highlightRow(element);
this.args.topic.set("highlight", false) next(() => this.args.topic.set("highlight", false));
);
} }
}); });
@ -146,18 +145,13 @@ export default class TopicListItem extends Component {
} }
highlightRow(element) { highlightRow(element) {
return new Promise((resolve) => {
element.addEventListener( element.addEventListener(
"animationend", "animationend",
() => { () => element.classList.remove("highlighted"),
element.classList.remove("highlighted");
resolve();
},
{ once: true } { once: true }
); );
element.classList.add("highlighted"); element.classList.add("highlighted");
});
} }
@action @action