From 5d4bb4b54e6cc138eba105ec626870dd6ad9c7b8 Mon Sep 17 00:00:00 2001
From: Keegan George <kgeorge13@gmail.com>
Date: Fri, 24 Jan 2025 12:04:43 +0900
Subject: [PATCH] UX: Improvements to posts route (#30968)

This update makes some small improvements to the posts route front-end.
Specifically, it adds a title to the page, and it improves the
positioning of expand/collapse caret.
---
 .../discourse/app/templates/posts.gjs         | 14 +++++++-----
 .../common/components/post-list.scss          |  7 ++++++
 config/locales/client.en.yml                  |  1 +
 spec/system/page_objects/pages/posts_page.rb  | 22 +++++++++++++++++++
 spec/system/posts_page_spec.rb                | 17 ++++++++++++++
 5 files changed, 56 insertions(+), 5 deletions(-)
 create mode 100644 spec/system/page_objects/pages/posts_page.rb
 create mode 100644 spec/system/posts_page_spec.rb

diff --git a/app/assets/javascripts/discourse/app/templates/posts.gjs b/app/assets/javascripts/discourse/app/templates/posts.gjs
index 879312a5c5b..abdd0d66d7d 100644
--- a/app/assets/javascripts/discourse/app/templates/posts.gjs
+++ b/app/assets/javascripts/discourse/app/templates/posts.gjs
@@ -3,6 +3,7 @@ import { action } from "@ember/object";
 import RouteTemplate from "ember-route-template";
 import PostList from "discourse/components/post-list";
 import Posts from "discourse/models/posts";
+import { i18n } from "discourse-i18n";
 
 export default RouteTemplate(
   class extends Component {
@@ -15,11 +16,14 @@ export default RouteTemplate(
     }
 
     <template>
-      <PostList
-        @posts={{@model}}
-        @fetchMorePosts={{this.loadMorePosts}}
-        @titlePath="topic_html_title"
-      />
+      <section class="posts-page">
+        <h2 class="posts-page__title">{{i18n "post_list.title"}}</h2>
+        <PostList
+          @posts={{@model}}
+          @fetchMorePosts={{this.loadMorePosts}}
+          @titlePath="topic_html_title"
+        />
+      </section>
     </template>
   }
 );
diff --git a/app/assets/stylesheets/common/components/post-list.scss b/app/assets/stylesheets/common/components/post-list.scss
index d2f2400506e..12e5c1d814b 100644
--- a/app/assets/stylesheets/common/components/post-list.scss
+++ b/app/assets/stylesheets/common/components/post-list.scss
@@ -34,6 +34,13 @@
       }
     }
 
+    .expand-item,
+    .collapse-item {
+      padding: 0;
+      margin-right: 0.75rem;
+      margin-top: 0.15rem;
+    }
+
     .stream-topic-title {
       overflow-wrap: anywhere;
     }
diff --git a/config/locales/client.en.yml b/config/locales/client.en.yml
index 830fd98c5f5..8d03dba9db2 100644
--- a/config/locales/client.en.yml
+++ b/config/locales/client.en.yml
@@ -3763,6 +3763,7 @@ en:
       deleted_by_author_simple: "(topic deleted by author)"
 
     post_list:
+      title: "Latest posts"
       empty: "There are no posts"
       aria_post_number: "%{title} - post #%{postNumber}"
 
diff --git a/spec/system/page_objects/pages/posts_page.rb b/spec/system/page_objects/pages/posts_page.rb
new file mode 100644
index 00000000000..b76b14477a8
--- /dev/null
+++ b/spec/system/page_objects/pages/posts_page.rb
@@ -0,0 +1,22 @@
+# frozen_string_literal: true
+
+module PageObjects
+  module Pages
+    class Posts < PageObjects::Pages::Base
+      POSTS_PAGE_SELECTOR = ".posts-page"
+
+      def visit
+        page.visit("/posts")
+        self
+      end
+
+      def has_page_title?
+        page.find("#{POSTS_PAGE_SELECTOR} .posts-page__title")
+      end
+
+      def has_posts?(count)
+        page.has_css?("#{POSTS_PAGE_SELECTOR} .post-list .post-list-item", count: count)
+      end
+    end
+  end
+end
diff --git a/spec/system/posts_page_spec.rb b/spec/system/posts_page_spec.rb
new file mode 100644
index 00000000000..59ce88e5712
--- /dev/null
+++ b/spec/system/posts_page_spec.rb
@@ -0,0 +1,17 @@
+# frozen_string_literal: true
+
+describe "Posts page", type: :system do
+  fab!(:post)
+  fab!(:post_2) { Fabricate(:post) }
+  fab!(:post_3) { Fabricate(:post) }
+  fab!(:user)
+  let(:posts_page) { PageObjects::Pages::Posts.new }
+
+  before { sign_in(user) }
+
+  it "renders the posts page with posts" do
+    posts_page.visit
+    expect(posts_page).to have_page_title
+    expect(posts_page).to have_posts(3)
+  end
+end