IntenseWebs/discourse
3
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2024-11-25 02:11:08 -06:00
Code Issues Packages Projects Releases Wiki Activity

UX: Disable dropdown when filtering in edit nav menu tags modal (#25010)

Browse Source 
Why this change?

The `Editing sidebar tags navigation allows a user to filter the tag in the modal by selection` system test was flaky
when we were doing `modal.filter("").filter_by_unselected`. The
hypothesis here is that the filtering is debounced before issue a
request to load the new tags and the dropdown is only disabled in the
debounced function. Thereforethere is a chance that when
`modal.filter_by_unselected` runs, it is selecting a row against a
disabled dropdown which results in a noop.

What does this change do?

When filtering using the input in the modal, we will now disabled the
dropdown until the filtering completes which will then re-enable the
dropdown.
This commit is contained in:
Alan Guo Xiang Tan 2023-12-22 16:26:44 +08:00 committed by GitHub
parent 9d658591d6
commit 5668866031
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 4 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/assets/javascripts/discourse/app/components/sidebar/edit-navigation-menu/tags-modal.hbs
View File

@ -15,7 +15,7 @@
@filterSelected={{this.filterSelected}}
@filterUnselected={{this.filterUnselected}}
@closeModal={{@closeModal}}
@loading={{this.tagsLoading}}
@loading={{(or this.tagsLoading this.disableFiltering)}}
class="sidebar__edit-navigation-menu__tags-modal"
>
{{#if this.tagsLoading}}

3
app/assets/javascripts/discourse/app/components/sidebar/edit-navigation-menu/tags-modal.js
View File

@ -16,6 +16,7 @@ export default class extends Component {
@tracked onlyUnSelected = false;
@tracked tags = [];
@tracked tagsLoading;
@tracked disableFiltering;
@tracked selectedTags = [...this.currentUser.sidebarTagNames];
constructor() {
@ -50,6 +51,7 @@ export default class extends Component {
})
.finally(() => {
this.tagsLoading = false;
this.disableFiltering = false;
});
}
@ -110,6 +112,7 @@ export default class extends Component {
@action
onFilterInput(filter) {
this.disableFiltering = true;
discourseDebounce(this, this.#performFiltering, filter, INPUT_DELAY);
}