refactor: migrate from vuex to pinia

Signed-off-by: fenn-cs <[email protected]>

Author: nfebe

core/src/store/index.js

@@ -19,24 +19,18 @@
  * along with this program. If not, see <http://www.gnu.org/licenses/>.
  *
  */
-const state = {
-	externalFilters: [],
-}
+import { defineStore } from 'pinia'
 
-const mutations = {
-	registerExternalFilter(state, { id, label, callback, icon }) {
-		state.externalFilters.push({ id, name: label, callback, icon, isPluginFilter: true })
-	},
-}
+export const useSearchStore = defineStore({
+	id: 'search',
 
-const actions = {
-	registerExternalFilter({ commit }, { id, label, callback, icon }) {
-		commit('registerExternalFilter', { id, label, callback, icon })
-	},
-}
+	state: () => ({
+		externalFilters: [],
+	}),
 
-export default {
-	state,
-	mutations,
-	actions,
-}
+	actions: {
+		registerExternalFilter({ id, appId, label, callback, icon }) {
+			this.externalFilters.push({ id, appId, name: label, callback, icon, isPluginFilter: true })
+		},
+	},
+})

core/src/store/unified-search-external-filters.js

@@ -23,10 +23,11 @@
 import { getLoggerBuilder } from '@nextcloud/logger'
 import { getRequestToken } from '@nextcloud/auth'
 import { translate as t, translatePlural as n } from '@nextcloud/l10n'
+import { createPinia, PiniaVuePlugin } from 'pinia'
 import Vue from 'vue'
 
 import UnifiedSearch from './views/UnifiedSearch.vue'
-import store from '../src/store/index.js'
+import { useSearchStore } from '../src/store/unified-search-external-filters.js'
 
 // eslint-disable-next-line camelcase
 __webpack_nonce__ = btoa(getRequestToken())
@@ -51,21 +52,19 @@ Vue.mixin({
 // Register the add/register filter action API globally
 window.OCP = window.OCP || {}
 window.OCP.UnifiedSearch = {
-	registerFilterAction: ({ id, name, label, callback, icon }) => {
-		store.dispatch('registerExternalFilter', {
-			id,
-			name,
-			label,
-			icon,
-			callback,
-		})
+	registerFilterAction: ({ id, appId, name, label, callback, icon }) => {
+		const searchStore = useSearchStore()
+		searchStore.registerExternalFilter({ id, appId, name, label, callback, icon })
 	},
 }
 
+Vue.use(PiniaVuePlugin)
+const pinia = createPinia()
+
 export default new Vue({
 	el: '#unified-search',
+	pinia,
 	// eslint-disable-next-line vue/match-component-file-name
 	name: 'UnifiedSearchRoot',
-	store,
 	render: h => h(UnifiedSearch),
 })

core/src/unified-search.js

@@ -154,8 +154,8 @@ import SearchResult from '../components/UnifiedSearch/SearchResult.vue'
 import debounce from 'debounce'
 import { emit, subscribe } from '@nextcloud/event-bus'
 import { useBrowserLocation } from '@vueuse/core'
-import { mapState } from 'vuex'
 import { getProviders, search as unifiedSearch, getContacts } from '../services/UnifiedSearchService.js'
+import { useSearchStore } from '../store/unified-search-external-filters.js'
 
 export default {
 	name: 'UnifiedSearchModal',
@@ -190,8 +190,10 @@ export default {
 		 * Reactive version of window.location
 		 */
 		const currentLocation = useBrowserLocation()
+		const searchStore = useSearchStore()
 		return {
 			currentLocation,
+			externalFilters: searchStore.externalFilters,
 		}
 	},
 	data() {
@@ -220,9 +222,6 @@ export default {
 	},
 
 	computed: {
-		...mapState({
-			externalFilters: state => state.search.externalFilters,
-		}),
 		userContacts() {
 			return this.contacts
 		},