DEV: Modernise assignment topic-list implementation (#510)

- Reuse core `<BasicTopicList` instead of reimplementing
- Use raw plugin outlet to add assign controls to topic-list-item (requires discourse/discourse#23592)
- Remove use of `.render()` in route

.prettierrc

@@ -1 +1,17 @@
-{}
+{
+  "plugins": ["prettier-plugin-ember-template-tag"],
+  "overrides": [
+    {
+      "files": "*.gjs",
+      "options": {
+        "parser": "ember-template-tag"
+      }
+    },
+    {
+      "files": "*.gts",
+      "options": {
+        "parser": "ember-template-tag"
+      }
+    }
+  ]
+}

assets/javascripts/discourse/components/assign-user-form.hbs

@@ -51,7 +51,6 @@
   <Textarea
     id="assign-modal-note"
     @value={{@model.note}}
-    {{! template-lint-disable no-down-event-binding }}
     {{on "keydown" this.handleTextAreaKeydown}}
   />
 </div>

assets/javascripts/discourse/components/assign-user-form.js

@@ -9,8 +9,8 @@ export default class AssignUserForm extends Component {
   @service capabilities;
 
   @tracked assigneeError = false;
-  @tracked assigneeName =
-    this.args.model.username || this.args.model.group_name;
+  @tracked
+  assigneeName = this.args.model.username || this.args.model.group_name;
 
   constructor() {
     super(...arguments);

assets/javascripts/discourse/components/assigned-topic-list-column.gjs

@@ -0,0 +1,45 @@
+import Component from "@glimmer/component";
+import AssignActionsDropdown from "./assign-actions-dropdown";
+import { inject as service } from "@ember/service";
+import { action } from "@ember/object";
+
+export default class AssignedTopicListColumn_Test extends Component {
+  <template>
+    <td class="topic-list-data">
+      {{#if @topic.assigned_to_user}}
+        <AssignActionsDropdown
+          @topic={{@topic}}
+          @assignee={{@topic.assigned_to_user.username}}
+          @unassign={{this.unassign}}
+          @reassign={{this.reassign}}
+        />
+      {{else if @topic.assigned_to_group}}
+        <AssignActionsDropdown
+          @topic={{@topic}}
+          @assignee={{@topic.assigned_to_group.name}}
+          @group={{true}}
+          @unassign={{this.unassign}}
+          @reassign={{this.reassign}}
+        />
+      {{else}}
+        <AssignActionsDropdown @topic={{@topic}} @unassign={{this.unassign}} />
+      {{/if}}
+    </td>
+  </template>
+
+  @service taskActions;
+  @service router;
+
+  @action
+  async unassign(targetId, targetType = "Topic") {
+    await this.taskActions.unassign(targetId, targetType);
+    this.router.refresh();
+  }
+
+  @action
+  reassign(topic) {
+    this.taskActions.showAssignModal(topic, {
+      onSuccess: () => this.router.refresh(),
+    });
+  }
+}

assets/javascripts/discourse/connectors/topic-list-after-columns/assign-buttons.hbr

@@ -0,0 +1 @@
+{{raw "assign-topic-buttons" topic=context.topic}}

assets/javascripts/discourse/controllers/group-assigned-show.js

@@ -8,6 +8,7 @@ import { action } from "@ember/object";
 
 export default class GroupAssignedShow extends UserTopicsList {
   @service taskActions;
+  @service router;
   @controller user;
 
   queryParams = ["order", "ascending", "search"];
@@ -45,13 +46,13 @@ export default class GroupAssignedShow extends UserTopicsList {
   @action
   async unassign(targetId, targetType = "Topic") {
     await this.taskActions.unassign(targetId, targetType);
-    this.send("changeAssigned");
+    this.router.refresh();
   }
 
   @action
   reassign(topic) {
     this.taskActions.showAssignModal(topic, {
-      onSuccess: () => this.send("changeAssigned"),
+      onSuccess: () => this.router.refresh(),
     });
   }
 

assets/javascripts/discourse/controllers/user-activity-assigned.js

@@ -56,19 +56,6 @@ export default class UserActivityAssigned extends UserTopicsList {
       });
   }
 
-  @action
-  async unassign(targetId, targetType = "Topic") {
-    await this.taskActions.unassign(targetId, targetType);
-    this.send("changeAssigned");
-  }
-
-  @action
-  reassign(topic) {
-    this.taskActions.showAssignModal(topic, {
-      onSuccess: () => this.send("changeAssigned"),
-    });
-  }
-
   @action
   changeSort(sortBy) {
     if (sortBy === this.order) {

assets/javascripts/discourse/raw-templates/assign-topic-buttons.hbr

@@ -0,0 +1 @@
+{{{view.html}}}

assets/javascripts/discourse/raw-views/assign-topic-buttons.gjs

@@ -0,0 +1,21 @@
+import EmberObject from "@ember/object";
+import rawRenderGlimmer from "discourse/lib/raw-render-glimmer";
+import AssignedTopicListColumn from "../components/assigned-topic-list-column";
+import { inject as service } from "@ember/service";
+
+const ASSIGN_LIST_ROUTES = ["userActivity.assigned", "group.assigned.show"];
+
+export default class extends EmberObject {
+  @service router;
+
+  get html() {
+    if (ASSIGN_LIST_ROUTES.includes(this.router.currentRouteName)) {
+      return rawRenderGlimmer(
+        this,
+        "div.assign-topic-buttons",
+        <template><AssignedTopicListColumn @topic={{@data.topic}} /></template>,
+        { topic: this.topic }
+      );
+    }
+  }
+}

assets/javascripts/discourse/routes/group-assigned-show.js

@@ -2,12 +2,6 @@ import DiscourseRoute from "discourse/routes/discourse";
 import { findOrResetCachedTopicList } from "discourse/lib/cached-topic-list";
 
 export default class GroupAssignedShow extends DiscourseRoute {
-  beforeModel(transition) {
-    if (transition.from?.localName === "show") {
-      this.session.set("topicListScrollPosition", 1);
-    }
-  }
-
   model(params) {
     let filter;
     if (["everyone", this.modelFor("group").name].includes(params.filter)) {
@@ -36,8 +30,4 @@ export default class GroupAssignedShow extends DiscourseRoute {
       search: this.currentModel.params.search,
     });
   }
-
-  renderTemplate() {
-    this.render("group-topics-list");
-  }
 }

assets/javascripts/discourse/routes/group-assigned.js

@@ -1,6 +1,5 @@
 import DiscourseRoute from "discourse/routes/discourse";
 import { ajax } from "discourse/lib/ajax";
-import { action } from "@ember/object";
 
 export default class GroupAssigned extends DiscourseRoute {
   model() {
@@ -28,9 +27,4 @@ export default class GroupAssigned extends DiscourseRoute {
       this.transitionTo("group.assigned.show", "everyone");
     }
   }
-
-  @action
-  changeAssigned() {
-    this.refresh();
-  }
 }