From eda8a839d4c1da211f87035afab317db3b4d67db Mon Sep 17 00:00:00 2001
From: Dan Ungureanu <dan@ungureanu.me>
Date: Tue, 16 Mar 2021 16:29:41 +0200
Subject: [PATCH] UX: Show Topic column in invites pending tab (#12413)

---
 app/assets/javascripts/discourse/app/models/invite.js    | 6 ++++++
 .../discourse/app/templates/user-invited-show.hbs        | 9 +++++++++
 app/assets/stylesheets/mobile/user.scss                  | 5 ++---
 config/locales/client.en.yml                             | 1 +
 4 files changed, 18 insertions(+), 3 deletions(-)

diff --git a/app/assets/javascripts/discourse/app/models/invite.js b/app/assets/javascripts/discourse/app/models/invite.js
index 34f44ff7808..725c66e6b0b 100644
--- a/app/assets/javascripts/discourse/app/models/invite.js
+++ b/app/assets/javascripts/discourse/app/models/invite.js
@@ -2,6 +2,7 @@ import EmberObject from "@ember/object";
 import { alias } from "@ember/object/computed";
 import { Promise } from "rsvp";
 import discourseComputed from "discourse-common/utils/decorators";
+import Topic from "discourse/models/topic";
 import User from "discourse/models/user";
 import { ajax } from "discourse/lib/ajax";
 import { isNone } from "@ember/utils";
@@ -38,6 +39,11 @@ const Invite = EmberObject.extend({
     return groups ? groups.map((group) => group.id) : [];
   },
 
+  @discourseComputed("topics.firstObject")
+  topic(topicData) {
+    return topicData ? Topic.create(topicData) : null;
+  },
+
   topicId: alias("topics.firstObject.id"),
   topicTitle: alias("topics.firstObject.title"),
 });
diff --git a/app/assets/javascripts/discourse/app/templates/user-invited-show.hbs b/app/assets/javascripts/discourse/app/templates/user-invited-show.hbs
index de6c651abd9..8fd6eb5dca3 100644
--- a/app/assets/javascripts/discourse/app/templates/user-invited-show.hbs
+++ b/app/assets/javascripts/discourse/app/templates/user-invited-show.hbs
@@ -92,6 +92,7 @@
                   <th>{{i18n "user.invited.invited_via"}}</th>
                   {{#if currentUser.staff}}
                     <th>{{i18n "user.invited.groups"}}</th>
+                    <th>{{i18n "user.invited.topic"}}</th>
                   {{/if}}
                   <th>{{i18n "user.invited.sent"}}</th>
                   <th>{{i18n "user.invited.expires_at"}}</th>
@@ -118,6 +119,14 @@
                           &mdash;
                         {{/each}}
                       </td>
+                      <td class="invite-topic">
+                        <div class="label">{{i18n "user.invited.topic"}}</div>
+                        {{#if invite.topic}}
+                          <a href={{invite.topic.url}}>{{invite.topic.title}}</a>
+                        {{else}}
+                          &mdash;
+                        {{/if}}
+                      </td>
                     {{/if}}
                     <td class="invite-updated-at">
                       <div class="label">{{i18n "user.invited.sent"}}</div>
diff --git a/app/assets/stylesheets/mobile/user.scss b/app/assets/stylesheets/mobile/user.scss
index 832ba613d30..a257efe7603 100644
--- a/app/assets/stylesheets/mobile/user.scss
+++ b/app/assets/stylesheets/mobile/user.scss
@@ -347,9 +347,8 @@
       text-align: right;
     }
 
-    td.invite-groups {
-      grid-column-start: 1;
-      grid-column-end: -1;
+    td.invite-groups,
+    td.invite-topic {
       order: 3;
     }
 
diff --git a/config/locales/client.en.yml b/config/locales/client.en.yml
index 56a66288b62..15a7322e24b 100644
--- a/config/locales/client.en.yml
+++ b/config/locales/client.en.yml
@@ -1450,6 +1450,7 @@ en:
         invited_via: "Invitation"
         invited_via_link: "link (%{count} / %{max} redeemed)"
         groups: "Groups"
+        topic: "Topic"
         sent: "Created/Last Sent"
         expires_at: "Expires"
         edit: "Edit"