Clicking on tag adds/removes tag in query params

assets/javascripts/discourse/components/knowledge-explorer-tag.js.es6

@@ -1,13 +1,18 @@
-import computed from "ember-addons/ember-computed-decorators";
-import DiscourseURL from "discourse/lib/url";
-
 export default Ember.Component.extend({
-  @computed("category", "tag")
-  href(category, tag) {
-    return "/knowledge-explorer";
-  },
-
   click() {
-    DiscourseURL.routeTo(this.href, { replaceURL: true });
+    const tag = this.get("tag");
+    let filter = this.get("filterTags");
+    if (filter && filter.includes(tag.id)) {
+      filter = filter.replace(tag.id, "");
+      filter = filter.replace("  ", " ");
+      filter = filter.replace(/^\s+|\s+$/g, "");
+    } else if (filter) {
+      filter = `${filter} ${tag.id}`;
+    } else {
+      filter = tag.id;
+    }
+
+    this.set("filterTags", filter);
+    this.send("refreshRoute");
   }
 });

assets/javascripts/discourse/templates/components/knowledge-explorer-tag-list.hbs

@@ -0,0 +1,6 @@
+{{#each tags as |tag|}}
+    {{knowledge-explorer-tag 
+      tag=tag
+      filterTags=filterTags
+    }}
+{{/each}}

assets/javascripts/discourse/templates/components/knowledge-explorer-tags.hbs

@@ -1,11 +0,0 @@
-{{#each tags as |tag|}}
-    {{knowledge-explorer-tag tag=tag}}
-{{/each}}
-
-{{#if subtags}}
-   {{#each subtags as |tag|}}
-     {{knowledge-explorer-tag
-       tag=tag
-       subtag=true}}
-   {{/each}}
-{{/if}}

assets/javascripts/discourse/templates/knowledge-explorer.hbs

@@ -1,7 +1,8 @@
 <div class="knowledge-explorer">
   <div class="knowledge-explorer-browse">
-    {{knowledge-explorer-tags
+    {{knowledge-explorer-tag-list
         tags=tags
+        filterTags=filterTags
         searchResults=searchResults}}
     {{knowledge-explorer-topic-list topics=topics}}
   </div>

assets/stylesheets/common/knowledge-explorer.scss

@@ -33,6 +33,9 @@
             color: $danger;
           }
         }
+        .tag-id {
+          margin-right: 3px;
+        }
       }
 
       .selected {