FEATURE: Add descriptions on hover for hashtag search results (#19162)

Adds the description as a title="" attribute on the hashtag
autocomplete search items for tags, categories, and channels.
These descriptions can be seen by the user since they are
able to see the results that are returned by the search via
Guardian checks.

app/assets/javascripts/discourse/app/templates/hashtag-autocomplete.hbr

@@ -2,7 +2,7 @@
   <ul>
     {{#each options as |option|}}
       <li class="hashtag-autocomplete__option">
-        <a class="hashtag-autocomplete__link" href>{{d-icon option.icon}}<span class="hashtag-autocomplete__text">{{option.text}}</span></a>
+        <a class="hashtag-autocomplete__link" title="{{option.description}}" href>{{d-icon option.icon}}<span class="hashtag-autocomplete__text">{{option.text}}</span></a>
       </li>
     {{/each}}
   </ul>

app/services/category_hashtag_data_source.rb

@@ -9,11 +9,13 @@ class CategoryHashtagDataSource
   end
 
   def self.category_to_hashtag_item(guardian_categories, category)
-    category = Category.new(category.slice(:id, :slug, :name, :parent_category_id))
+    category =
+      Category.new(category.slice(:id, :slug, :name, :parent_category_id, :description))
 
     HashtagAutocompleteService::HashtagItem.new.tap do |item|
       item.text = category.name
       item.slug = category.slug
+      item.description = category.description_text
       item.icon = icon
       item.relative_url = category.url
 

app/services/hashtag_autocomplete_service.rb

@@ -46,6 +46,10 @@ class HashtagAutocompleteService
     # The text to display in the UI autocomplete menu for the item.
     attr_accessor :text
 
+    # The description text to display in the UI autocomplete menu on hover.
+    # This will be things like e.g. category description.
+    attr_accessor :description
+
     # Canonical slug for the item. Different from the ref, which can
     # have the type as a suffix to distinguish between conflicts.
     attr_accessor :slug
@@ -69,6 +73,7 @@ class HashtagAutocompleteService
       {
         relative_url: self.relative_url,
         text: self.text,
+        description: self.description,
         icon: self.icon,
         type: self.type,
         ref: self.ref,

app/services/tag_hashtag_data_source.rb

@@ -9,7 +9,9 @@ class TagHashtagDataSource
   end
 
   def self.tag_to_hashtag_item(tag, include_count: false)
-    tag = Tag.new(tag.slice(:id, :name).merge(topic_count: tag[:count])) if tag.is_a?(Hash)
+    tag = Tag.new(tag.slice(:id, :name, :description).merge(topic_count: tag[:count])) if tag.is_a?(
+      Hash,
+    )
 
     HashtagAutocompleteService::HashtagItem.new.tap do |item|
       if include_count
@@ -17,6 +19,7 @@ class TagHashtagDataSource
       else
         item.text = tag.name
       end
+      item.description = tag.description
       item.slug = tag.name
       item.relative_url = tag.url
       item.icon = icon

plugins/chat/lib/chat_channel_hashtag_data_source.rb

@@ -8,6 +8,7 @@ class Chat::ChatChannelHashtagDataSource
   def self.channel_to_hashtag_item(guardian, channel)
     HashtagAutocompleteService::HashtagItem.new.tap do |item|
       item.text = channel.title(guardian.user)
+      item.description = channel.description
       item.slug = channel.slug
       item.icon = icon
       item.relative_url = channel.relative_url

plugins/chat/spec/lib/chat_channel_hashtag_data_source_spec.rb

@@ -5,7 +5,7 @@ RSpec.describe Chat::ChatChannelHashtagDataSource do
   fab!(:category) { Fabricate(:category) }
   fab!(:group) { Fabricate(:group) }
   fab!(:private_category) { Fabricate(:private_category, group: group) }
-  fab!(:channel1) { Fabricate(:chat_channel, slug: "random", name: "Zany Things", chatable: category) }
+  fab!(:channel1) { Fabricate(:chat_channel, slug: "random", name: "Zany Things", chatable: category, description: "Just weird stuff") }
   fab!(:channel2) do
     Fabricate(:chat_channel, slug: "secret", name: "Secret Stuff", chatable: private_category)
   end
@@ -20,6 +20,7 @@ RSpec.describe Chat::ChatChannelHashtagDataSource do
         {
           relative_url: channel1.relative_url,
           text: "Zany Things",
+          description: "Just weird stuff",
           icon: "comment",
           type: "channel",
           ref: nil,
@@ -38,6 +39,7 @@ RSpec.describe Chat::ChatChannelHashtagDataSource do
         {
           relative_url: channel2.relative_url,
           text: "Secret Stuff",
+          description: nil,
           icon: "comment",
           type: "channel",
           ref: nil,
@@ -60,6 +62,7 @@ RSpec.describe Chat::ChatChannelHashtagDataSource do
         {
           relative_url: channel1.relative_url,
           text: "Zany Things",
+          description: "Just weird stuff",
           icon: "comment",
           type: "channel",
           ref: nil,
@@ -74,6 +77,7 @@ RSpec.describe Chat::ChatChannelHashtagDataSource do
         {
           relative_url: channel1.relative_url,
           text: "Zany Things",
+          description: "Just weird stuff",
           icon: "comment",
           type: "channel",
           ref: nil,
@@ -88,6 +92,7 @@ RSpec.describe Chat::ChatChannelHashtagDataSource do
         {
           relative_url: channel1.relative_url,
           text: "Zany Things",
+          description: "Just weird stuff",
           icon: "comment",
           type: "channel",
           ref: nil,
@@ -105,6 +110,7 @@ RSpec.describe Chat::ChatChannelHashtagDataSource do
         {
           relative_url: channel2.relative_url,
           text: "Secret Stuff",
+          description: nil,
           icon: "comment",
           type: "channel",
           ref: nil,

spec/lib/pretty_text/helpers_spec.rb

@@ -48,9 +48,9 @@ RSpec.describe PrettyText::Helpers do
   end
 
   describe ".hashtag_lookup" do
-    fab!(:tag) { Fabricate(:tag, name: "somecooltag") }
+    fab!(:tag) { Fabricate(:tag, name: "somecooltag", description: "Coolest things ever") }
     fab!(:category) do
-      Fabricate(:category, name: "Some Awesome Category", slug: "someawesomecategory")
+      Fabricate(:category, name: "Some Awesome Category", slug: "someawesomecategory", description: "Really great stuff here")
     end
     fab!(:user) { Fabricate(:user) }
 
@@ -59,6 +59,7 @@ RSpec.describe PrettyText::Helpers do
         {
           relative_url: tag.url,
           text: "somecooltag",
+          description: "Coolest things ever",
           icon: "tag",
           slug: "somecooltag",
           ref: "somecooltag",
@@ -69,6 +70,7 @@ RSpec.describe PrettyText::Helpers do
         {
           relative_url: category.url,
           text: "Some Awesome Category",
+          description: "Really great stuff here",
           icon: "folder",
           slug: "someawesomecategory",
           ref: "someawesomecategory",
@@ -84,6 +86,7 @@ RSpec.describe PrettyText::Helpers do
         {
           relative_url: category.url,
           text: "Some Awesome Category",
+          description: "Really great stuff here",
           icon: "folder",
           slug: "someawesomecategory",
           ref: "someawesomecategory",
@@ -97,6 +100,7 @@ RSpec.describe PrettyText::Helpers do
         {
           relative_url: tag.url,
           text: "somecooltag",
+          description: "Coolest things ever",
           icon: "tag",
           slug: "somecooltag",
           ref: "somecooltag",
@@ -107,6 +111,7 @@ RSpec.describe PrettyText::Helpers do
         {
           relative_url: category.url,
           text: "Some Awesome Category",
+          description: "Really great stuff here",
           icon: "folder",
           slug: "someawesomecategory",
           ref: "someawesomecategory",
@@ -125,6 +130,7 @@ RSpec.describe PrettyText::Helpers do
         {
           relative_url: private_category.url,
           text: "Manager Hideout",
+          description: nil,
           icon: "folder",
           slug: "secretcategory",
           ref: "secretcategory",