refactor: use eventbus for updated filters

prevent filters not applied if `filtersChanged` was set before file list
mounted.

Signed-off-by: Ferdinand Thiessen <[email protected]>

Author: susnux

apps/files/src/eventbus.d.ts

@@ -12,6 +12,8 @@ declare module '@nextcloud/event-bus' {
 		'files:favorites:added': Node
 		'files:favorites:removed': Node
 
+		'files:filters:changed': undefined
+
 		'files:node:created': Node
 		'files:node:deleted': Node
 		'files:node:moved': { node: Node, oldSource: string }

apps/files/src/store/filters.ts

@@ -3,7 +3,7 @@
  * SPDX-License-Identifier: AGPL-3.0-or-later
  */
 import type { FilterUpdateChipsEvent, IFileListFilter, IFileListFilterChip } from '@nextcloud/files'
-import { subscribe } from '@nextcloud/event-bus'
+import { emit, subscribe } from '@nextcloud/event-bus'
 import { getFileListFilters } from '@nextcloud/files'
 import { defineStore } from 'pinia'
 import { computed, ref } from 'vue'
@@ -20,7 +20,6 @@ function isFileListFilterWithUi(value: IFileListFilter): value is Required<IFile
 export const useFiltersStore = defineStore('filters', () => {
 	const chips = ref<Record<string, IFileListFilterChip[]>>({})
 	const filters = ref<IFileListFilter[]>([])
-	const filtersChanged = ref(false)
 
 	/**
 	 * Currently active filter chips
@@ -77,7 +76,7 @@ export const useFiltersStore = defineStore('filters', () => {
 	 * @private
 	 */
 	function onFilterUpdate() {
-		filtersChanged.value = true
+		emit('files:filters:changed')
 	}
 
 	/**
@@ -122,7 +121,6 @@ export const useFiltersStore = defineStore('filters', () => {
 		chips,
 		filters,
 		filtersWithUI,
-		filtersChanged,
 
 		// getters / computed
 		activeChips,

apps/files/src/views/FilesList.vue

@@ -433,10 +433,6 @@ export default defineComponent({
 				&& this.currentFolder && (this.currentFolder.permissions & Permission.SHARE) !== 0
 		},
 
-		filtersChanged() {
-			return this.filtersStore.filtersChanged
-		},
-
 		showCustomEmptyView() {
 			return !this.loading && this.isEmptyDir && this.currentView?.emptyView !== undefined
 		},
@@ -496,13 +492,6 @@ export default defineComponent({
 			// Also refresh the filtered content
 			this.filterDirContent()
 		},
-
-		filtersChanged() {
-			if (this.filtersChanged) {
-				this.filterDirContent()
-				this.filtersStore.filtersChanged = false
-			}
-		},
 	},
 
 	async mounted() {
@@ -512,6 +501,9 @@ export default defineComponent({
 		// reload on settings change
 		subscribe('files:config:updated', this.fetchContent)
 
+		// filter content if filter were changed
+		subscribe('files:filters:changed', this.filterDirContent)
+
 		// Finally, fetch the current directory contents
 		await this.fetchContent()
 		if (this.fileId) {