#70 - Added a "toggle context" setting + settings is now a Svelte store

A bit more verbose, but allows for proper reactivity

src/components/ModalVault.svelte

@@ -10,7 +10,8 @@
   import { OmnisearchInFileModal, type OmnisearchVaultModal } from 'src/modals'
   import ResultItemVault from './ResultItemVault.svelte'
   import { Query } from 'src/query'
-import { saveSearchHistory, searchHistory } from 'src/search-history'
+  import { saveSearchHistory, searchHistory } from 'src/search-history'
+  import { SearchContextType, settings } from 'src/settings'
 
   export let modal: OmnisearchVaultModal
   let selectedIndex = 0
@@ -28,6 +29,7 @@ import { saveSearchHistory, searchHistory } from 'src/search-history'
   }
 
   onMount(async () => {
+    console.log('mount')
     await reindexNotes()
     searchQuery = searchHistory[historySearchIndex]
     eventBus.enable('vault')
@@ -38,8 +40,9 @@ import { saveSearchHistory, searchHistory } from 'src/search-history'
     eventBus.on('vault', 'tab', switchToInFileModal)
     eventBus.on('vault', 'arrow-up', () => moveIndex(-1))
     eventBus.on('vault', 'arrow-down', () => moveIndex(1))
-    eventBus.on('vault', 'prev-search-history', () => prevSearchHistory())
-    eventBus.on('vault', 'next-search-history', () => nextSearchHistory())
+    eventBus.on('vault', 'prev-search-history', prevSearchHistory)
+    eventBus.on('vault', 'next-search-history', nextSearchHistory)
+    eventBus.on('vault', 'toggle-context', toggleContext)
   })
 
   onDestroy(() => {
@@ -59,6 +62,16 @@ import { saveSearchHistory, searchHistory } from 'src/search-history'
     searchQuery = searchHistory[historySearchIndex]
   }
 
+  function toggleContext() {
+    settings.update(s => {
+      s.showContext =
+        s.showContext === SearchContextType.None
+          ? SearchContextType.Simple
+          : SearchContextType.None
+      return s
+    })
+  }
+
   async function updateResults() {
     query = new Query(searchQuery)
     resultNotes = (await getSuggestions(query)).sort(
@@ -212,4 +225,10 @@ import { saveSearchHistory, searchHistory } from 'src/search-history'
   <div class="prompt-instruction">
     <span class="prompt-instruction-command">esc</span><span>to close</span>
   </div>
+  <br />
+
+  <div class="prompt-instruction">
+    <span class="prompt-instruction-command">ctrl+h</span><span
+      >to toggle context</span>
+  </div>
 </div>

src/components/ResultItemVault.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import { getNoteFromCache } from 'src/notes'
-  import { settings } from 'src/settings'
+  import { SearchContextType, settings } from 'src/settings'
   import type { ResultNote } from '../globals'
   import { getMatches } from '../search'
   import { highlighter, makeExcerpt, stringsToRegex } from '../utils'
@@ -13,7 +13,7 @@
   $: matches = getMatches(note.content, reg)
   $: cleanedContent = makeExcerpt(note.content, note.matches[0]?.offset ?? -1)
   $: glyph = getNoteFromCache(note.path)?.doesNotExist
-  $: title = settings.showShortName ? note.basename : note.path
+  $: title = $settings.showShortName ? note.basename : note.path
 </script>
 
 <ResultItemContainer id={note.path} {selected} on:mousemove on:click {glyph}>
@@ -28,7 +28,10 @@
       </span>
     {/if}
   </div>
-  <div class="omnisearch-result__body">
-    {@html cleanedContent.replace(reg, highlighter)}
-  </div>
+
+  {#if $settings.showContext !== SearchContextType.None}
+    <div class="omnisearch-result__body">
+      {@html cleanedContent.replace(reg, highlighter)}
+    </div>
+  {/if}
 </ResultItemContainer>