Add app-based filtering to global search

Emit search queries from the global search modal that would trigger list filtering in various apps that support it. Signed-off-by: fenn-cs <[email protected]>
nextcloud · Nov 23, 2023 · 82577ee · 82577ee
1 parent 3d814b0
commit 82577ee
Showing 1 changed file with 23 additions and 2 deletions.
diff --git a/core/src/views/GlobalSearchModal.vue b/core/src/views/GlobalSearchModal.vue
@@ -1,6 +1,6 @@
 <template>
-	<NcModal v-if="isVisible"
-		id="global-search"
+	<NcModal id="global-search"
+		ref="globalSearchModal"
 		:name="t('core', 'Global search')"
 		:show.sync="isVisible"
 		:clear-view-delay="0"
@@ -115,6 +115,14 @@
 					</div>
 				</div>
 			</div>
+			<div v-if="supportFiltering()" class="global-search-modal__results">
+				<NcButton @click="closeModal">
+					{{ t('core', 'Filter in current view') }}
+					<template #icon>
+						<FilterIcon :size="20" />
+					</template>
+				</NcButton>
+			</div>
 		</div>
 	</NcModal>
 </template>
@@ -125,6 +133,7 @@ import AccountGroup from 'vue-material-design-icons/AccountGroup.vue'
 import CalendarRangeIcon from 'vue-material-design-icons/CalendarRange.vue'
 import CustomDateRangeModal from '../components/GlobalSearch/CustomDateRangeModal.vue'
 import DotsHorizontalIcon from 'vue-material-design-icons/DotsHorizontal.vue'
+import FilterIcon from 'vue-material-design-icons/Filter.vue'
 import FilterChip from '../components/GlobalSearch/SearchFilterChip.vue'
 import FlaskEmpty from 'vue-material-design-icons/FlaskEmpty.vue'
 import ListBox from 'vue-material-design-icons/ListBox.vue'
@@ -140,6 +149,7 @@ import SearchableList from '../components/GlobalSearch/SearchableList.vue'
 import SearchResult from '../components/GlobalSearch/SearchResult.vue'
 
 import debounce from 'debounce'
+import { emit } from '@nextcloud/event-bus'
 import { getProviders, search as globalSearch, getContacts } from '../services/GlobalSearchService.js'
 
 export default {
@@ -150,6 +160,7 @@ export default {
 		CalendarRangeIcon,
 		CustomDateRangeModal,
 		DotsHorizontalIcon,
+		FilterIcon,
 		FilterChip,
 		FlaskEmpty,
 		ListBox,
@@ -227,6 +238,9 @@ export default {
 				this.results = []
 				return
 			}
+			if (this.supportFiltering()) {
+				emit('nextcloud:unified-search.search', { query })
+			}
 			const newResults = []
 			const providersToSearch = this.filteredProviders.length > 0 ? this.filteredProviders : this.providers
 			const searchProvider = (provider, filters) => {
@@ -490,8 +504,15 @@ export default {
 			this.updateDateFilter()
 		},
 		closeModal() {
+		    this.$refs.globalSearchModal.close()
 			this.searchQuery = ''
 		},
+		supportFiltering() {
+			const providerPaths = ['/settings/users', '/apps/files']
+			const currentPath = window.location.pathname.replace('/index.php', '')
+			const containsProvider = providerPaths.some(path => currentPath.includes(path))
+			return containsProvider
+		},
 	},
 }
 </script>