Add primary group classes (#12807)

Add primary group classes (#12807)

  • DEV: expose primary group as classes in more areas.

Add group classes in the group posts pages

Add primary group name as a class on the user card

diff --git a/app/assets/javascripts/discourse/app/components/group-post.js b/app/assets/javascripts/discourse/app/components/group-post.js
index 5222b08..72df8e3 100644
--- a/app/assets/javascripts/discourse/app/components/group-post.js
+++ b/app/assets/javascripts/discourse/app/components/group-post.js
@@ -5,7 +5,12 @@ import { prioritizeNameInUx } from "discourse/lib/settings";
 import { propertyEqual } from "discourse/lib/computed";
 
 export default Component.extend({
-  classNameBindings: [":user-stream-item", ":item", "moderatorAction"],
+  classNameBindings: [
+    ":user-stream-item",
+    ":item",
+    "moderatorAction",
+    "primaryGroup",
+  ],
 
   @discourseComputed("post.url")
   postUrl(url) {
@@ -23,4 +28,11 @@ export default Component.extend({
     }
     return this.post.user.username;
   },
+
+  @discourseComputed("post.user")
+  primaryGroup() {
+    if (this.post.user.primary_group_name) {
+      return `group-${this.post.user.primary_group_name}`;
+    }
+  },
 });
diff --git a/app/assets/javascripts/discourse/app/components/user-card-contents.js b/app/assets/javascripts/discourse/app/components/user-card-contents.js
index aec5a99..9981135 100644
--- a/app/assets/javascripts/discourse/app/components/user-card-contents.js
+++ b/app/assets/javascripts/discourse/app/components/user-card-contents.js
@@ -23,6 +23,7 @@ export default Component.extend(CardContentsBase, CanCheckEmails, CleansUp, {
     "user.card_background_upload_url::no-bg",
     "isFixed:fixed",
     "usernameClass",
+    "primaryGroup",
   ],
   allowBackgrounds: setting("allow_profile_backgrounds"),
   showBadges: setting("enable_badges"),
@@ -157,6 +158,11 @@ export default Component.extend(CardContentsBase, CanCheckEmails, CleansUp, {
     thisElem.style.backgroundImage = bg;
   },
 
+  @discourseComputed("user.primary_group_name")
+  primaryGroup(primaryGroup) {
+    return `group-${primaryGroup}`;
+  },
+
   _showCallback(username, $target) {
     this._positionCard($target);
     this.setProperties({ visible: true, loading: true });
diff --git a/app/serializers/group_post_user_serializer.rb b/app/serializers/group_post_user_serializer.rb
index 308535b..9a0337c 100644
--- a/app/serializers/group_post_user_serializer.rb
+++ b/app/serializers/group_post_user_serializer.rb
@@ -1,5 +1,9 @@
 # frozen_string_literal: true
 
 class GroupPostUserSerializer < BasicUserSerializer
-  attributes :title, :name
+  attributes :title, :name, :primary_group_name
+
+  def primary_group_name
+    object.primary_group.name if object.primary_group
+  end
 end

GitHub sha: e01d5f80