#104 - Refactored search history to use IndexedDB

src/cache-manager.ts

@@ -1,9 +1,39 @@
 import type { TFile } from 'obsidian'
 import type { IndexedDocument } from './globals'
+import { database } from './database'
 
 class CacheManager {
   private documentsCache: Map<string, IndexedDocument> = new Map()
-  private writeInterval = 10_000 // In milliseconds
+  /**
+   * Show an empty input field next time the user opens Omnisearch modal
+   */
+  private nextQueryIsEmpty = true
+
+  public async addToSearchHistory(query: string): Promise<void> {
+    if (!query) {
+      this.nextQueryIsEmpty = true
+      return
+    }
+    this.nextQueryIsEmpty = false
+    let history = await database.searchHistory.toArray()
+    history = history.filter(s => s.query !== query).reverse()
+    history.unshift({ query })
+    history = history.slice(0, 10)
+    await database.searchHistory.clear()
+    await database.searchHistory.bulkAdd(history)
+  }
+
+  public async getSearchHistory(): Promise<ReadonlyArray<string>> {
+    const data = (await database.searchHistory.toArray())
+      .reverse()
+      .map(o => o.query)
+    console.log(this.nextQueryIsEmpty)
+    if (this.nextQueryIsEmpty) {
+      data.unshift('')
+    }
+    console.log(data)
+    return data
+  }
 
   public async updateDocument(path: string, note: IndexedDocument) {
     this.documentsCache.set(path, note)

src/components/InputSearch.svelte

@@ -2,6 +2,7 @@
   import { debounce } from 'obsidian'
   import { toggleInputComposition } from 'src/globals'
   import { createEventDispatcher, tick } from 'svelte'
+  import { cacheManager } from "../cache-manager"
 
   export let initialValue = ''
   export let placeholder = ''
@@ -24,22 +25,25 @@
   }
 
   const debouncedOnInput = debounce(() => {
+    // If typing a query and not executing it,
+    // the next time we open the modal, the search field will be empty
+    cacheManager.addToSearchHistory('')
     dispatch('input', value)
-  }, 250)
+  }, 200)
 </script>
 
 <div class="omnisearch-input-container">
   <div class="omnisearch-input-field">
     <input
-      bind:value
       bind:this="{elInput}"
-      on:input="{debouncedOnInput}"
-      on:compositionstart="{_ => toggleInputComposition(true)}"
-      on:compositionend="{_ => toggleInputComposition(false)}"
-      type="text"
+      bind:value
       class="prompt-input"
+      on:compositionend="{_ => toggleInputComposition(false)}"
+      on:compositionstart="{_ => toggleInputComposition(true)}"
+      on:input="{debouncedOnInput}"
       {placeholder}
-      spellcheck="false"/>
+      spellcheck="false"
+      type="text"/>
   </div>
   <slot></slot>
 </div>

src/components/ModalInFile.svelte

@@ -1,4 +1,4 @@
-<script lang="ts" context="module">
+<script context="module" lang="ts">
   let lastSearch = ''
 </script>
 
@@ -19,7 +19,6 @@
   import ResultItemInFile from './ResultItemInFile.svelte'
   import { Query } from 'src/search/query'
   import { openNote } from 'src/tools/notes'
-  import { saveSearchHistory } from '../search/search-history'
 
   export let modal: OmnisearchInFileModal
   export let parent: OmnisearchVaultModal | null = null
@@ -50,11 +49,11 @@
   $: (async () => {
     if (searchQuery) {
       query = new Query(searchQuery)
-      note = (await Search.getSuggestions(query, { singleFilePath }))[0] ?? null
+      note = (await Search.getSuggestions(query, {singleFilePath}))[0] ?? null
       lastSearch = searchQuery
     }
     selectedIndex = 0
-    scrollIntoView()
+    await scrollIntoView()
   })()
 
   $: {
@@ -105,14 +104,13 @@
   async function scrollIntoView(): Promise<void> {
     await tick()
     const elem = document.querySelector(`[data-result-id="${selectedIndex}"]`)
-    elem?.scrollIntoView({ behavior: 'auto', block: 'nearest' })
+    elem?.scrollIntoView({behavior: 'auto', block: 'nearest'})
   }
 
   async function openSelection(
     evt?: MouseEvent | KeyboardEvent
   ): Promise<void> {
     if (note) {
-      await saveSearchHistory()
       modal.close()
       if (parent) parent.close()
 
@@ -132,8 +130,8 @@
       pos.ch = 0
       view.editor.setCursor(pos)
       view.editor.scrollIntoView({
-        from: { line: pos.line - 10, ch: 0 },
-        to: { line: pos.line + 10, ch: 0 },
+        from: {line: pos.line - 10, ch: 0},
+        to: {line: pos.line + 10, ch: 0},
       })
     }
   }
@@ -145,9 +143,9 @@
 </script>
 
 <InputSearch
-  value="{searchQuery}"
   on:input="{e => (searchQuery = e.detail)}"
-  placeholder="Omnisearch - File" />
+  placeholder="Omnisearch - File"
+  value="{searchQuery}"/>
 
 <ModalContainer>
   {#if groupedOffsets.length && note}
@@ -158,7 +156,7 @@
         index="{i}"
         selected="{i === selectedIndex}"
         on:mousemove="{_e => (selectedIndex = i)}"
-        on:click="{openSelection}" />
+        on:click="{openSelection}"/>
     {/each}
   {:else}
     <div style="text-align: center;">

src/components/ModalVault.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import { MarkdownView, Notice, TFile } from 'obsidian'
-  import { onMount, onDestroy, tick } from 'svelte'
+  import { onDestroy, onMount, tick } from 'svelte'
   import InputSearch from './InputSearch.svelte'
   import ModalContainer from './ModalContainer.svelte'
   import { eventBus, type ResultNote } from 'src/globals'
@@ -10,9 +10,9 @@
   import { OmnisearchInFileModal, type OmnisearchVaultModal } from 'src/components/modals'
   import ResultItemVault from './ResultItemVault.svelte'
   import { Query } from 'src/search/query'
-  import { saveSearchHistory, searchHistory } from 'src/search/search-history'
   import { settings } from '../settings'
   import * as NotesIndex from '../notes-index'
+  import { cacheManager } from "../cache-manager"
 
   export let modal: OmnisearchVaultModal
   let selectedIndex = 0
@@ -21,8 +21,9 @@
   let previousQuery: string
   let resultNotes: ResultNote[] = []
   let query: Query
-  $: selectedNote = resultNotes[selectedIndex]
 
+  $: selectedNote = resultNotes[selectedIndex]
+  $: searchQuery = previousQuery
   $: if (searchQuery) {
     updateResults()
   } else {
@@ -31,8 +32,7 @@
 
   onMount(async () => {
     await NotesIndex.refreshIndex()
-    previousQuery = searchHistory[historySearchIndex]
-    searchQuery = previousQuery
+    previousQuery = (await cacheManager.getSearchHistory())[historySearchIndex]
     eventBus.enable('vault')
     eventBus.on('vault', 'enter', openNoteAndCloseModal)
     eventBus.on('vault', 'create-note', createNoteAndCloseModal)
@@ -49,18 +49,21 @@
     eventBus.disable('vault')
   })
 
-  function prevSearchHistory() {
-    if (++historySearchIndex >= searchHistory.length) {
+  async function prevSearchHistory() {
+    // Filter out the empty string, if it's there
+    const history = (await cacheManager.getSearchHistory()).filter(s => s)
+    if (++historySearchIndex >= history.length) {
       historySearchIndex = 0
     }
-    searchQuery = searchHistory[historySearchIndex]
+    previousQuery = history[historySearchIndex]
   }
 
-  function nextSearchHistory() {
+  async function nextSearchHistory() {
+    const history = (await cacheManager.getSearchHistory()).filter(s => s)
     if (--historySearchIndex < 0) {
-      historySearchIndex = searchHistory.length ? searchHistory.length - 1 : 0
+      historySearchIndex = history.length ? history.length - 1 : 0
     }
-    searchQuery = searchHistory[historySearchIndex]
+    previousQuery = history[historySearchIndex]
   }
 
   async function updateResults() {
@@ -91,12 +94,11 @@
   }
 
   function saveCurrentQuery() {
-    searchHistory.unshift(searchQuery)
+    cacheManager.addToSearchHistory(searchQuery)
   }
 
   function openSearchResult(note: ResultNote, newPane = false) {
     saveCurrentQuery()
-    saveSearchHistory()
     openNote(note, newPane)
   }
 
@@ -177,7 +179,7 @@
       const elem = document.querySelector(
         `[data-result-id="${selectedNote.path}"]`
       )
-      elem?.scrollIntoView({ behavior: 'auto', block: 'nearest' })
+      elem?.scrollIntoView({behavior: 'auto', block: 'nearest'})
     }
   }
 </script>
@@ -197,7 +199,7 @@
       selected="{i === selectedIndex}"
       note="{result}"
       on:mousemove="{_ => (selectedIndex = i)}"
-      on:click="{onClick}" />
+      on:click="{onClick}"/>
   {/each}
   {#if !resultNotes.length && searchQuery}
     <div style="text-align: center;">
@@ -222,7 +224,7 @@
     <span>to switch to In-File Search</span>
   </div>
 
-  <br />
+  <br/>
 
   <div class="prompt-instruction">
     <span class="prompt-instruction-command">{getCtrlKeyLabel()} ↵</span>
@@ -237,7 +239,7 @@
     <span>to create in a new pane</span>
   </div>
 
-  <br />
+  <br/>
 
   <div class="prompt-instruction">
     <span class="prompt-instruction-command">alt ↵</span>

src/database.ts

@@ -6,18 +6,13 @@ class OmnisearchCache extends Dexie {
     { path: string; hash: string; size: number; text: string },
     string
   >
-  documents!: Dexie.Table<
-    { document: IndexedDocument; path: string; mtime: number },
-    string
-  >
-  minisearch!: Dexie.Table<string>
+  searchHistory!: Dexie.Table<{ id?: number; query: string }, number>
 
   constructor() {
     super(app.appId + '_omnisearch')
-    this.version(2).stores({
+    this.version(3).stores({
       pdf: 'path, hash, size, text',
-      documents: 'path, mtime, document',
-      minisearch: 'data',
+      searchHistory: '++id, query',
     })
   }
 }

src/file-loader.ts

@@ -39,7 +39,7 @@ export async function getPDFFiles(): Promise<IndexedDocument[]> {
     input.push(
       NotesIndex.processQueue(async () => {
         const doc = await fileToIndexedDocument(file)
-        cacheManager.updateDocument(file.path, doc)
+        await cacheManager.updateDocument(file.path, doc)
         data.push(doc)
       })
     )

src/globals.ts

@@ -12,8 +12,6 @@ export const highlightClass = 'suggestion-highlight omnisearch-highlight'
 
 export const eventBus = new EventBus()
 
-export const historyFilePath = `${app.vault.configDir}/plugins/omnisearch/historyCache.json`
-
 export const EventNames = {
   ToggleExcerpts: 'toggle-excerpts',
 } as const

src/main.ts

@@ -8,7 +8,6 @@ import { loadSettings, settings, SettingsTab, showExcerpt } from './settings'
 import { eventBus, EventNames } from './globals'
 import { registerAPI } from '@vanakat/plugin-api'
 import api from './tools/api'
-import { loadSearchHistory } from './search/search-history'
 import { isFilePlaintext } from './tools/utils'
 import * as NotesIndex from './notes-index'
 import * as FileLoader from './file-loader'
@@ -17,7 +16,6 @@ export default class OmnisearchPlugin extends Plugin {
   async onload(): Promise<void> {
     await cleanOldCacheFiles()
     await loadSettings(this)
-    await loadSearchHistory()
 
     // Initialize minisearch
     await Search.initSearchEngine()
@@ -125,6 +123,7 @@ async function cleanOldCacheFiles() {
     `${app.vault.configDir}/plugins/omnisearch/notesCache.json`,
     `${app.vault.configDir}/plugins/omnisearch/notesCache.data`,
     `${app.vault.configDir}/plugins/omnisearch/searchIndex.data`,
+    `${app.vault.configDir}/plugins/omnisearch/historyCache.json`,
     `${app.vault.configDir}/plugins/omnisearch/pdfCache.data`,
   ]
   for (const item of toDelete) {

src/search/search-history.ts

@@ -1,23 +0,0 @@
-import { historyFilePath } from '../globals'
-
-export let searchHistory: string[] = []
-
-export async function loadSearchHistory(): Promise<void> {
-  if (await app.vault.adapter.exists(historyFilePath)) {
-    try {
-      searchHistory = JSON.parse(await app.vault.adapter.read(historyFilePath))
-      // Keep the last 100 searches
-      searchHistory = searchHistory.slice(0, 100)
-    } catch (e) {
-      console.trace('Could not load search history from the file')
-      console.error(e)
-      searchHistory = []
-    }
-  } else {
-    searchHistory = []
-  }
-}
-
-export async function saveSearchHistory(): Promise<void> {
-  await app.vault.adapter.write(historyFilePath, JSON.stringify(searchHistory))
-}