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

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}`;
+    }
+  },
 });

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 });

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