Add users and apps inner search and add HeaderMenu cancel

Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>

2 files changed, 33 insertions, 15 deletions

diff --git a/apps/settings/src/components/UserList.vue b/apps/settings/src/components/UserList.vue
index 344b6eeec93..3b128dc352f 100644
--- a/apps/settings/src/components/UserList.vue
+++ b/apps/settings/src/components/UserList.vue
@@ -241,11 +241,16 @@
 </template>
 
 <script>
-import userRow from './UserList/UserRow'
-import { Multiselect, Actions, ActionButton } from '@nextcloud/vue'
+import { subscribe, unsubscribe } from '@nextcloud/event-bus'
 import InfiniteLoading from 'vue-infinite-loading'
 import Vue from 'vue'
 
+import Multiselect from '@nextcloud/vue/dist/Components/Multiselect'
+import Actions from '@nextcloud/vue/dist/Components/Actions'
+import ActionButton from '@nextcloud/vue/dist/Components/ActionButton'
+
+import userRow from './UserList/UserRow'
+
 const unlimitedQuota = {
 	id: 'none',
 	label: t('settings', 'Unlimited'),
@@ -407,6 +412,7 @@ export default {
 			}
 		},
 	},
+
 	mounted() {
 		if (!this.settings.canChangePassword) {
 			OC.Notification.showTemporary(t('settings', 'Password change is disabled because the master key is disabled'))
@@ -420,13 +426,19 @@ export default {
 		/**
 		 * Register search
 		 */
-		this.userSearch = new OCA.Search(this.search, this.resetSearch)
+		subscribe('nextcloud:unified-search:search', this.search)
+		subscribe('nextcloud:unified-search:reset', this.resetSearch)
 
 		/**
 		 * If disabled group but empty, redirect
 		 */
 		this.redirectIfDisabled()
 	},
+	beforeDestroy() {
+		unsubscribe('nextcloud:unified-search:search', this.search)
+		unsubscribe('nextcloud:unified-search:reset', this.resetSearch)
+	},
+
 	methods: {
 		onScroll(event) {
 			this.scrolled = event.target.scrollTo > 0
@@ -465,13 +477,13 @@ export default {
 		},
 
 		/* SEARCH */
-		search(query) {
+		search({ query }) {
 			this.searchQuery = query
 			this.$store.commit('resetUsers')
 			this.$refs.infiniteLoading.stateChanger.reset()
 		},
 		resetSearch() {
-			this.search('')
+			this.search({ query: '' })
 		},
 
 		resetForm() {
diff --git a/apps/settings/src/views/Apps.vue b/apps/settings/src/views/Apps.vue
index a95127b77d6..ca45276f589 100644
--- a/apps/settings/src/views/Apps.vue
+++ b/apps/settings/src/views/Apps.vue
@@ -141,6 +141,10 @@
 </template>
 
 <script>
+import { subscribe, unsubscribe } from '@nextcloud/event-bus'
+import Vue from 'vue'
+import VueLocalStorage from 'vue-localstorage'
+
 import AppContent from '@nextcloud/vue/dist/Components/AppContent'
 import AppNavigation from '@nextcloud/vue/dist/Components/AppNavigation'
 import AppNavigationCounter from '@nextcloud/vue/dist/Components/AppNavigationCounter'
@@ -149,8 +153,6 @@ import AppNavigationSpacer from '@nextcloud/vue/dist/Components/AppNavigationSpa
 import AppSidebar from '@nextcloud/vue/dist/Components/AppSidebar'
 import AppSidebarTab from '@nextcloud/vue/dist/Components/AppSidebarTab'
 import Content from '@nextcloud/vue/dist/Components/Content'
-import Vue from 'vue'
-import VueLocalStorage from 'vue-localstorage'
 
 import AppList from '../components/AppList'
 import AppDetails from '../components/AppDetails'
@@ -254,8 +256,8 @@ export default {
 	},
 
 	watch: {
-		category(val, old) {
-			this.setSearch('')
+		category() {
+			this.searchQuery = ''
 		},
 
 		app() {
@@ -276,20 +278,24 @@ export default {
 		this.$store.dispatch('getGroups', { offset: 0, limit: 5 })
 		this.$store.commit('setUpdateCount', this.$store.getters.getServerData.updateCount)
 	},
+
 	mounted() {
-		/**
-		 * Register search
-		 */
-		this.appSearch = new OCA.Search(this.setSearch, this.resetSearch)
+		subscribe('nextcloud:unified-search:search', this.setSearch)
+		subscribe('nextcloud:unified-search:reset', this.resetSearch)
+	},
+	beforeDestroy() {
+		unsubscribe('nextcloud:unified-search:search', this.setSearch)
+		unsubscribe('nextcloud:unified-search:reset', this.resetSearch)
 	},
 
 	methods: {
-		setSearch(query) {
+		setSearch({ query }) {
 			this.searchQuery = query
 		},
 		resetSearch() {
-			this.setSearch('')
+			this.searchQuery = ''
 		},
+
 		hideAppDetails() {
 			this.$router.push({
 				name: 'apps-category',