enh(Search): Allow searching globally with one click

Signed-off-by: Marcel Klehr <mklehr@gmx.net>
This commit is contained in:
Marcel Klehr 2024-02-04 14:00:38 +01:00
parent 25df6da4d7
commit 3a4b1e6248
3 changed files with 44 additions and 6 deletions

View File

@ -7,7 +7,8 @@
<template>
<div :class="{
bookmarkslist: true,
'bookmarkslist--gridview': viewMode === 'grid'
'bookmarkslist--gridview': viewMode === 'grid',
'bookmarkslist--with-description': descriptionShown,
}">
<div v-if="$route.name === routes.ARCHIVED && bookmarks.length" class="bookmarkslist__description">
<NcNoteCard type="info">
@ -16,6 +17,19 @@
}}
</NcNoteCard>
</div>
<div v-if="$route.name === routes.SEARCH && (bookmarks.length || subFolders.length) && Number($route.params.folder) !== -1" class="bookmarkslist__description">
<NcNoteCard type="info">
{{
t('bookmarks', 'Searching in the current folder only.')
}}
<NcButton @click="onSearchGlobally">
<template #icon>
<MagnifyIcon :size="20" />
</template>
{{ t('bookmarks', 'Repeat search in all folders') }}
</NcButton>
</NcNoteCard>
</div>
<div v-if="$route.name === routes.UNAVAILABLE && bookmarks.length" class="bookmarkslist__description">
<NcNoteCard type="info">
{{
@ -82,7 +96,7 @@
</template>
<script>
import { NcNoteCard } from '@nextcloud/vue'
import { NcButton, NcNoteCard } from '@nextcloud/vue'
import Bookmark from './Bookmark.vue'
import Folder from './Folder.vue'
import CreateBookmark from './CreateBookmark.vue'
@ -92,10 +106,12 @@ import NoBookmarks from './NoBookmarks.vue'
import FirstRun from './FirstRun.vue'
import VirtualScroll from './VirtualScroll.vue'
import { privateRoutes } from '../router.js'
import { MagnifyIcon } from './Icons.js'
export default {
name: 'BookmarksList',
components: {
NcButton,
CreateFolder,
CreateBookmark,
VirtualScroll,
@ -104,6 +120,7 @@ export default {
Bookmark,
Folder,
NcNoteCard,
MagnifyIcon
},
computed: {
bookmarks() {
@ -112,6 +129,9 @@ export default {
reachedEnd() {
return this.$store.state.fetchState.reachedEnd
},
descriptionShown() {
return this.$route.name === this.routes.ARCHIVED || (this.$route.name === this.routes.SEARCH && Number(this.$route.params.folder) !== -1) || this.$route.name === this.routes.UNAVAILABLE || this.$route.name === this.routes.SHARED_FOLDERS || this. $route.name === this.routes.DUPLICATED
},
allBookmarksCount() {
return this.$store.state.countsByFolder[-1]
},
@ -133,7 +153,7 @@ export default {
// Search folders
const searchFolder = (folder) => {
const results = folder.children.flatMap(searchFolder)
if (this.$store.state.fetchState.query.search.some(term => term.trim() && folder.title.toLowerCase().includes(term.toLowerCase()))) {
if (this.$store.state.fetchState.query.search.every(term => term.trim() && folder.title.toLowerCase().includes(term.toLowerCase()))) {
results.push(folder)
}
return results
@ -180,6 +200,9 @@ export default {
getBookmark(id) {
return this.$store.getters.getBookmark(id)
},
onSearchGlobally() {
this.$router.push({ name: this.routes.SEARCH, params: { search: this.$route.params.search, folder: '-1' } })
},
},
}
</script>

View File

@ -17,7 +17,15 @@
:name="t('bookmarks', 'Nothing found')"
:description="t('bookmarks', 'Your search yielded no results in the current folder.')">
<template #icon>
<StarShootingIcon :size="20" />
<StarShootingIcon />
</template>
<template v-if="Number($route.params.folder) !== -1" #action>
<NcButton @click="onSearchGlobally">
<template #icon>
<MagnifyIcon :size="20" />
</template>
{{ t('bookmarks', 'Repeat search in all folders') }}
</NcButton>
</template>
</NcEmptyContent>
<NcEmptyContent v-else-if="$route.name === routes.UNAVAILABLE"
@ -75,11 +83,11 @@
import { NcEmptyContent, NcButton, NcLoadingIcon } from '@nextcloud/vue'
import { actions, mutations } from '../store/index.js'
import { privateRoutes } from '../router.js'
import { StarShootingIcon, UploadIcon, PlusIcon, ShareVariantIcon, VectorLinkIcon, LinkVariantOffIcon, FileDocumentMultipleIcon } from './Icons.js'
import { StarShootingIcon, UploadIcon, PlusIcon, ShareVariantIcon, VectorLinkIcon, LinkVariantOffIcon, FileDocumentMultipleIcon, MagnifyIcon } from './Icons.js'
export default {
name: 'NoBookmarks',
components: { NcEmptyContent, StarShootingIcon, NcButton, NcLoadingIcon, UploadIcon, PlusIcon, ShareVariantIcon, VectorLinkIcon, LinkVariantOffIcon, FileDocumentMultipleIcon },
components: { NcEmptyContent, StarShootingIcon, NcButton, NcLoadingIcon, UploadIcon, PlusIcon, ShareVariantIcon, VectorLinkIcon, LinkVariantOffIcon, FileDocumentMultipleIcon, MagnifyIcon },
data() {
return { importing: false }
},
@ -104,6 +112,9 @@ export default {
}
this.importing = false
},
onSearchGlobally() {
this.$router.push({ name: this.routes.SEARCH, params: { search: this.$route.params.search, folder: '-1' } })
},
},
}
</script>

View File

@ -134,6 +134,10 @@ export default {
overflow-y: scroll;
}
.bookmarkslist--with-description .virtual-scroll {
height: calc(100vh - 50px - 50px - 130px);
}
.bookmarkslist--gridview .container-window {
display: flex;
flex-direction: row;