diff --git a/app/assets/javascripts/discourse/tests/acceptance/personal-message-test.js b/app/assets/javascripts/discourse/tests/acceptance/personal-message-test.js
index a5f9802fe2c..e4d2f430f4c 100644
--- a/app/assets/javascripts/discourse/tests/acceptance/personal-message-test.js
+++ b/app/assets/javascripts/discourse/tests/acceptance/personal-message-test.js
@@ -21,7 +21,7 @@ acceptance("Personal Message", function (needs) {
await visit("/t/pm-for-testing/12");
assert.strictEqual(
- query("#suggested-topics-title").innerText.trim(),
+ query("#suggested-topics .suggested-topics-title").innerText.trim(),
I18n.t("suggested_topics.pm_title")
);
});
diff --git a/app/assets/javascripts/discourse/tests/acceptance/topic-test.js b/app/assets/javascripts/discourse/tests/acceptance/topic-test.js
index df3aa629f10..318460d635b 100644
--- a/app/assets/javascripts/discourse/tests/acceptance/topic-test.js
+++ b/app/assets/javascripts/discourse/tests/acceptance/topic-test.js
@@ -204,7 +204,7 @@ acceptance("Topic", function (needs) {
await visit("/t/internationalization-localization/280");
assert.strictEqual(
- query("#suggested-topics-title").innerText.trim(),
+ query("#suggested-topics .suggested-topics-title").innerText.trim(),
I18n.t("suggested_topics.title")
);
});
diff --git a/app/assets/javascripts/discourse/tests/acceptance/user-private-messages-test.js b/app/assets/javascripts/discourse/tests/acceptance/user-private-messages-test.js
index ae50319aebd..3fdd3aadf35 100644
--- a/app/assets/javascripts/discourse/tests/acceptance/user-private-messages-test.js
+++ b/app/assets/javascripts/discourse/tests/acceptance/user-private-messages-test.js
@@ -83,246 +83,242 @@ acceptance(
}
);
-let fetchedNew;
-let fetchUserNew;
-let fetchedGroupNew;
-
-function withGroupMessagesSetup(needs) {
- needs.user({
- id: 5,
- username: "charlie",
- groups: [{ id: 14, name: "awesome_group", has_messages: true }],
- });
-
- needs.site({
- can_tag_pms: true,
- });
-
- needs.hooks.afterEach(() => {
- fetchedNew = false;
- fetchedGroupNew = false;
- fetchUserNew = false;
- });
-
- needs.pretender((server, helper) => {
- server.get("/tags/personal_messages/:username.json", () => {
- return helper.response({ tags: [{ id: "tag1" }] });
- });
-
- server.get("/t/13.json", () => {
- const response = cloneJSON(fixturesByUrl["/t/12/1.json"]);
- response.suggested_group_name = "awesome_group";
- return helper.response(response);
- });
-
- server.get("/topics/private-messages/:username.json", () => {
- return helper.response({
- topic_list: {
- topics: [
- {
- id: 1,
- posters: [],
- notification_level: NotificationLevels.TRACKING,
- unread_posts: 1,
- last_read_post_number: 1,
- highest_post_number: 2,
- },
- {
- id: 2,
- posters: [],
- },
- {
- id: 3,
- posters: [],
- },
- ],
- },
- });
- });
-
- [
- "/topics/private-messages-new/:username.json",
- "/topics/private-messages-unread/:username.json",
- "/topics/private-messages-archive/:username.json",
- "/topics/private-messages-group/:username/:group_name/new.json",
- "/topics/private-messages-group/:username/:group_name/unread.json",
- "/topics/private-messages-group/:username/:group_name/archive.json",
- "/topics/private-messages-tags/:username/:tag_name",
- ].forEach((url) => {
- server.get(url, () => {
- let topics;
-
- if (fetchedNew || fetchedGroupNew || fetchUserNew) {
- topics = [];
- } else {
- topics = [
- { id: 1, posters: [] },
- { id: 2, posters: [] },
- { id: 3, posters: [] },
- ];
- }
-
- return helper.response({
- topic_list: {
- topics,
- },
- });
- });
- });
-
- server.get(
- "/topics/private-messages-group/:username/:group_name.json",
- () => {
- return helper.response({
- topic_list: {
- topics: [
- { id: 1, posters: [] },
- { id: 2, posters: [] },
- ],
- },
- });
- }
- );
-
- server.put("/topics/pm-reset-new", (request) => {
- const requestBody = request.requestBody;
- // No easy way to do this https://github.com/pretenderjs/pretender/issues/159
- if (requestBody === "inbox=group&group_name=awesome_group") {
- fetchedGroupNew = true;
- }
-
- if (requestBody === "inbox=user") {
- fetchUserNew = true;
- }
-
- if (requestBody === "inbox=all") {
- fetchedNew = true;
- }
-
- return helper.response({ topic_ids: [1, 2, 3] });
- });
-
- server.put("/topics/bulk", (request) => {
- const requestBody = request.requestBody;
-
- if (requestBody.includes("private_message_inbox=all")) {
- fetchedNew = true;
- }
-
- if (
- requestBody.includes(
- "private_message_inbox=group&group_name=awesome_group"
- )
- ) {
- fetchedGroupNew = true;
- }
-
- if (requestBody.includes("private_message_inbox=user")) {
- fetchUserNew = true;
- }
-
- return helper.response({
- topic_ids: [1, 2, 3],
- });
- });
- });
-}
-
-const publishReadToMessageBus = function (opts = {}) {
- return publishToMessageBus(
- `/private-message-topic-tracking-state/user/${opts.userId || 5}`,
- {
- topic_id: opts.topicId,
- message_type: "read",
- payload: {
- last_read_post_number: 2,
- highest_post_number: 2,
- notification_level: 2,
- },
- }
- );
-};
-
-const publishUnreadToMessageBus = function (opts = {}) {
- return publishToMessageBus(
- `/private-message-topic-tracking-state/user/${opts.userId || 5}`,
- {
- topic_id: opts.topicId,
- message_type: "unread",
- payload: {
- last_read_post_number: 1,
- highest_post_number: 2,
- notification_level: 2,
- group_ids: opts.groupIds || [],
- },
- }
- );
-};
-
-const publishNewToMessageBus = function (opts = {}) {
- return publishToMessageBus(
- `/private-message-topic-tracking-state/user/${opts.userId || 5}`,
- {
- topic_id: opts.topicId,
- message_type: "new_topic",
- payload: {
- last_read_post_number: null,
- highest_post_number: 1,
- group_ids: opts.groupIds || [],
- },
- }
- );
-};
-
-const publishGroupArchiveToMessageBus = function (opts) {
- return publishToMessageBus(
- `/private-message-topic-tracking-state/group/${opts.groupIds[0]}`,
- {
- topic_id: opts.topicId,
- message_type: "group_archive",
- payload: {
- group_ids: opts.groupIds,
- acting_user_id: opts.actingUserId,
- },
- }
- );
-};
-
-const publishGroupUnreadToMessageBus = function (opts) {
- return publishToMessageBus(
- `/private-message-topic-tracking-state/group/${opts.groupIds[0]}`,
- {
- topic_id: opts.topicId,
- message_type: "unread",
- payload: {
- last_read_post_number: 1,
- highest_post_number: 2,
- notification_level: 2,
- group_ids: opts.groupIds || [],
- },
- }
- );
-};
-
-const publishGroupNewToMessageBus = function (opts) {
- return publishToMessageBus(
- `/private-message-topic-tracking-state/group/${opts.groupIds[0]}`,
- {
- topic_id: opts.topicId,
- message_type: "new_topic",
- payload: {
- last_read_post_number: null,
- highest_post_number: 1,
- group_ids: opts.groupIds || [],
- },
- }
- );
-};
-
acceptance(
"User Private Messages - user with group messages",
function (needs) {
- withGroupMessagesSetup(needs);
+ let fetchedNew;
+ let fetchUserNew;
+ let fetchedGroupNew;
+
+ needs.user({
+ id: 5,
+ username: "charlie",
+ groups: [{ id: 14, name: "awesome_group", has_messages: true }],
+ });
+
+ needs.site({
+ can_tag_pms: true,
+ });
+
+ needs.hooks.afterEach(() => {
+ fetchedNew = false;
+ fetchedGroupNew = false;
+ fetchUserNew = false;
+ });
+
+ needs.pretender((server, helper) => {
+ server.get("/tags/personal_messages/:username.json", () => {
+ return helper.response({ tags: [{ id: "tag1" }] });
+ });
+
+ server.get("/t/13.json", () => {
+ const response = cloneJSON(fixturesByUrl["/t/12/1.json"]);
+ response.suggested_group_name = "awesome_group";
+ return helper.response(response);
+ });
+
+ server.get("/topics/private-messages/:username.json", () => {
+ return helper.response({
+ topic_list: {
+ topics: [
+ {
+ id: 1,
+ posters: [],
+ notification_level: NotificationLevels.TRACKING,
+ unread_posts: 1,
+ last_read_post_number: 1,
+ highest_post_number: 2,
+ },
+ {
+ id: 2,
+ posters: [],
+ },
+ {
+ id: 3,
+ posters: [],
+ },
+ ],
+ },
+ });
+ });
+
+ [
+ "/topics/private-messages-new/:username.json",
+ "/topics/private-messages-unread/:username.json",
+ "/topics/private-messages-archive/:username.json",
+ "/topics/private-messages-group/:username/:group_name/new.json",
+ "/topics/private-messages-group/:username/:group_name/unread.json",
+ "/topics/private-messages-group/:username/:group_name/archive.json",
+ "/topics/private-messages-tags/:username/:tag_name",
+ ].forEach((url) => {
+ server.get(url, () => {
+ let topics;
+
+ if (fetchedNew || fetchedGroupNew || fetchUserNew) {
+ topics = [];
+ } else {
+ topics = [
+ { id: 1, posters: [] },
+ { id: 2, posters: [] },
+ { id: 3, posters: [] },
+ ];
+ }
+
+ return helper.response({
+ topic_list: {
+ topics,
+ },
+ });
+ });
+ });
+
+ server.get(
+ "/topics/private-messages-group/:username/:group_name.json",
+ () => {
+ return helper.response({
+ topic_list: {
+ topics: [
+ { id: 1, posters: [] },
+ { id: 2, posters: [] },
+ ],
+ },
+ });
+ }
+ );
+
+ server.put("/topics/pm-reset-new", (request) => {
+ const requestBody = request.requestBody;
+ // No easy way to do this https://github.com/pretenderjs/pretender/issues/159
+ if (requestBody === "inbox=group&group_name=awesome_group") {
+ fetchedGroupNew = true;
+ }
+
+ if (requestBody === "inbox=user") {
+ fetchUserNew = true;
+ }
+
+ if (requestBody === "inbox=all") {
+ fetchedNew = true;
+ }
+
+ return helper.response({ topic_ids: [1, 2, 3] });
+ });
+
+ server.put("/topics/bulk", (request) => {
+ const requestBody = request.requestBody;
+
+ if (requestBody.includes("private_message_inbox=all")) {
+ fetchedNew = true;
+ }
+
+ if (
+ requestBody.includes(
+ "private_message_inbox=group&group_name=awesome_group"
+ )
+ ) {
+ fetchedGroupNew = true;
+ }
+
+ if (requestBody.includes("private_message_inbox=user")) {
+ fetchUserNew = true;
+ }
+
+ return helper.response({
+ topic_ids: [1, 2, 3],
+ });
+ });
+ });
+
+ const publishReadToMessageBus = function (opts = {}) {
+ return publishToMessageBus(
+ `/private-message-topic-tracking-state/user/${opts.userId || 5}`,
+ {
+ topic_id: opts.topicId,
+ message_type: "read",
+ payload: {
+ last_read_post_number: 2,
+ highest_post_number: 2,
+ notification_level: 2,
+ },
+ }
+ );
+ };
+
+ const publishUnreadToMessageBus = function (opts = {}) {
+ return publishToMessageBus(
+ `/private-message-topic-tracking-state/user/${opts.userId || 5}`,
+ {
+ topic_id: opts.topicId,
+ message_type: "unread",
+ payload: {
+ last_read_post_number: 1,
+ highest_post_number: 2,
+ notification_level: 2,
+ group_ids: opts.groupIds || [],
+ },
+ }
+ );
+ };
+
+ const publishNewToMessageBus = function (opts = {}) {
+ return publishToMessageBus(
+ `/private-message-topic-tracking-state/user/${opts.userId || 5}`,
+ {
+ topic_id: opts.topicId,
+ message_type: "new_topic",
+ payload: {
+ last_read_post_number: null,
+ highest_post_number: 1,
+ group_ids: opts.groupIds || [],
+ },
+ }
+ );
+ };
+
+ const publishGroupArchiveToMessageBus = function (opts) {
+ return publishToMessageBus(
+ `/private-message-topic-tracking-state/group/${opts.groupIds[0]}`,
+ {
+ topic_id: opts.topicId,
+ message_type: "group_archive",
+ payload: {
+ group_ids: opts.groupIds,
+ acting_user_id: opts.actingUserId,
+ },
+ }
+ );
+ };
+
+ const publishGroupUnreadToMessageBus = function (opts) {
+ return publishToMessageBus(
+ `/private-message-topic-tracking-state/group/${opts.groupIds[0]}`,
+ {
+ topic_id: opts.topicId,
+ message_type: "unread",
+ payload: {
+ last_read_post_number: 1,
+ highest_post_number: 2,
+ notification_level: 2,
+ group_ids: opts.groupIds || [],
+ },
+ }
+ );
+ };
+
+ const publishGroupNewToMessageBus = function (opts) {
+ return publishToMessageBus(
+ `/private-message-topic-tracking-state/group/${opts.groupIds[0]}`,
+ {
+ topic_id: opts.topicId,
+ message_type: "new_topic",
+ payload: {
+ last_read_post_number: null,
+ highest_post_number: 1,
+ group_ids: opts.groupIds || [],
+ },
+ }
+ );
+ };
test("incoming group archive message acted by current user", async function (assert) {
await visit("/u/charlie/messages");
@@ -643,6 +639,83 @@ acceptance(
);
});
+ test("suggested messages without new or unread", async function (assert) {
+ await visit("/t/12");
+
+ assert.strictEqual(
+ query(".suggested-topics-message").innerText.trim(),
+ "Want to read more? Browse other messages in personal messages.",
+ "displays the right browse more message"
+ );
+ });
+
+ test("suggested messages with new and unread", async function (assert) {
+ await visit("/t/12");
+
+ await publishNewToMessageBus({ userId: 5, topicId: 1 });
+
+ assert.strictEqual(
+ query(".suggested-topics-message").innerText.trim(),
+ "There is 1 new message remaining, or browse other personal messages",
+ "displays the right browse more message"
+ );
+
+ await publishUnreadToMessageBus({ userId: 5, topicId: 2 });
+
+ assert.strictEqual(
+ query(".suggested-topics-message").innerText.trim(),
+ "There is 1 unread and 1 new message remaining, or browse other personal messages",
+ "displays the right browse more message"
+ );
+
+ await publishReadToMessageBus({ userId: 5, topicId: 2 });
+
+ assert.strictEqual(
+ query(".suggested-topics-message").innerText.trim(),
+ "There is 1 new message remaining, or browse other personal messages",
+ "displays the right browse more message"
+ );
+ });
+
+ test("suggested messages for group messages without new or unread", async function (assert) {
+ await visit("/t/13");
+
+ assert.ok(
+ query(".suggested-topics-message")
+ .innerText.trim()
+ .match(
+ /Want to read more\? Browse other messages in\s+awesome_group\./
+ ),
+ "displays the right browse more message"
+ );
+ });
+
+ test("suggested messages for group messages with new and unread", async function (assert) {
+ await visit("/t/13");
+
+ await publishGroupNewToMessageBus({ groupIds: [14], topicId: 1 });
+
+ assert.ok(
+ query(".suggested-topics-message")
+ .innerText.trim()
+ .match(
+ /There is 1 new message remaining, or browse other messages in\s+awesome_group/
+ ),
+ "displays the right browse more message"
+ );
+
+ await publishGroupUnreadToMessageBus({ groupIds: [14], topicId: 2 });
+
+ assert.ok(
+ query(".suggested-topics-message")
+ .innerText.trim()
+ .match(
+ /There is 1 unread and 1 new message remaining, or browse other messages in\s+awesome_group/
+ ),
+ "displays the right browse more message"
+ );
+ });
+
test("navigating between user messages route with dropdown", async function (assert) {
await visit("/u/Charlie/messages");
@@ -735,95 +808,6 @@ acceptance(
}
);
-acceptance(
- "User Private Messages - user with group messages - Mobile",
- function (needs) {
- withGroupMessagesSetup(needs);
- needs.mobileView();
-
- test("suggested messages without new or unread", async function (assert) {
- await visit("/t/12");
-
- assert.strictEqual(
- query(".suggested-topics-message").innerText.trim(),
- "Want to read more? Browse other messages in personal messages.",
- "displays the right browse more message"
- );
- });
-
- test("suggested messages with new and unread", async function (assert) {
- await visit("/t/12");
-
- await publishNewToMessageBus({ userId: 5, topicId: 1 });
-
- assert.strictEqual(
- query(".suggested-topics-message").innerText.trim(),
- "There is 1 new message remaining, or browse other personal messages",
- "displays the right browse more message"
- );
-
- await publishUnreadToMessageBus({ userId: 5, topicId: 2 });
-
- assert.ok(
- query(".suggested-topics-message")
- .innerText.trim()
- .match(
- /There is 1 unread\s+ and 1 new message remaining, or browse other personal messages/
- ),
- "displays the right browse more message"
- );
-
- await publishReadToMessageBus({ userId: 5, topicId: 2 });
-
- assert.strictEqual(
- query(".suggested-topics-message").innerText.trim(),
- "There is 1 new message remaining, or browse other personal messages",
- "displays the right browse more message"
- );
- });
-
- test("suggested messages for group messages without new or unread", async function (assert) {
- await visit("/t/13");
-
- assert.ok(
- query(".suggested-topics-message")
- .innerText.trim()
- .match(
- /Want to read more\? Browse other messages in\s+awesome_group\./
- ),
- "displays the right browse more message"
- );
- });
-
- test("suggested messages for group messages with new and unread", async function (assert) {
- needs.mobileView();
- await visit("/t/13");
-
- await publishGroupNewToMessageBus({ groupIds: [14], topicId: 1 });
-
- assert.ok(
- query(".suggested-topics-message")
- .innerText.trim()
- .match(
- /There is 1 new message remaining, or browse other messages in\s+awesome_group/
- ),
- "displays the right browse more message"
- );
-
- await publishGroupUnreadToMessageBus({ groupIds: [14], topicId: 2 });
-
- assert.ok(
- query(".suggested-topics-message")
- .innerText.trim()
- .match(
- /There is 1 unread\s+ and 1 new message remaining, or browse other messages in\s+awesome_group/
- ),
- "displays the right browse more message"
- );
- });
- }
-);
-
acceptance("User Private Messages - user with no messages", function (needs) {
needs.user();
diff --git a/app/assets/stylesheets/common/base/topic.scss b/app/assets/stylesheets/common/base/topic.scss
index 6540b894ae0..46dbe81f9b2 100644
--- a/app/assets/stylesheets/common/base/topic.scss
+++ b/app/assets/stylesheets/common/base/topic.scss
@@ -368,39 +368,42 @@ a.badge-category {
max-width: 757px;
}
+.suggested-topics-wrapper.related-messages-wrapper {
+ .suggested-topics:nth-of-type(n + 2) {
+ thead {
+ display: none;
+ }
+ }
+}
+
// Target the .badge-category text, the bullet icon needs to maintain `display: block`
-.more-content-topics h3 .badge-wrapper.bullet span.badge-category,
-.more-content-topics h3 .badge-wrapper.box span,
-.more-content-topics h3 .badge-wrapper.bar span {
+.suggested-topics h3 .badge-wrapper.bullet span.badge-category,
+.suggested-topics h3 .badge-wrapper.box span,
+.suggested-topics h3 .badge-wrapper.bar span {
display: inline;
}
-.more-content-topicss h3 .badge-wrapper.bullet span.badge-category {
+.suggested-topics h3 .badge-wrapper.bullet span.badge-category {
// Override vertical-align: text-top from `badges.css.scss`
vertical-align: baseline;
line-height: var(--line-height-medium);
}
-.more-content-topics h3 .badge-wrapper.bullet,
-.more-content-topics h3 .badge-wrapper.bullet span.badge-category-parent-bg,
-.more-content-topics h3 .badge-wrapper.bullet span.badge-category-bg {
+.suggested-topics h3 .badge-wrapper.bullet,
+.suggested-topics h3 .badge-wrapper.bullet span.badge-category-parent-bg,
+.suggested-topics h3 .badge-wrapper.bullet span.badge-category-bg {
// Top of bullet aligns with top of line - adjust line height to vertically align bullet.
line-height: 0.8;
}
-.more-content-topics .badge-wrapper.bullet span.badge-category,
-.more-content-topics .badge-wrapper.bar span.badge-category {
+.suggested-topics .badge-wrapper.bullet span.badge-category,
+.suggested-topics .badge-wrapper.bar span.badge-category {
max-width: 150px;
}
-.more-content-topics {
- .topic-list-body {
- border-top: none;
-
- .topic-list-item:last-of-type {
- border-bottom: none;
- }
- }
+.suggested-topics .suggested-topics-title {
+ display: flex;
+ align-items: center;
}
.post-links-container {
diff --git a/app/assets/stylesheets/desktop/topic-post.scss b/app/assets/stylesheets/desktop/topic-post.scss
index b998de7272c..16ec5f82095 100644
--- a/app/assets/stylesheets/desktop/topic-post.scss
+++ b/app/assets/stylesheets/desktop/topic-post.scss
@@ -362,17 +362,11 @@ pre.codeblock-buttons:hover {
}
}
-.more-content-wrapper.single-list {
- .more-content-topics {
- width: 100%;
- }
-}
+.suggested-topics {
+ margin: 4.5em 0 1em;
-.more-content-topics {
- margin-top: 2em;
-
- .suggested-topics-message {
- display: none;
+ table {
+ margin-top: 10px;
}
}
diff --git a/app/assets/stylesheets/desktop/topic.scss b/app/assets/stylesheets/desktop/topic.scss
index 5a33ab04bd4..9dd4ea77319 100644
--- a/app/assets/stylesheets/desktop/topic.scss
+++ b/app/assets/stylesheets/desktop/topic.scss
@@ -135,26 +135,3 @@
max-width: 100%;
}
}
-
-.more-content-wrapper {
- display: flex;
- justify-content: space-around;
-
- .topic-list-header,
- .posts-map,
- .views {
- display: none;
- }
-
- .topic-list-body {
- border-top: none;
-
- .topic-list-item {
- padding-left: 5px;
- }
-
- .topic-list-item:last-of-type {
- border-bottom: none;
- }
- }
-}
diff --git a/app/assets/stylesheets/mobile/topic-post.scss b/app/assets/stylesheets/mobile/topic-post.scss
index 3fc6eee640a..2d6db363904 100644
--- a/app/assets/stylesheets/mobile/topic-post.scss
+++ b/app/assets/stylesheets/mobile/topic-post.scss
@@ -252,22 +252,17 @@ a.reply-to-tab {
}
}
-.more-content-wrapper {
- &:not(.single-list) {
- .more-topics-title {
- display: none;
- }
- }
-
- .topic-list-data {
- padding-left: 5px;
- }
-}
-
-.more-content-topics {
+.suggested-topics {
clear: left;
padding: 20px 0 15px 0;
-
+ th.views,
+ td.views,
+ td.activity,
+ th.activity,
+ th.likes,
+ td.likes {
+ display: none;
+ }
a.badge-category,
a.badge-category-parent {
font-size: var(--font-down-1);
diff --git a/config/locales/client.en.yml b/config/locales/client.en.yml
index 0a3cb03adcc..da297da8fa7 100644
--- a/config/locales/client.en.yml
+++ b/config/locales/client.en.yml
@@ -301,12 +301,10 @@ en:
related_messages:
title: "Related Messages"
- pill: "Related Messages"
see_all: 'See
all messages from @%{username}...'
suggested_topics:
- title: "New & Unread Topics"
- pill: "Suggested"
+ title: "Suggested Topics"
pm_title: "Suggested Messages"
about: