filter tags

main.js

@@ -104,6 +104,7 @@ class OrgTodoListView extends ItemView {
         input.addEventListener("input", () => {
             this.filterText = input.value.toLowerCase();
             this.renderList();
+            this.renderTagBar();
         });
 
         const toggleWrap = root.createDiv({ cls: "org-todo-toggle" });
@@ -120,8 +121,8 @@ class OrgTodoListView extends ItemView {
 
     async refresh() {
         this.tasks = await this.scanVault();
-        this.renderTagBar();
         this.renderList();
+        this.renderTagBar();
     }
 
     async scanFile(file) {
@@ -174,8 +175,8 @@ class OrgTodoListView extends ItemView {
     // Remove all tasks belonging to a given path, then re-render.
     removeFile(path) {
         this.tasks = this.tasks.filter((t) => t.file.path !== path);
-        this.renderTagBar();
         this.renderList();
+        this.renderTagBar();
     }
 
     // Rescan one file and splice its tasks in, replacing its previous entries.
@@ -184,21 +185,29 @@ class OrgTodoListView extends ItemView {
         const fresh = await this.scanFile(file);
         this.tasks = this.tasks.filter((t) => t.file.path !== file.path);
         for (const t of fresh) this.tasks.push(t);
-        this.renderTagBar();
         this.renderList();
+        this.renderTagBar();
     }
 
     renderTagBar() {
         this.tagBarEl.empty();
+
+        // Every tag in the vault — the chip bar is a stable, complete palette.
         const all = new Set();
         for (const t of this.tasks) t.tags.forEach((x) => all.add(x));
 
-        // Drop any active filters whose tag no longer exists anywhere.
+        // Prune active filters whose tag no longer exists (the ghost-filter fix).
         for (const tag of [...this.activeTags]) {
             if (!all.has(tag)) this.activeTags.delete(tag);
         }
 
-        const sorted = [...all].sort();
+        // Narrow the CHIPS by the text box. Strip a leading '#' the user may type,
+        // so "#wo" and "wo" both match. Active tags always show so they stay clickable.
+        const needle = this.filterText.replace(/^#/, "");
+        const sorted = [...all].sort().filter(
+            (tag) => !needle || tag.toLowerCase().includes(needle) || this.activeTags.has(tag)
+        );
+
         for (const tag of sorted) {
             const chip = this.tagBarEl.createEl("button", { text: "#" + tag });
             chip.addClass("org-todo-chip");
@@ -206,8 +215,8 @@ class OrgTodoListView extends ItemView {
             chip.addEventListener("click", () => {
                 if (this.activeTags.has(tag)) this.activeTags.delete(tag);
                 else this.activeTags.add(tag);
-                this.renderTagBar();
                 this.renderList();
+                this.renderTagBar();
             });
         }
     }