Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

FIX: Don't listen for focus/blur events if the topic-list opts out of last visited focus (#16263) 

Follow-up to eb237e634a.

Some `{{topic-list}}` instances, like the one for suggested topics, opt out of focusing the row of the last visited topic in the list, but we currently still add listeners for focus/blur events even if when the topic-list instance opts out. This commit adds a check so that we only register focus/blur listeners if the topic-list opts in for last visited topic focus.
This commit is contained in:
Osama Sayegh 2022-03-23 15:30:11 +03:00 committed by GitHub
parent eb237e634a
commit 97e7bb1ce4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 28 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
app/assets/javascripts/discourse/app/components/topic-list-item.js
View File

@ -61,10 +61,12 @@ export default Component.extend({
if (this.selected && this.selected.includes(this.topic)) { if (this.selected && this.selected.includes(this.topic)) {
this.element.querySelector("input.bulk-select").checked = true; this.element.querySelector("input.bulk-select").checked = true;
} }
const title = this.element.querySelector(".main-link .title"); if (this._shouldFocusLastVisited()) {
if (title) { const title = this._titleElement();
title.addEventListener("focus", this._onTitleFocus); if (title) {
title.addEventListener("blur", this._onTitleBlur); title.addEventListener("focus", this._onTitleFocus);
title.addEventListener("blur", this._onTitleBlur);
}
} }
}); });
} }
@ -106,10 +108,12 @@ export default Component.extend({
if (this.includeUnreadIndicator) { if (this.includeUnreadIndicator) {
this.messageBus.unsubscribe(this.unreadIndicatorChannel); this.messageBus.unsubscribe(this.unreadIndicatorChannel);
} }
const title = this.element?.querySelector(".main-link .title"); if (this._shouldFocusLastVisited()) {
if (title) { const title = this._titleElement();
title.removeEventListener("focus", this._onTitleFocus); if (title) {
title.removeEventListener("blur", this._onTitleBlur); title.removeEventListener("focus", this._onTitleFocus);
title.removeEventListener("blur", this._onTitleBlur);
}
} }
}, },
@ -280,12 +284,8 @@ export default Component.extend({
this.element.addEventListener("animationend", () => { this.element.addEventListener("animationend", () => {
this.element.classList.remove("highlighted"); this.element.classList.remove("highlighted");
}); });
if ( if (opts.isLastViewedTopic && this._shouldFocusLastVisited()) {
this.focusLastVisitedTopic && this._titleElement().focus();
opts.isLastViewedTopic &&
!this.site.mobileView
) {
this.element.querySelector(".main-link .title").focus();
} }
}); });
}, },
@ -305,16 +305,26 @@ export default Component.extend({
@bind @bind
_onTitleFocus() { _onTitleFocus() {
if (this.element && !this.isDestroying && !this.isDestroyed) { if (this.element && !this.isDestroying && !this.isDestroyed) {
const mainLink = this.element.querySelector(".main-link"); this._mainLinkElement().classList.add("focused");
mainLink.classList.add("focused");
} }
}, },
@bind @bind
_onTitleBlur() { _onTitleBlur() {
if (this.element && !this.isDestroying && !this.isDestroyed) { if (this.element && !this.isDestroying && !this.isDestroyed) {
const mainLink = this.element.querySelector(".main-link"); this._mainLinkElement().classList.remove("focused");
mainLink.classList.remove("focused");
} }
}, },
_shouldFocusLastVisited() {
return !this.site.mobileView && this.focusLastVisitedTopic;
},
_mainLinkElement() {
return this.element.querySelector(".main-link");
},
_titleElement() {
return this.element.querySelector(".main-link .title");
},
}); });