DEV: add plugin hook to add topic participant classes (#13125)

DEV: add plugin hook to add topic participant classes (#13125)

Allow plugins to add custom css classes to topic participants

diff --git a/app/assets/javascripts/discourse/app/lib/plugin-api.js b/app/assets/javascripts/discourse/app/lib/plugin-api.js
index 5778d70..5f8a2ff 100644
--- a/app/assets/javascripts/discourse/app/lib/plugin-api.js
+++ b/app/assets/javascripts/discourse/app/lib/plugin-api.js
@@ -52,6 +52,7 @@ import { addPostSmallActionIcon } from "discourse/widgets/post-small-action";
 import { addQuickAccessProfileItem } from "discourse/widgets/quick-access-profile";
 import { addTagsHtmlCallback } from "discourse/lib/render-tags";
 import { addToolbarCallback } from "discourse/components/d-editor";
+import { addTopicParticipantClassesCallback } from "discourse/widgets/topic-map";
 import { addTopicTitleDecorator } from "discourse/components/topic-title";
 import { addUserMenuGlyph } from "discourse/widgets/user-menu";
 import { addUsernameSelectorDecorator } from "discourse/helpers/decorate-username-selector";
@@ -73,7 +74,7 @@ import { replaceTagRenderer } from "discourse/lib/render-tag";
 import { setNewCategoryDefaultColors } from "discourse/routes/new-category";
 
 // If you add any methods to the API ensure you bump up this number
-const PLUGIN_API_VERSION = "0.11.3";
+const PLUGIN_API_VERSION = "0.11.4";
 
 class PluginApi {
   constructor(version, container) {
@@ -764,6 +765,18 @@ class PluginApi {
   }
 
   /**
+   * Adds a callback to be called before rendering a topic participant that
+   * that returns custom classes to add to the participant element
+   *
+   * Example:
+   *
+   * addTopicParticipantClassesCallback((attrs) => {if (attrs.primary_group_name == "moderator") return ["important-participant"];})
+   **/
+  addTopicParticipantClassesCallback(callback) {
+    addTopicParticipantClassesCallback(callback);
+  }
+
+  /**
    *
    * Adds a callback to be executed on the "transformed" post that is passed to the post
    * widget.
diff --git a/app/assets/javascripts/discourse/app/widgets/topic-map.js b/app/assets/javascripts/discourse/app/widgets/topic-map.js
index be9bf14..5db917e 100644
--- a/app/assets/javascripts/discourse/app/widgets/topic-map.js
+++ b/app/assets/javascripts/discourse/app/widgets/topic-map.js
@@ -40,11 +40,30 @@ createWidget("topic-map-show-links", {
   },
 });
 
+let addTopicParticipantClassesCallbacks = null;
+export function addTopicParticipantClassesCallback(callback) {
+  addTopicParticipantClassesCallbacks =
+    addTopicParticipantClassesCallbacks || [];
+  addTopicParticipantClassesCallbacks.push(callback);
+}
 createWidget("topic-participant", {
   buildClasses(attrs) {
+    const classNames = [];
     if (attrs.primary_group_name) {
-      return `group-${attrs.primary_group_name}`;
+      classNames.push(`group-${attrs.primary_group_name}`);
+    }
+    if (addTopicParticipantClassesCallbacks) {
+      for (let i = 0; i < addTopicParticipantClassesCallbacks.length; i++) {
+        let pluginClasses = addTopicParticipantClassesCallbacks[i].call(
+          this,
+          attrs
+        );
+        if (pluginClasses) {
+          classNames.push.apply(classNames, pluginClasses);
+        }
+      }
     }
+    return classNames;
   },
 
   html(attrs, state) {

GitHub sha: b66802cc

This commit appears in #13125 which was approved by danielwaterworth. It was merged by featheredtoast.