Backup_Repos/komga
1
0
Fork 0
mirror of https://github.com/gotson/komga.git synced 2025-12-20 23:45:11 +01:00
Code Issues Projects Releases Wiki Activity

refactor(webui): migrate remaining cookies to localStorage

Browse source 
closes #456
This commit is contained in:
Gauthier Roebroeck 2021-03-26 18:04:25 +08:00
parent b33dc24490
commit ccd2d7ebcc
7 changed files with 40 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
komga-webui/src/App.vue
View file

@ -69,6 +69,9 @@ export default Vue.extend({
this.$store.commit('setBrowsingPageSize', parseInt(this.$cookies.get(cookiePageSize)))
this.$cookies.remove(cookiePageSize)
}
this.$cookies.keys()
.filter(x => x.startsWith('collection.filter') || x.startsWith('library.filter') || x.startsWith('library.sort'))
.forEach(x => this.$cookies.remove(x))
},
beforeDestroy() {
window.matchMedia('(prefers-color-scheme: dark)').removeEventListener('change', this.systemThemeChange)

27
komga-webui/src/plugins/persisted-state.ts
View file

@ -16,6 +16,24 @@ export const persistedModule: Module<any, any> = {
background: '',
},
browsingPageSize: undefined as unknown as number,
collection: {
filter: {},
},
library: {
filter: {},
sort: {},
},
},
getters: {
getCollectionFilter: (state) => (id: string) => {
return state.collection.filter[id]
},
getLibraryFilter: (state) => (id: string) => {
return state.library.filter[id]
},
getLibrarySort: (state) => (id: string) => {
return state.library.sort[id]
},
},
mutations: {
setLocale (state, val) {
@ -51,5 +69,14 @@ export const persistedModule: Module<any, any> = {
setBrowsingPageSize(state, val) {
state.browsingPageSize = val
},
setCollectionFilter(state, {id, filter}) {
state.collection.filter[id] = filter
},
setLibraryFilter(state, {id, filter}) {
state.library.filter[id] = filter
},
setLibrarySort(state, {id, sort}) {
state.library.sort[id] = sort
},
},
}

7
komga-webui/src/views/BrowseCollection.vue
View file

@ -284,15 +284,12 @@ export default Vue.extend({
this.$set(this.filters, role, parseQueryFilter(route.query[role], this.filterOptions[role].map((x: NameValue) => x.value)))
})
} else {
this.filters = this.$cookies.get(this.cookieFilter(route.params.collectionId)) || {} as FiltersActive
this.filters = this.$store.getters.getCollectionFilter(route.params.collectionId) || {} as FiltersActive
}
},
cookieFilter(collectionId: string): string {
return `collection.filter.${collectionId}`
},
setWatches() {
this.filterUnwatch = this.$watch('filters', (val) => {
this.$cookies.set(this.cookieFilter(this.collectionId), val, Infinity)
this.$store.commit('setCollectionFilter', {id: this.collectionId, filter: val})
this.updateRouteAndReload()
})
},

2
komga-webui/src/views/BrowseCollections.vue
View file

@ -93,7 +93,7 @@ export default Vue.extend({
this.$eventHub.$off(LIBRARY_CHANGED, this.reloadLibrary)
},
mounted () {
this.pageSize = this.$store.state.persistedState.browsingPageSize
this.pageSize = this.$store.state.persistedState.browsingPageSize || this.pageSize
// restore from query param
if (this.$route.query.page) this.page = Number(this.$route.query.page)

16
komga-webui/src/views/BrowseLibraries.vue
View file

@ -186,7 +186,7 @@ export default Vue.extend({
this.$eventHub.$off(LIBRARY_CHANGED, this.reloadLibrary)
},
async mounted() {
this.pageSize = this.$store.state.persistedState.browsingPageSize
this.pageSize = this.$store.state.persistedState.browsingPageSize || this.pageSize
// restore from query param
await this.resetParams(this.$route, this.libraryId)
@ -274,15 +274,9 @@ export default Vue.extend({
},
},
methods: {
cookieSort(libraryId: string): string {
return `library.sort.${libraryId}`
},
cookieFilter(libraryId: string): string {
return `library.filter.${libraryId}`
},
async resetParams(route: any, libraryId: string) {
this.sortActive = parseQuerySort(route.query.sort, this.sortOptions) ||
this.$cookies.get(this.cookieSort(route.params.libraryId)) ||
this.$store.getters.getLibrarySort(route.params.libraryId) ||
this.$_.clone(this.sortDefault)
const requestLibraryId = libraryId !== LIBRARIES_ALL ? libraryId : undefined
@ -314,7 +308,7 @@ export default Vue.extend({
this.$set(this.filters, role, parseQueryFilter(route.query[role], this.filterOptions[role].map((x: NameValue) => x.value)))
})
} else {
this.filters = this.$cookies.get(this.cookieFilter(route.params.libraryId)) || {} as FiltersActive
this.filters = this.$store.getters.getLibraryFilter(route.params.libraryId) || {} as FiltersActive
}
},
libraryDeleted(event: EventLibraryDeleted) {
@ -326,11 +320,11 @@ export default Vue.extend({
},
setWatches() {
this.sortUnwatch = this.$watch('sortActive', (val) => {
this.$cookies.set(this.cookieSort(this.libraryId), val, Infinity)
this.$store.commit('setLibrarySort', {id: this.libraryId, sort: val})
this.updateRouteAndReload()
})
this.filterUnwatch = this.$watch('filters', (val) => {
this.$cookies.set(this.cookieFilter(this.libraryId), val, Infinity)
this.$store.commit('setLibraryFilter', {id: this.libraryId, filter: val})
this.updateRouteAndReload()
})
this.pageSizeUnwatch = this.$watch('pageSize', (val) => {

2
komga-webui/src/views/BrowseReadLists.vue
View file

@ -93,7 +93,7 @@ export default Vue.extend({
this.$eventHub.$off(LIBRARY_CHANGED, this.reloadLibrary)
},
mounted () {
this.pageSize = this.$store.state.persistedState.browsingPageSize
this.pageSize = this.$store.state.persistedState.browsingPageSize || this.pageSize
// restore from query param
if (this.$route.query.page) this.page = Number(this.$route.query.page)

2
komga-webui/src/views/BrowseSeries.vue
View file

@ -531,7 +531,7 @@ export default Vue.extend({
this.$eventHub.$off(LIBRARY_DELETED, this.libraryDeleted)
},
async mounted() {
this.pageSize = this.$store.state.persistedState.browsingPageSize
this.pageSize = this.$store.state.persistedState.browsingPageSize || this.pageSize
// restore from query param
await this.resetParams(this.$route, this.seriesId)