Merge pull request #40 from jillro/maud/saved_search

Saved search queries
jillro · Dec 23, 2024 · fd987e6 · fd987e6
2 parents 8b34a5c + a8de74b
commit fd987e6
Show file tree

Hide file tree

Showing 4 changed files with 66 additions and 30 deletions.
diff --git a/src/components/Root.svelte b/src/components/Root.svelte
@@ -5,7 +5,6 @@
 
   import Card from "./Card.svelte";
   import {
-    tags,
     displayedFiles,
     searchQuery,
     searchCaseSensitive,
@@ -27,6 +26,17 @@
     setIcon(element, "case-sensitive");
   };
 
+  const starIcon = (element: HTMLElement) => {
+    setIcon(element, "star");
+  };
+
+  function toggleSavedSearch(search: string) {
+    if (!search) return;
+    $settings.savedSearch = $settings.savedSearch?.includes(search)
+      ? $settings.savedSearch.filter((s) => s !== search)
+      : [...($settings.savedSearch || []), search];
+  }
+
   function sortMenu(event: MouseEvent) {
     const sortMenu = new Menu();
     sortMenu.addItem((item) => {
@@ -124,24 +134,42 @@
       <div
         class="input-right-decorator clickable-icon"
         class:is-active={$searchCaseSensitive}
+        role="checkbox"
         aria-label="Case sensitive search"
+        aria-checked={$searchCaseSensitive}
         use:caseSensitiveIcon
         onclick={() => ($searchCaseSensitive = !$searchCaseSensitive)}
-        role="button"
         tabindex="0"
-        onkeydown={(e) => {
+        onkeydown={(e: Event) => {
           e.stopPropagation();
           $searchCaseSensitive = !$searchCaseSensitive;
         }}
       ></div>
+      {#if $searchQuery}
+        <div
+          class="input-right-decorator clickable-icon"
+          class:is-active={$settings.savedSearch?.includes($searchQuery)}
+          role="checkbox"
+          aria-label="Save search"
+          aria-checked={$settings.savedSearch?.includes($searchQuery)}
+          use:starIcon
+          onclick={() => toggleSavedSearch($searchQuery)}
+          tabindex="0"
+          onkeydown={(e: Event) => {
+            e.stopPropagation();
+            toggleSavedSearch($searchQuery);
+          }}
+          style="transform: translateY(-50%) translateX(-100%)"
+        ></div>
+      {/if}
     </div>
   </div>
   <div class="action-bar__tags">
     <div class="action-bar__tags__list">
-      {#each $tags as tag}
+      {#each $settings.savedSearch || [] as savedSearch}
         <button
           class="action-bar__tag"
-          onclick={() => ($searchQuery = `tag:${tag}`)}>{tag}</button
+          onclick={() => ($searchQuery = savedSearch)}>{savedSearch}</button
         >
       {/each}
     </div>

diff --git a/src/components/store.ts b/src/components/store.ts
@@ -85,7 +85,7 @@ export const searchResultFiles = derived(
       if ($searchFilter !== get(searchFilter)) {
         return;
       }
-      set($sortedFiles.filter((file, index) => searchResults[index]));
+      set($sortedFiles.filter((_, index) => searchResults[index]));
     });
   },
   get(sortedFiles),
@@ -101,28 +101,6 @@ export const displayedFiles = derived(
 export const viewIsVisible = writable(false);
 export const skipNextTransition = writable(true);
 
-export const tags = derived(
-  [displayedFiles, appCache],
-  ([$displayedFiles, $appCache]) => {
-    const tags = $displayedFiles
-      .map(
-        (file) =>
-          getAllTags($appCache.getFileCache(file) as CachedMetadata) || [],
-      )
-      .flat();
-
-    const tagCounts = tags.reduce(
-      (acc, tag) => {
-        acc[tag] = (acc[tag] || 0) + 1;
-        return acc;
-      },
-      {} as Record<string, number>,
-    );
-
-    return Object.keys(tagCounts).sort((a, b) => tagCounts[b] - tagCounts[a]);
-  },
-);
-
 export default {
   files,
   sort,
@@ -133,7 +111,6 @@ export default {
   displayedFiles,
   viewIsVisible,
   skipNextTransition,
-  tags,
   app,
   view,
   settings,

diff --git a/src/main.ts b/src/main.ts
@@ -1,4 +1,9 @@
-import { Plugin, WorkspaceLeaf } from "obsidian";
+import {
+  type CachedMetadata,
+  getAllTags,
+  Plugin,
+  WorkspaceLeaf,
+} from "obsidian";
 
 import {
   type CardsViewSettings,
@@ -12,6 +17,9 @@ export default class CardsViewPlugin extends Plugin {
   settings: CardsViewSettings = Object.assign({}, DEFAULT_SETTINGS);
   async onload() {
     this.settings = Object.assign(this.settings, await this.loadData());
+    if (!this.settings.savedSearch) {
+      this.settings.savedSearch = await this.getTags();
+    }
     store.settings.subscribe(async () => await this.saveSettings());
     store.app.set(this.app);
     store.settings.set(this.settings);
@@ -69,4 +77,26 @@ export default class CardsViewPlugin extends Plugin {
   async saveSettings() {
     await this.saveData(this.settings);
   }
+
+  async getTags() {
+    const tags = this.app.vault
+      .getMarkdownFiles()
+      .map(
+        (file) =>
+          getAllTags(
+            this.app.metadataCache.getFileCache(file) as CachedMetadata,
+          ) || [],
+      )
+      .flat();
+
+    const tagCounts = tags.reduce(
+      (acc, tag) => {
+        acc[tag] = (acc[tag] || 0) + 1;
+        return acc;
+      },
+      {} as Record<string, number>,
+    );
+
+    return Object.keys(tagCounts).sort((a, b) => tagCounts[b] - tagCounts[a]);
+  }
 }
diff --git a/src/settings.ts b/src/settings.ts
@@ -14,6 +14,7 @@ export interface CardsViewSettings {
   launchOnStart: boolean;
   displayTitle: TitleDisplayMode;
   pinnedFiles: string[];
+  savedSearch?: string[];
 }
 
 export const DEFAULT_SETTINGS: CardsViewSettings = {