diff --git a/changes/changelog.d/902.bugfix b/changes/changelog.d/902.bugfix new file mode 100644 index 000000000..afe2ade81 --- /dev/null +++ b/changes/changelog.d/902.bugfix @@ -0,0 +1 @@ +Fixed search usability issue when browsing artists, albums, radios and playlists (#902) diff --git a/front/src/components/library/Albums.vue b/front/src/components/library/Albums.vue index ed97f7a4e..0e0fa4650 100644 --- a/front/src/components/library/Albums.vue +++ b/front/src/components/library/Albums.vue @@ -110,7 +110,7 @@ export default { result: null, page: parseInt(this.defaultPage), query: this.defaultQuery, - tags: this.defaultTags.filter((t) => { return t.length > 0 }) || [], + tags: (this.defaultTags || []).filter((t) => { return t.length > 0 }), paginateBy: parseInt(this.defaultPaginateBy || 25), orderingDirection: defaultOrdering.direction || "+", ordering: defaultOrdering.field, @@ -135,15 +135,18 @@ export default { }, methods: { updateQueryString: _.debounce(function() { - this.$router.replace({ - query: { + history.pushState( + {}, + null, + this.$route.path + '?' + new URLSearchParams( + { query: this.query, page: this.page, tag: this.tags, paginateBy: this.paginateBy, ordering: this.getOrderingAsString() - } - }) + }).toString() + ) }, 500), fetchData: _.debounce(function() { var self = this diff --git a/front/src/components/library/Artists.vue b/front/src/components/library/Artists.vue index c1a13aed9..2ac23ac8e 100644 --- a/front/src/components/library/Artists.vue +++ b/front/src/components/library/Artists.vue @@ -98,7 +98,7 @@ export default { result: null, page: parseInt(this.defaultPage), query: this.defaultQuery, - tags: this.defaultTags.filter((t) => { return t.length > 0 }) || [], + tags: (this.defaultTags || []).filter((t) => { return t.length > 0 }), paginateBy: parseInt(this.defaultPaginateBy || 30), orderingDirection: defaultOrdering.direction || "+", ordering: defaultOrdering.field, @@ -123,15 +123,18 @@ export default { }, methods: { updateQueryString: _.debounce(function() { - this.$router.replace({ - query: { + history.pushState( + {}, + null, + this.$route.path + '?' + new URLSearchParams( + { query: this.query, page: this.page, tag: this.tags, paginateBy: this.paginateBy, ordering: this.getOrderingAsString() - } - }) + }).toString() + ) }, 500), fetchData: _.debounce(function() { var self = this diff --git a/front/src/components/library/Radios.vue b/front/src/components/library/Radios.vue index 9f59db514..2d68d9072 100644 --- a/front/src/components/library/Radios.vue +++ b/front/src/components/library/Radios.vue @@ -154,14 +154,17 @@ export default { }, methods: { updateQueryString: _.debounce(function() { - this.$router.replace({ - query: { + history.pushState( + {}, + null, + this.$route.path + '?' + new URLSearchParams( + { query: this.query, page: this.page, paginateBy: this.paginateBy, ordering: this.getOrderingAsString() - } - }) + }).toString() + ) }, 500), fetchData: _.debounce(function() { var self = this diff --git a/front/src/views/playlists/List.vue b/front/src/views/playlists/List.vue index 160b7b83c..1ff56b5d5 100644 --- a/front/src/views/playlists/List.vue +++ b/front/src/views/playlists/List.vue @@ -113,14 +113,17 @@ export default { }, methods: { updateQueryString: _.debounce(function() { - this.$router.replace({ - query: { + history.pushState( + {}, + null, + this.$route.path + '?' + new URLSearchParams( + { query: this.query, page: this.page, paginateBy: this.paginateBy, ordering: this.getOrderingAsString() - } - }) + }).toString() + ) }, 250), fetchData: _.debounce(function() { var self = this