FEATURE: displays tags in search menu results when enabled (#7819)

FEATURE: displays tags in search menu results when enabled (#7819)

diff --git a/app/assets/javascripts/discourse/lib/render-tags.js.es6 b/app/assets/javascripts/discourse/lib/render-tags.js.es6
index b6a8a32..5553808 100644
--- a/app/assets/javascripts/discourse/lib/render-tags.js.es6
+++ b/app/assets/javascripts/discourse/lib/render-tags.js.es6
@@ -21,6 +21,7 @@ export default function(topic, params) {
   let tags = topic.tags;
   let buffer = "";
   let tagsForUser = null;
+  let tagName;
   const isPrivateMessage = topic.get("isPrivateMessage");
 
   if (params) {
@@ -30,6 +31,9 @@ export default function(topic, params) {
     if (params.tagsForUser) {
       tagsForUser = params.tagsForUser;
     }
+    if (params.tagName) {
+      tagName = params.tagName;
+    }
   }
 
   let customHtml = null;
@@ -50,7 +54,8 @@ export default function(topic, params) {
     buffer = "<div class='discourse-tags'>";
     if (tags) {
       for (let i = 0; i < tags.length; i++) {
-        buffer += renderTag(tags[i], { isPrivateMessage, tagsForUser }) + " ";
+        buffer +=
+          renderTag(tags[i], { isPrivateMessage, tagsForUser, tagName }) + " ";
       }
     }
 
diff --git a/app/assets/javascripts/discourse/widgets/discourse-tags.js.es6 b/app/assets/javascripts/discourse/widgets/discourse-tags.js.es6
new file mode 100644
index 0000000..55e7638
--- /dev/null
+++ b/app/assets/javascripts/discourse/widgets/discourse-tags.js.es6
@@ -0,0 +1,10 @@
+import RawHtml from "discourse/widgets/raw-html";
+import renderTags from "discourse/lib/render-tags";
+
+// Right now it's RawHTML. Eventually it should emit nodes
+export default class DiscourseTags extends RawHtml {
+  constructor(attrs) {
+    attrs.html = renderTags(attrs.topic, attrs);
+    super(attrs);
+  }
+}
diff --git a/app/assets/javascripts/discourse/widgets/search-menu-results.js.es6 b/app/assets/javascripts/discourse/widgets/search-menu-results.js.es6
index c65c34a..434b3c6 100644
--- a/app/assets/javascripts/discourse/widgets/search-menu-results.js.es6
+++ b/app/assets/javascripts/discourse/widgets/search-menu-results.js.es6
@@ -147,14 +147,23 @@ createSearchResult({
   linkField: "url",
   builder(result, term) {
     const topic = result.topic;
-    const link = h("span.topic", [
+
+    const linkContent = [
       this.attach("topic-status", { topic, disableActions: true }),
-      h("span.topic-title", new Highlighted(topic.get("fancyTitle"), term)),
+      h("span.topic-title", new Highlighted(topic.fancyTitle, term)),
       this.attach("category-link", {
-        category: topic.get("category"),
+        category: topic.category,
         link: false
       })
-    ]);
+    ];
+
+    if (Discourse.SiteSettings.tagging_enabled) {
+      linkContent.push(
+        this.attach("discourse-tags", { topic, tagName: "span" })
+      );
+    }
+
+    const link = h("span.topic", linkContent);
 
     return postResult.call(this, result, link, term);
   }
diff --git a/app/assets/stylesheets/common/base/menu-panel.scss b/app/assets/stylesheets/common/base/menu-panel.scss
index edb8a16..b0b8400 100644
--- a/app/assets/stylesheets/common/base/menu-panel.scss
+++ b/app/assets/stylesheets/common/base/menu-panel.scss
@@ -68,7 +68,7 @@
 .menu-panel {
   li,
   li.heading {
-    a {
+    a.widget-link {
       padding: 0.25em 0.5em;
       display: block;
       &:hover,
@@ -140,6 +140,10 @@
     overflow: hidden;
     text-overflow: ellipsis;
   }
+
+  div.discourse-tags {
+    font-size: $font-down-1;
+  }
 }
 
 .user-menu {
diff --git a/test/javascripts/acceptance/search-test.js.es6 b/test/javascripts/acceptance/search-test.js.es6
index f615441..a92a7c6 100644
--- a/test/javascripts/acceptance/search-test.js.es6
+++ b/test/javascripts/acceptance/search-test.js.es6
@@ -163,3 +163,27 @@ QUnit.test("Right filters are shown to logged-in users", async assert => {
   assert.ok(exists(".search-advanced-options .in-private"));
   assert.ok(exists(".search-advanced-options .in-seen"));
 });
+
+acceptance(
+  "Search - with tagging enabled",
+  Object.assign({
+    loggedIn: true,
+    searchArgs,
+    settings: { tagging_enabled: true }
+  })
+);
+
+QUnit.test("displays tags", async assert => {
+  await visit("/");
+
+  await click("#search-button");
+
+  await fillIn("#search-term", "dev");
+  await keyEvent("#search-term", "keyup", 16);
+
+  const tags = find(".search-menu .results ul li:eq(0) .discourse-tags")
+    .text()
+    .trim();
+
+  assert.equal(tags, "dev slow");
+});
diff --git a/test/javascripts/fixtures/search-fixtures.js.es6 b/test/javascripts/fixtures/search-fixtures.js.es6
index 60d179f..1f80714 100644
--- a/test/javascripts/fixtures/search-fixtures.js.es6
+++ b/test/javascripts/fixtures/search-fixtures.js.es6
@@ -1298,7 +1298,8 @@ export default {
         last_poster_username: null,
         category_id: 7,
         pinned_globally: false,
-        posters: []
+        posters: [],
+        tags: ["dev", "slow"]
       },
       {
         id: 14727,

GitHub sha: a61147d8

1 Like