diff --git a/app/assets/javascripts/admin/addon/templates/user-badges.hbs b/app/assets/javascripts/admin/addon/templates/user-badges.hbs
index 64d419ca2a8..1c6bb0071dc 100644
--- a/app/assets/javascripts/admin/addon/templates/user-badges.hbs
+++ b/app/assets/javascripts/admin/addon/templates/user-badges.hbs
@@ -21,6 +21,7 @@
         @outletArgs={{hash
           availableBadges=this.availableBadges
           userBadges=this.userBadges
+          user=this.user
         }}
       >
         <form class="form-horizontal">
diff --git a/app/assets/javascripts/discourse/app/components/categories-boxes.hbs b/app/assets/javascripts/discourse/app/components/categories-boxes.hbs
index d2a295d35ca..e45cc6f9fb2 100644
--- a/app/assets/javascripts/discourse/app/components/categories-boxes.hbs
+++ b/app/assets/javascripts/discourse/app/components/categories-boxes.hbs
@@ -1,100 +1,110 @@
-{{#each this.categories as |c|}}
-  <PluginOutlet
-    @name="category-box-before-each-box"
-    @outletArgs={{hash category=c}}
-  />
-
-  <div
-    style={{category-color-variable c.color}}
-    data-category-id={{c.id}}
-    data-notification-level={{c.notificationLevelString}}
-    data-url={{c.url}}
-    class="category category-box category-box-{{c.slug}}
-      {{if c.isMuted 'muted'}}"
-  >
-    <div class="category-box-inner">
-      {{#unless c.isMuted}}
-        <div class="category-logo">
-          {{#if c.uploaded_logo.url}}
-            <CategoryLogo @category={{c}} />
-          {{/if}}
-        </div>
-      {{/unless}}
-
-      <div class="category-details">
-        <div class="category-box-heading">
-          <a class="parent-box-link" href={{c.url}}>
-            <h3>
-              <CategoryTitleBefore @category={{c}} />
-              {{#if c.read_restricted}}
-                {{d-icon this.lockIcon}}
-              {{/if}}
-              {{c.name}}
-            </h3>
-          </a>
-        </div>
+<PluginOutlet
+  @name="categories-boxes-wrapper"
+  @outletArgs={{hash categories=this.categories}}
+>
+  {{#each this.categories as |c|}}
+    <PluginOutlet
+      @name="category-box-before-each-box"
+      @outletArgs={{hash category=c}}
+    />
 
+    <div
+      style={{category-color-variable c.color}}
+      data-category-id={{c.id}}
+      data-notification-level={{c.notificationLevelString}}
+      data-url={{c.url}}
+      class="category category-box category-box-{{c.slug}}
+        {{if c.isMuted 'muted'}}"
+    >
+      <div class="category-box-inner">
         {{#unless c.isMuted}}
-          <div class="description">
-            {{html-safe c.description_excerpt}}
+          <div class="category-logo">
+            {{#if c.uploaded_logo.url}}
+              <CategoryLogo @category={{c}} />
+            {{/if}}
+          </div>
+        {{/unless}}
+
+        <div class="category-details">
+          <div class="category-box-heading">
+            <a class="parent-box-link" href={{c.url}}>
+              <h3>
+                <CategoryTitleBefore @category={{c}} />
+                {{#if c.read_restricted}}
+                  {{d-icon this.lockIcon}}
+                {{/if}}
+                {{c.name}}
+              </h3>
+            </a>
           </div>
 
-          {{#if c.isGrandParent}}
-            {{#each c.subcategories as |subcategory|}}
-              <div
-                data-category-id={{subcategory.id}}
-                data-notification-level={{subcategory.notificationLevelString}}
-                style={{border-color subcategory.color}}
-                class="subcategory with-subcategories
-                  {{if subcategory.uploaded_logo.url 'has-logo' 'no-logo'}}"
-              >
-                <div class="subcategory-box-inner">
-                  <CategoryTitleLink @tagName="h4" @category={{subcategory}} />
-                  {{#if subcategory.subcategories}}
-                    <div class="subcategories">
-                      {{#each subcategory.subcategories as |subsubcategory|}}
-                        {{#unless subsubcategory.isMuted}}
-                          <span class="subcategory">
-                            <CategoryTitleBefore @category={{subsubcategory}} />
-                            {{category-link subsubcategory hideParent="true"}}
-                          </span>
-                        {{/unless}}
-                      {{/each}}
-                    </div>
-                  {{/if}}
-                </div>
-              </div>
-            {{/each}}
-          {{else if c.subcategories}}
-            <div class="subcategories">
-              {{#each c.subcategories as |sc|}}
-                <a class="subcategory" href={{sc.url}}>
-                  <span class="subcategory-image-placeholder">
-                    {{#if sc.uploaded_logo.url}}
-                      <CategoryLogo @category={{sc}} />
-                    {{/if}}
-                  </span>
-
-                  {{category-link sc hideParent="true"}}
-                </a>
-              {{/each}}
+          {{#unless c.isMuted}}
+            <div class="description">
+              {{html-safe c.description_excerpt}}
             </div>
-          {{/if}}
-        {{/unless}}
+
+            {{#if c.isGrandParent}}
+              {{#each c.subcategories as |subcategory|}}
+                <div
+                  data-category-id={{subcategory.id}}
+                  data-notification-level={{subcategory.notificationLevelString}}
+                  style={{border-color subcategory.color}}
+                  class="subcategory with-subcategories
+                    {{if subcategory.uploaded_logo.url 'has-logo' 'no-logo'}}"
+                >
+                  <div class="subcategory-box-inner">
+                    <CategoryTitleLink
+                      @tagName="h4"
+                      @category={{subcategory}}
+                    />
+                    {{#if subcategory.subcategories}}
+                      <div class="subcategories">
+                        {{#each subcategory.subcategories as |subsubcategory|}}
+                          {{#unless subsubcategory.isMuted}}
+                            <span class="subcategory">
+                              <CategoryTitleBefore
+                                @category={{subsubcategory}}
+                              />
+                              {{category-link subsubcategory hideParent="true"}}
+                            </span>
+                          {{/unless}}
+                        {{/each}}
+                      </div>
+                    {{/if}}
+                  </div>
+                </div>
+              {{/each}}
+            {{else if c.subcategories}}
+              <div class="subcategories">
+                {{#each c.subcategories as |sc|}}
+                  <a class="subcategory" href={{sc.url}}>
+                    <span class="subcategory-image-placeholder">
+                      {{#if sc.uploaded_logo.url}}
+                        <CategoryLogo @category={{sc}} />
+                      {{/if}}
+                    </span>
+
+                    {{category-link sc hideParent="true"}}
+                  </a>
+                {{/each}}
+              </div>
+            {{/if}}
+          {{/unless}}
+        </div>
+
+        <PluginOutlet
+          @name="category-box-below-each-category"
+          @outletArgs={{hash category=c}}
+        />
       </div>
-
-      <PluginOutlet
-        @name="category-box-below-each-category"
-        @outletArgs={{hash category=c}}
-      />
     </div>
-  </div>
 
-  <PluginOutlet
-    @name="category-box-after-each-box"
-    @outletArgs={{hash category=c}}
-  />
-{{/each}}
+    <PluginOutlet
+      @name="category-box-after-each-box"
+      @outletArgs={{hash category=c}}
+    />
+  {{/each}}
+</PluginOutlet>
 
 <PluginOutlet
   @name="category-boxes-after-boxes"
diff --git a/app/assets/javascripts/discourse/app/components/small-user-list.gjs b/app/assets/javascripts/discourse/app/components/small-user-list.gjs
index 70e61c825e2..fe8e724949c 100644
--- a/app/assets/javascripts/discourse/app/components/small-user-list.gjs
+++ b/app/assets/javascripts/discourse/app/components/small-user-list.gjs
@@ -1,31 +1,22 @@
 import Component from "@glimmer/component";
+import { hash } from "@ember/helper";
 import { service } from "@ember/service";
+import PluginOutlet from "discourse/components/plugin-outlet";
 import avatar from "discourse/helpers/bound-avatar-template";
-import { userPath } from "discourse/lib/url";
+import { smallUserAttrs } from "discourse/lib/user-list-attrs";
 import i18n from "discourse-common/helpers/i18n";
 import getURL from "discourse-common/lib/get-url";
 
 export default class SmallUserList extends Component {
   @service currentUser;
 
-  smallUserAtts(user) {
-    return {
-      template: user.avatar_template,
-      username: user.username,
-      post_url: user.post_url,
-      url: userPath(user.username_lower),
-      unknown: user.unknown,
-    };
-  }
-
   get users() {
     let users = this.args.data.users;
-
     if (
       this.args.data.addSelf &&
       !users.some((u) => u.username === this.currentUser.username)
     ) {
-      users = users.concat(this.smallUserAtts(this.currentUser));
+      users = users.concat(smallUserAttrs(this.currentUser));
     }
     return users;
   }
@@ -38,38 +29,45 @@ export default class SmallUserList extends Component {
   }
 
   <template>
-    {{#each this.users as |user|}}
-      {{#if user.unknown}}
-        <div
-          title={{i18n "post.unknown_user"}}
-          class="unknown"
-          role="listitem"
-        ></div>
-      {{else}}
-        <a
-          class="trigger-user-card"
-          data-user-card={{user.username}}
-          title={{user.username}}
-          aria-hidden="false"
-          role="listitem"
-        >
-          {{avatar user.template "tiny"}}
-        </a>
-      {{/if}}
-    {{/each}}
+    <PluginOutlet
+      @name="small-user-list-internal"
+      @outletArgs={{hash data=this.args}}
+    >
+      {{#each this.users as |user|}}
+        {{#if user.unknown}}
+          {{! template-lint-disable require-context-role }}
+          <div
+            title={{i18n "post.unknown_user"}}
+            class="unknown"
+            role="listitem"
+          ></div>
+        {{else}}
+          {{! template-lint-disable require-context-role }}
+          <a
+            class="trigger-user-card"
+            data-user-card={{user.username}}
+            title={{user.username}}
+            aria-hidden="false"
+            role="listitem"
+          >
+            {{avatar user.template "tiny"}}
+          </a>
+        {{/if}}
+      {{/each}}
 
-    {{#if @data.description}}
-      {{#if this.postUrl}}
-        <a href={{this.postUrl}}>
+      {{#if @data.description}}
+        {{#if this.postUrl}}
+          <a href={{this.postUrl}}>
+            <span aria-hidden="true" class="list-description">
+              {{i18n @data.description count=@data.count}}
+            </span>
+          </a>
+        {{else}}
           <span aria-hidden="true" class="list-description">
             {{i18n @data.description count=@data.count}}
           </span>
-        </a>
-      {{else}}
-        <span aria-hidden="true" class="list-description">
-          {{i18n @data.description count=@data.count}}
-        </span>
+        {{/if}}
       {{/if}}
-    {{/if}}
+    </PluginOutlet>
   </template>
 }
diff --git a/app/assets/javascripts/discourse/app/components/user-card-contents.hbs b/app/assets/javascripts/discourse/app/components/user-card-contents.hbs
index 94241a9f52e..a74515e8b3b 100644
--- a/app/assets/javascripts/discourse/app/components/user-card-contents.hbs
+++ b/app/assets/javascripts/discourse/app/components/user-card-contents.hbs
@@ -27,54 +27,48 @@
       </div>
     {{else}}
       <div class="card-row first-row">
-        <div class="user-card-avatar">
-          {{#if this.contentHidden}}
-            <span class="card-huge-avatar">{{bound-avatar
-                this.user
-                "huge"
-              }}</span>
-          {{else}}
-            <a
-              {{on "click" this.handleShowUser}}
-              href={{this.user.path}}
-              class="card-huge-avatar"
-            >{{bound-avatar this.user "huge"}}</a>
-          {{/if}}
-
-          <UserAvatarFlair @user={{this.user}} />
-
-          <div>
-            <PluginOutlet
-              @name="user-card-avatar-flair"
-              @connectorTagName="div"
-              @outletArgs={{hash user=this.user}}
-            />
-          </div>
-        </div>
-        <div class="names">
-          <div
-            class="names__primary
-              {{this.staff}}
-              {{this.newUser}}
-              {{if this.nameFirst 'full-name' 'username'}}"
-          >
+        <PluginOutlet
+          @name="user-card-main-info"
+          @outletArgs={{hash
+            user=this.user
+            post=this.post
+            contentHidden=this.contentHidden
+            handleShowUser=this.handleShowUser
+          }}
+        >
+          <div class="user-card-avatar">
             {{#if this.contentHidden}}
-              <span
-                id="discourse-user-card-title"
-                class="name-username-wrapper"
-              >
-                {{if
-                  this.nameFirst
-                  this.user.name
-                  (format-username this.user.username)
-                }}
-              </span>
+              <span class="card-huge-avatar">{{bound-avatar
+                  this.user
+                  "huge"
+                }}</span>
             {{else}}
               <a
                 {{on "click" this.handleShowUser}}
                 href={{this.user.path}}
-                class="user-profile-link"
-              >
+                class="card-huge-avatar"
+                tabindex="-1"
+              >{{bound-avatar this.user "huge"}}</a>
+            {{/if}}
+
+            <UserAvatarFlair @user={{this.user}} />
+
+            <div>
+              <PluginOutlet
+                @name="user-card-avatar-flair"
+                @connectorTagName="div"
+                @outletArgs={{hash user=this.user}}
+              />
+            </div>
+          </div>
+          <div class="names">
+            <div
+              class="names__primary
+                {{this.staff}}
+                {{this.newUser}}
+                {{if this.nameFirst 'full-name' 'username'}}"
+            >
+              {{#if this.contentHidden}}
                 <span
                   id="discourse-user-card-title"
                   class="name-username-wrapper"
@@ -85,45 +79,68 @@
                     (format-username this.user.username)
                   }}
                 </span>
-                {{user-status this.user currentUser=this.currentUser}}
-              </a>
-            {{/if}}
-          </div>
-          <PluginOutlet
-            @name="user-card-after-username"
-            @connectorTagName="div"
-            @outletArgs={{hash user=this.user showUser=this.handleShowUser}}
-          />
-          {{#if this.nameFirst}}
-            <div class="names__secondary username">{{this.user.username}}</div>
-          {{else}}
-            {{#if this.user.name}}
-              <div class="names__secondary full-name">{{this.user.name}}</div>
-            {{/if}}
-          {{/if}}
-          {{#if this.user.title}}
-            <div class="names__secondary">{{this.user.title}}</div>
-          {{/if}}
-          {{#if this.user.staged}}
-            <div class="names__secondary staged">{{i18n "user.staged"}}</div>
-          {{/if}}
-          {{#if this.hasStatus}}
-            <div class="user-status">
-              {{html-safe this.userStatusEmoji}}
-              <span class="user-status__description">
-                {{this.user.status.description}}
-              </span>
-              {{format-date this.user.status.ends_at format="tiny"}}
+              {{else}}
+                <a
+                  {{on "click" this.handleShowUser}}
+                  href={{this.user.path}}
+                  class="user-profile-link"
+                  aria-label={{i18n
+                    "user.profile_link"
+                    username=this.user.username
+                  }}
+                >
+                  <span
+                    id="discourse-user-card-title"
+                    class="name-username-wrapper"
+                  >
+                    {{if
+                      this.nameFirst
+                      this.user.name
+                      (format-username this.user.username)
+                    }}
+                  </span>
+                  {{user-status this.user currentUser=this.currentUser}}
+                </a>
+              {{/if}}
             </div>
-          {{/if}}
-          <div>
             <PluginOutlet
-              @name="user-card-post-names"
+              @name="user-card-after-username"
               @connectorTagName="div"
-              @outletArgs={{hash user=this.user}}
+              @outletArgs={{hash user=this.user showUser=this.handleShowUser}}
             />
+            {{#if this.nameFirst}}
+              <div
+                class="names__secondary username"
+              >{{this.user.username}}</div>
+            {{else}}
+              {{#if this.user.name}}
+                <div class="names__secondary full-name">{{this.user.name}}</div>
+              {{/if}}
+            {{/if}}
+            {{#if this.user.title}}
+              <div class="names__secondary">{{this.user.title}}</div>
+            {{/if}}
+            {{#if this.user.staged}}
+              <div class="names__secondary staged">{{i18n "user.staged"}}</div>
+            {{/if}}
+            {{#if this.hasStatus}}
+              <div class="user-status">
+                {{html-safe this.userStatusEmoji}}
+                <span class="user-status__description">
+                  {{this.user.status.description}}
+                </span>
+                {{format-date this.user.status.ends_at format="tiny"}}
+              </div>
+            {{/if}}
+            <div>
+              <PluginOutlet
+                @name="user-card-post-names"
+                @connectorTagName="div"
+                @outletArgs={{hash user=this.user}}
+              />
+            </div>
           </div>
-        </div>
+        </PluginOutlet>
         <ul class="usercard-controls">
           {{#if this.user.can_send_private_message_to_user}}
             <li class="compose-pm">
@@ -379,20 +396,25 @@
 
       {{#if this.showBadges}}
         <div class="card-row">
-          {{#if this.user.featured_user_badges}}
-            <div class="badge-section">
-              {{#each this.user.featured_user_badges as |ub|}}
-                <UserBadge @badge={{ub.badge}} @user={{this.user}} />
-              {{/each}}
-              {{#if this.showMoreBadges}}
-                <span class="more-user-badges">
-                  <LinkTo @route="user.badges" @model={{this.user}}>
-                    {{i18n "badges.more_badges" count=this.moreBadgesCount}}
-                  </LinkTo>
-                </span>
-              {{/if}}
-            </div>
-          {{/if}}
+          <PluginOutlet
+            @name="user-card-badges"
+            @outletArgs={{hash user=this.user post=this.post}}
+          >
+            {{#if this.user.featured_user_badges}}
+              <div class="badge-section">
+                {{#each this.user.featured_user_badges as |ub|}}
+                  <UserBadge @badge={{ub.badge}} @user={{this.user}} />
+                {{/each}}
+                {{#if this.showMoreBadges}}
+                  <span class="more-user-badges">
+                    <LinkTo @route="user.badges" @model={{this.user}}>
+                      {{i18n "badges.more_badges" count=this.moreBadgesCount}}
+                    </LinkTo>
+                  </span>
+                {{/if}}
+              </div>
+            {{/if}}
+          </PluginOutlet>
         </div>
       {{/if}}
     {{/if}}
diff --git a/app/assets/javascripts/discourse/app/lib/transformer/registry.js b/app/assets/javascripts/discourse/app/lib/transformer/registry.js
index 985246e89e1..33bc05e79d3 100644
--- a/app/assets/javascripts/discourse/app/lib/transformer/registry.js
+++ b/app/assets/javascripts/discourse/app/lib/transformer/registry.js
@@ -2,4 +2,5 @@ export const VALUE_TRANSFORMERS = Object.freeze([
   // use only lowercase names
   "header-notifications-avatar-size",
   "home-logo-href",
+  "small-user-attrs",
 ]);
diff --git a/app/assets/javascripts/discourse/app/lib/user-list-attrs.js b/app/assets/javascripts/discourse/app/lib/user-list-attrs.js
new file mode 100644
index 00000000000..dd03989ec00
--- /dev/null
+++ b/app/assets/javascripts/discourse/app/lib/user-list-attrs.js
@@ -0,0 +1,16 @@
+import { applyValueTransformer } from "discourse/lib/transformer";
+import { userPath } from "discourse/lib/url";
+
+export function smallUserAttrs(user) {
+  const defaultAttrs = {
+    template: user.avatar_template,
+    username: user.username,
+    post_url: user.post_url,
+    url: userPath(user.username_lower),
+    unknown: user.unknown,
+  };
+
+  return applyValueTransformer("small-user-attrs", defaultAttrs, {
+    user,
+  });
+}
diff --git a/app/assets/javascripts/discourse/app/templates/user/badges.hbs b/app/assets/javascripts/discourse/app/templates/user/badges.hbs
index 4419f262f56..65ba2aaeb71 100644
--- a/app/assets/javascripts/discourse/app/templates/user/badges.hbs
+++ b/app/assets/javascripts/discourse/app/templates/user/badges.hbs
@@ -1,30 +1,40 @@
 {{body-class "user-badges-page"}}
 
 <section class="user-content" id="user-content">
-  <p class="favorite-count">
-    {{i18n
-      "badges.favorite_count"
-      count=this.favoriteBadges.length
-      max=this.siteSettings.max_favorite_badges
+  <PluginOutlet
+    @name="user-badges-content"
+    @outletArgs={{hash
+      sortedBadges=this.sortedBadges
+      maxFavBadges=this.siteSettings.max_favorite_badges
+      favoriteBadges=this.favoriteBadges
+      canFavoriteMoreBadges=this.canFavoriteMoreBadges
+      favorite=this.favorite
     }}
-  </p>
-
-  <div class="badge-group-list">
-    {{#each this.sortedBadges as |ub|}}
-      <BadgeCard
-        @badge={{ub.badge}}
-        @count={{ub.count}}
-        @canFavorite={{ub.can_favorite}}
-        @isFavorite={{ub.is_favorite}}
-        @username={{this.username}}
-        @canFavoriteMoreBadges={{this.canFavoriteMoreBadges}}
-        @onFavoriteClick={{action "favorite" ub}}
-        @filterUser="true"
+  >
+    <p class="favorite-count">
+      {{i18n
+        "badges.favorite_count"
+        count=this.favoriteBadges.length
+        max=this.siteSettings.max_favorite_badges
+      }}
+    </p>
+    <div class="badge-group-list">
+      {{#each this.sortedBadges as |ub|}}
+        <BadgeCard
+          @badge={{ub.badge}}
+          @count={{ub.count}}
+          @canFavorite={{ub.can_favorite}}
+          @isFavorite={{ub.is_favorite}}
+          @username={{this.username}}
+          @canFavoriteMoreBadges={{this.canFavoriteMoreBadges}}
+          @onFavoriteClick={{action "favorite" ub}}
+          @filterUser="true"
+        />
+      {{/each}}
+      <PluginOutlet
+        @name="after-user-profile-badges"
+        @outletArgs={{hash user=this.user.model}}
       />
-    {{/each}}
-    <PluginOutlet
-      @name="after-user-profile-badges"
-      @outletArgs={{hash user=this.user.model}}
-    />
-  </div>
+    </div>
+  </PluginOutlet>
 </section>
\ No newline at end of file
diff --git a/app/assets/javascripts/discourse/app/widgets/post-menu.js b/app/assets/javascripts/discourse/app/widgets/post-menu.js
index 54795d9e253..7fedbc7fbf4 100644
--- a/app/assets/javascripts/discourse/app/widgets/post-menu.js
+++ b/app/assets/javascripts/discourse/app/widgets/post-menu.js
@@ -6,7 +6,7 @@ import AdminPostMenu from "discourse/components/admin-post-menu";
 import DeleteTopicDisallowedModal from "discourse/components/modal/delete-topic-disallowed";
 import { formattedReminderTime } from "discourse/lib/bookmark";
 import { recentlyCopied, showAlert } from "discourse/lib/post-action-feedback";
-import { userPath } from "discourse/lib/url";
+import { smallUserAttrs } from "discourse/lib/user-list-attrs";
 import {
   NO_REMINDER_ICON,
   WITH_REMINDER_ICON,
@@ -53,16 +53,6 @@ function registerButton(name, builder) {
   _builders[name] = builder;
 }
 
-function smallUserAtts(user) {
-  return {
-    template: user.avatar_template,
-    username: user.username,
-    post_url: user.post_url,
-    url: userPath(user.username_lower),
-    unknown: user.unknown,
-  };
-}
-
 export function buildButton(name, widget) {
   let { attrs, state, siteSettings, settings, currentUser } = widget;
 
@@ -904,14 +894,13 @@ export default createWidget("post-menu", {
 
   getWhoLiked() {
     const { attrs, state } = this;
-
     return this.store
       .find("post-action-user", {
         id: attrs.id,
         post_action_type_id: LIKE_ACTION,
       })
       .then((users) => {
-        state.likedUsers = users.map(smallUserAtts);
+        state.likedUsers = users.map(smallUserAttrs);
         state.total = users.totalRows;
       });
   },
@@ -920,7 +909,7 @@ export default createWidget("post-menu", {
     const { attrs, state } = this;
 
     return this.store.find("post-reader", { id: attrs.id }).then((users) => {
-      state.readers = users.map(smallUserAtts);
+      state.readers = users.map(smallUserAttrs);
       state.totalReaders = users.totalRows;
     });
   },