DEV: Move user/group cards from named outlet to component (#20718)

Named outlets are deprecated and will be removed in Ember 4.x.

app/assets/javascripts/discourse/app/components/card-container.hbs

@@ -4,16 +4,17 @@
 
 <UserCardContents
   @topic={{this.topic.model}}
-  @showUser={{action "showUser"}}
-  @filterPosts={{action "filterPosts"}}
+  @showUser={{this.showUser}}
+  @filterPosts={{this.filterPosts}}
   @composePrivateMessage={{route-action "composePrivateMessage"}}
   @createNewMessageViaParams={{route-action "createNewMessageViaParams"}}
   role="dialog"
   aria-labelledby="discourse-user-card-title"
 />
+
 <GroupCardContents
   @topic={{this.topic.model}}
-  @showUser={{action "showUser"}}
-  @showGroup={{action "showGroup"}}
+  @showUser={{this.showUser}}
+  @showGroup={{this.showGroup}}
   @createNewMessageViaParams={{route-action "createNewMessageViaParams"}}
 />

app/assets/javascripts/discourse/app/components/card-container.js

@@ -0,0 +1,26 @@
+import Component from "@glimmer/component";
+import { inject as service } from "@ember/service";
+import { inject as controller } from "@ember/controller";
+import { action } from "@ember/object";
+import DiscourseURL, { groupPath, userPath } from "discourse/lib/url";
+
+export default class CardWrapper extends Component {
+  @service site;
+  @controller topic;
+
+  @action
+  filterPosts(user) {
+    const topicController = this.topic;
+    topicController.send("filterParticipant", user);
+  }
+
+  @action
+  showUser(user) {
+    DiscourseURL.routeTo(userPath(user.username_lower));
+  }
+
+  @action
+  showGroup(group) {
+    DiscourseURL.routeTo(groupPath(group.name));
+  }
+}

app/assets/javascripts/discourse/app/controllers/user-card.js

@@ -1,21 +0,0 @@
-import Controller, { inject as controller } from "@ember/controller";
-import DiscourseURL, { groupPath, userPath } from "discourse/lib/url";
-
-export default Controller.extend({
-  topic: controller(),
-
-  actions: {
-    filterPosts(user) {
-      const topicController = this.topic;
-      topicController.send("filterParticipant", user);
-    },
-
-    showUser(user) {
-      DiscourseURL.routeTo(userPath(user.username_lower));
-    },
-
-    showGroup(group) {
-      DiscourseURL.routeTo(groupPath(group.name));
-    },
-  },
-});

app/assets/javascripts/discourse/app/routes/application.js

@@ -256,7 +256,6 @@ const ApplicationRoute = DiscourseRoute.extend(OpenComposer, {
 
   renderTemplate() {
     this.render("application");
-    this.render("user-card", { into: "application", outlet: "user-card" });
     this.render("modal", { into: "application", outlet: "modal" });
     this.render("composer", { into: "application", outlet: "composer" });
   },

app/assets/javascripts/discourse/app/routes/topic.js

@@ -325,7 +325,6 @@ const TopicRoute = DiscourseRoute.extend({
     this._super(...arguments);
 
     this.searchService.set("searchContext", null);
-    this.controllerFor("user-card").set("visible", false);
 
     const topicController = this.controllerFor("topic");
     const postStream = topicController.get("model.postStream");

app/assets/javascripts/discourse/app/templates/application.hbs

@@ -61,7 +61,8 @@
       </div>
 
       {{outlet}}
-      {{outlet "user-card"}}
+
+      <CardContainer />
     </div>
   </div>