From 490e1cfbbb6806d75b7780f7fbaac2d3b253807f Mon Sep 17 00:00:00 2001
From: Penar Musaraj <pmusaraj@gmail.com>
Date: Mon, 7 Dec 2020 12:10:21 -0500
Subject: [PATCH] DEV: Use tag renderer in tags filter dropdown (#11378)

A small change that would allow components to extend the tag
display in the filter dropdown, like they can in other contexts.

Was requested in the tag icons component, see
https://meta.discourse.org/t/tag-icons-component/109757/60?u=pmusaraj

The PR also standardises tag styling in select-kit dropdowns.
---
 .../javascripts/select-kit/addon/components/tag-drop.js     | 4 ++++
 .../stylesheets/common/select-kit/mini-tag-chooser.scss     | 6 ------
 app/assets/stylesheets/common/select-kit/select-kit.scss    | 4 +++-
 3 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/app/assets/javascripts/select-kit/addon/components/tag-drop.js b/app/assets/javascripts/select-kit/addon/components/tag-drop.js
index 02abe4ccb2f..8773d5a8d2e 100644
--- a/app/assets/javascripts/select-kit/addon/components/tag-drop.js
+++ b/app/assets/javascripts/select-kit/addon/components/tag-drop.js
@@ -96,6 +96,10 @@ export default ComboBoxComponent.extend(TagsMixin, {
 
   noTagsLabel: i18n("tagging.selector_no_tags"),
 
+  modifyComponentForRow() {
+    return "tag-row";
+  },
+
   shortcuts: computed("tagId", function () {
     const shortcuts = [];
 
diff --git a/app/assets/stylesheets/common/select-kit/mini-tag-chooser.scss b/app/assets/stylesheets/common/select-kit/mini-tag-chooser.scss
index 55e2ee0e63c..e3085aeceb8 100644
--- a/app/assets/stylesheets/common/select-kit/mini-tag-chooser.scss
+++ b/app/assets/stylesheets/common/select-kit/mini-tag-chooser.scss
@@ -47,12 +47,6 @@
           background: var(--tertiary-low);
         }
 
-        .discourse-tag {
-          &:hover {
-            color: var(--primary);
-          }
-        }
-
         .discourse-tag-count {
           margin-left: 0.5em;
         }
diff --git a/app/assets/stylesheets/common/select-kit/select-kit.scss b/app/assets/stylesheets/common/select-kit/select-kit.scss
index a4ffccfc3a7..7cbc9c9d247 100644
--- a/app/assets/stylesheets/common/select-kit/select-kit.scss
+++ b/app/assets/stylesheets/common/select-kit/select-kit.scss
@@ -170,8 +170,10 @@
     }
 
     .discourse-tag,
+    .discourse-tag:visited,
+    .discourse-tag:hover,
     .discourse-tag-count {
-      color: var(--primary);
+      color: var(--primary-high);
     }
 
     &.create-color-row {