From 82744bf193f146412d5d272f36f87e59aff5d938 Mon Sep 17 00:00:00 2001
From: Renon <renon@disroot.org>
Date: Tue, 12 Nov 2019 15:51:45 +0100
Subject: [PATCH] Resolve "Option to remember our display settings "
---
changes/changelog.d/391.enhancement | 1 +
.../changelog.d}/943.bugfix | 0
front/src/components/library/Albums.vue | 6 ----
front/src/components/library/Artists.vue | 6 ----
front/src/components/library/Radios.vue | 8 +----
front/src/components/mixins/Ordering.vue | 35 +++++++++++++++++++
front/src/store/index.js | 2 +-
front/src/store/ui.js | 35 +++++++++++++++++--
front/src/views/playlists/List.vue | 6 ----
9 files changed, 71 insertions(+), 28 deletions(-)
create mode 100644 changes/changelog.d/391.enhancement
rename {front/src/components/playlists => changes/changelog.d}/943.bugfix (100%)
diff --git a/changes/changelog.d/391.enhancement b/changes/changelog.d/391.enhancement
new file mode 100644
index 0000000000..28c19ecf3e
--- /dev/null
+++ b/changes/changelog.d/391.enhancement
@@ -0,0 +1 @@
+Remember display settings in Album, Artist, Radio and Playlist views (#391)
diff --git a/front/src/components/playlists/943.bugfix b/changes/changelog.d/943.bugfix
similarity index 100%
rename from front/src/components/playlists/943.bugfix
rename to changes/changelog.d/943.bugfix
diff --git a/front/src/components/library/Albums.vue b/front/src/components/library/Albums.vue
index 07e20b22e9..5ce51be1be 100644
--- a/front/src/components/library/Albums.vue
+++ b/front/src/components/library/Albums.vue
@@ -119,18 +119,12 @@ export default {
TagsSelector,
},
data() {
- let defaultOrdering = this.getOrderingFromString(
- this.defaultOrdering || "-creation_date"
- )
return {
isLoading: true,
result: null,
page: parseInt(this.defaultPage),
query: this.defaultQuery,
tags: (this.defaultTags || []).filter((t) => { return t.length > 0 }),
- paginateBy: parseInt(this.defaultPaginateBy || 25),
- orderingDirection: defaultOrdering.direction || "+",
- ordering: defaultOrdering.field,
orderingOptions: [["creation_date", "creation_date"], ["title", "album_title"]]
}
},
diff --git a/front/src/components/library/Artists.vue b/front/src/components/library/Artists.vue
index a56abac142..f0dcd8a116 100644
--- a/front/src/components/library/Artists.vue
+++ b/front/src/components/library/Artists.vue
@@ -107,18 +107,12 @@ export default {
TagsSelector,
},
data() {
- let defaultOrdering = this.getOrderingFromString(
- this.defaultOrdering || "-creation_date"
- )
return {
isLoading: true,
result: null,
page: parseInt(this.defaultPage),
query: this.defaultQuery,
tags: (this.defaultTags || []).filter((t) => { return t.length > 0 }),
- paginateBy: parseInt(this.defaultPaginateBy || 30),
- orderingDirection: defaultOrdering.direction || "+",
- ordering: defaultOrdering.field,
orderingOptions: [["creation_date", "creation_date"], ["name", "name"]]
}
},
diff --git a/front/src/components/library/Radios.vue b/front/src/components/library/Radios.vue
index a646321bc9..b03801d807 100644
--- a/front/src/components/library/Radios.vue
+++ b/front/src/components/library/Radios.vue
@@ -93,7 +93,7 @@
v-for="radio in result.results"
:key="radio.id"
:custom-radio="radio"></radio-card>
- </div>
+ </div>
</div>
<div class="ui center aligned basic segment">
<pagination
@@ -133,17 +133,11 @@ export default {
Pagination
},
data() {
- let defaultOrdering = this.getOrderingFromString(
- this.defaultOrdering || "-creation_date"
- )
return {
isLoading: true,
result: null,
page: parseInt(this.defaultPage),
query: this.defaultQuery,
- paginateBy: parseInt(this.defaultPaginateBy || 12),
- orderingDirection: defaultOrdering.direction || "+",
- ordering: defaultOrdering.field,
orderingOptions: [["creation_date", "creation_date"], ["name", "name"]]
}
},
diff --git a/front/src/components/mixins/Ordering.vue b/front/src/components/mixins/Ordering.vue
index 6235fd7d04..befce8faad 100644
--- a/front/src/components/mixins/Ordering.vue
+++ b/front/src/components/mixins/Ordering.vue
@@ -3,6 +3,41 @@ export default {
props: {
defaultOrdering: {type: String, required: false}
},
+ computed: {
+ paginateBy: {
+ set(paginateBy) {
+ this.$store.commit('ui/paginateBy', {
+ route: this.$route.name,
+ value: paginateBy
+ })
+ },
+ get() {
+ return this.$store.state.ui.routePreferences[this.$route.name].paginateBy
+ }
+ },
+ ordering: {
+ set(ordering) {
+ this.$store.commit('ui/ordering', {
+ route: this.$route.name,
+ value: ordering
+ })
+ },
+ get() {
+ return this.$store.state.ui.routePreferences[this.$route.name].ordering
+ }
+ },
+ orderingDirection: {
+ set(orderingDirection) {
+ this.$store.commit('ui/orderingDirection', {
+ route: this.$route.name,
+ value: orderingDirection
+ })
+ },
+ get() {
+ return this.$store.state.ui.routePreferences[this.$route.name].orderingDirection
+ }
+ },
+ },
methods: {
getOrderingFromString (s) {
let parts = s.split('-')
diff --git a/front/src/store/index.js b/front/src/store/index.js
index d94a0bcc77..e10f97b51a 100644
--- a/front/src/store/index.js
+++ b/front/src/store/index.js
@@ -40,7 +40,7 @@ export default new Vuex.Store({
}),
createPersistedState({
key: 'ui',
- paths: ['ui.currentLanguage', 'ui.selectedLanguage', 'ui.momentLocale', 'ui.theme']
+ paths: ['ui.currentLanguage', 'ui.selectedLanguage', 'ui.momentLocale', 'ui.theme', 'ui.routePreferences']
}),
createPersistedState({
key: 'radios',
diff --git a/front/src/store/ui.js b/front/src/store/ui.js
index 48795116f9..0ddd94555c 100644
--- a/front/src/store/ui.js
+++ b/front/src/store/ui.js
@@ -24,7 +24,29 @@ export default {
'mutation.updated': {},
'report.created': {},
},
- pageTitle: null
+ pageTitle: null,
+ routePreferences: {
+ "library.albums.browse": {
+ paginateBy: 25,
+ orderingDirection: "-",
+ ordering: "creation_date",
+ },
+ "library.artists.browse": {
+ paginateBy: 30,
+ orderingDirection: "-",
+ ordering: "creation_date",
+ },
+ "library.radios.browse": {
+ paginateBy: 12,
+ orderingDirection: "-",
+ ordering: "creation_date",
+ },
+ "library.playlists.browse": {
+ paginateBy: 25,
+ orderingDirection: "-",
+ ordering: "creation_date",
+ },
+ },
},
getters: {
showInstanceSupportMessage: (state, getters, rootState) => {
@@ -103,7 +125,16 @@ export default {
},
pageTitle: (state, value) => {
state.pageTitle = value
- }
+ },
+ paginateBy: (state, {route, value}) => {
+ state.routePreferences[route].paginateBy = value
+ },
+ ordering: (state, {route, value}) => {
+ state.routePreferences[route].ordering = value
+ },
+ orderingDirection: (state, {route, value}) => {
+ state.routePreferences[route].orderingDirection = value
+ },
},
actions: {
fetchUnreadNotifications ({commit}, payload) {
diff --git a/front/src/views/playlists/List.vue b/front/src/views/playlists/List.vue
index 9fb53fd66c..dad029cf43 100644
--- a/front/src/views/playlists/List.vue
+++ b/front/src/views/playlists/List.vue
@@ -94,17 +94,11 @@ export default {
Pagination
},
data() {
- let defaultOrdering = this.getOrderingFromString(
- this.defaultOrdering || "-creation_date"
- )
return {
isLoading: true,
result: null,
page: parseInt(this.defaultPage),
query: this.defaultQuery,
- paginateBy: parseInt(this.defaultPaginateBy || 12),
- orderingDirection: defaultOrdering.direction || "+",
- ordering: defaultOrdering.field,
orderingOptions: [
["creation_date", "creation_date"],
["modification_date", "modification_date"],
--
GitLab