feat: add fuzzy search

antonreshetov · web-flow · commit a0eba0ac8933 · 2024-01-20T16:17:12.000+03:00
diff --git a/package.json b/package.json
@@ -56,6 +56,7 @@
     "electron-store": "^8.0.1",
     "floating-vue": "^2.0.0-beta.17",
     "fs-extra": "^10.0.1",
+    "fuse.js": "^7.0.0",
     "highlight.js": "^11.5.1",
     "i18next": "^21.8.14",
     "i18next-fs-backend": "^1.1.4",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/src/renderer/components/editor/EditorCodemirror.vue b/src/renderer/components/editor/EditorCodemirror.vue
@@ -189,8 +189,8 @@ const init = async () => {
     }
   })
 
-  if (snippetStore.searchQuery) {
-    findAll(snippetStore.searchQuery)
+  if (snippetStore.searchQueryEscaped) {
+    findAll(snippetStore.searchQueryEscaped)
   }
 }
 
@@ -303,8 +303,8 @@ watch(
   () => {
     setValue(props.modelValue)
 
-    if (snippetStore.searchQuery) {
-      findAll(snippetStore.searchQuery)
+    if (snippetStore.searchQueryEscaped) {
+      findAll(snippetStore.searchQueryEscaped)
     }
 
     clearHistory()
@@ -319,7 +319,7 @@ watch(
 )
 
 watch(
-  () => snippetStore.searchQuery,
+  () => snippetStore.searchQueryEscaped,
   v => {
     if (v) {
       findAll(v)
diff --git a/src/renderer/store/snippets.ts b/src/renderer/store/snippets.ts
@@ -17,7 +17,7 @@ import type {
 } from '@shared/types/renderer/store/snippets'
 import { useTagStore } from './tags'
 import { useAppStore } from './app'
-import { uniqBy } from 'lodash'
+import Fuse from 'fuse.js'
 
 export const useSnippetStore = defineStore('snippets', {
   state: (): State => ({
@@ -27,6 +27,7 @@ export const useSnippetStore = defineStore('snippets', {
     selectedMultiple: [],
     fragment: 0,
     searchQuery: undefined,
+    searchQueryEscaped: undefined,
     sort: 'updatedAt',
     hideSubfolderSnippets: false,
     compactMode: false,
@@ -304,17 +305,33 @@ export const useSnippetStore = defineStore('snippets', {
       await this.deleteSnippetsByIds(ids)
     },
     search (query: string) {
-      const byName = this.all.filter(i =>
-        i.name.toLowerCase().includes(query.toLowerCase())
-      )
+      let q = query
+      let isExactSearch = false
 
-      const byContent = this.all.filter(i => {
-        return i.content.some(c =>
-          c.value.toLowerCase().includes(query.toLowerCase())
-        )
+      // обрезка кавычек для точного поиска
+      if (query.startsWith('"') && query.endsWith('"')) {
+        isExactSearch = true
+        q = query.slice(1, -1)
+      }
+
+      this.searchQueryEscaped = q
+
+      if (!q) {
+        this.setSnippetsByAlias('all')
+        this.searchQueryEscaped = undefined
+        return
+      }
+
+      const fuse = new Fuse(this.all, {
+        includeScore: true,
+        threshold: isExactSearch ? 0 : 0.4,
+        ignoreLocation: true,
+        keys: ['name', 'content.value']
       })
 
-      this.snippets = uniqBy([...byName, ...byContent], 'id')
+      const result = fuse.search(q)
+
+      this.snippets = result.map(i => i.item)
       this.selected = this.snippets[0]
     },
     setSort (sort: SnippetsSort) {
diff --git a/src/shared/types/renderer/store/snippets.d.ts b/src/shared/types/renderer/store/snippets.d.ts
@@ -11,6 +11,7 @@ export interface State {
   selectedMultiple: Snippet[]
   fragment: number
   searchQuery?: string
+  searchQueryEscaped?: string
   sort: SnippetsSort
   hideSubfolderSnippets: boolean
   compactMode: boolean

Original file line number	Diff line number	Diff line change
`@@ -189,8 +189,8 @@ const init = async () => {`
`189`	`189`	`}`
`190`	`190`	`})`
`191`	`191`
`192`		`- if (snippetStore.searchQuery) {`
`193`		`- findAll(snippetStore.searchQuery)`
	`192`	`+ if (snippetStore.searchQueryEscaped) {`
	`193`	`+ findAll(snippetStore.searchQueryEscaped)`
`194`	`194`	`}`
`195`	`195`	`}`
`196`	`196`
`@@ -303,8 +303,8 @@ watch(`
`303`	`303`	`() => {`
`304`	`304`	`setValue(props.modelValue)`
`305`	`305`
`306`		`- if (snippetStore.searchQuery) {`
`307`		`- findAll(snippetStore.searchQuery)`
	`306`	`+ if (snippetStore.searchQueryEscaped) {`
	`307`	`+ findAll(snippetStore.searchQueryEscaped)`
`308`	`308`	`}`
`309`	`309`
`310`	`310`	`clearHistory()`
`@@ -319,7 +319,7 @@ watch(`
`319`	`319`	`)`
`320`	`320`
`321`	`321`	`watch(`
`322`		`- () => snippetStore.searchQuery,`
	`322`	`+ () => snippetStore.searchQueryEscaped,`
`323`	`323`	`v => {`
`324`	`324`	`if (v) {`
`325`	`325`	`findAll(v)`