DEV: Allow custom site activity items in the new /about page (#28400)

This commit introduces a new frontend API to add custom items to the "Site activity" section in the new /about page. The new API is called `addAboutPageActivity` and it works along side the `register_stat` serve-side API which serializes the data that the frontend API consumes. More details of how the two APIs work together is in the JSDoc comment above the API function definition.

Internal topic: t/128545/9.

plugins/chat/assets/javascripts/discourse/initializers/chat-setup.js

@@ -1,3 +1,4 @@
+import { number } from "discourse/lib/formatter";
 import { withPluginApi } from "discourse/lib/plugin-api";
 import { getOwnerWithFallback } from "discourse-common/lib/get-owner";
 import { replaceIcon } from "discourse-common/lib/icon-library";
@@ -163,6 +164,21 @@ export default {
           document.body.classList.remove("chat-drawer-active");
         }
       });
+
+      api.addAboutPageActivity("chat_messages", (periods) => {
+        const count = periods["7_days"];
+        if (count) {
+          return {
+            icon: "comment-dots",
+            class: "chat-messages",
+            activityText: I18n.t("about.activities.chat_messages", {
+              count,
+              formatted_number: number(count),
+            }),
+            period: I18n.t("about.activities.periods.last_7_days"),
+          };
+        }
+      });
     });
   },
 

plugins/chat/config/locales/client.en.yml

@@ -33,6 +33,10 @@ en:
       chat_messages_count: "Chat messages"
       chat_channels_count: "Chat channels"
       chat_users_count: "Chat users"
+      activities:
+        chat_messages:
+          one: "%{formatted_number} chat message"
+          other: "%{formatted_number} chat messages"
 
     chat:
       text_copied: Text copied to clipboard

plugins/chat/plugin.rb

@@ -18,6 +18,7 @@ register_asset "stylesheets/mobile/index.scss", :mobile
 
 register_svg_icon "comments"
 register_svg_icon "comment-slash"
+register_svg_icon "comment-dots"
 register_svg_icon "lock"
 register_svg_icon "clipboard"
 register_svg_icon "file-audio"

plugins/chat/spec/system/about_page_site_acitivity_spec.rb

@@ -0,0 +1,30 @@
+# frozen_string_literal: true
+
+describe "Chat messages site activity in the about page", type: :system do
+  fab!(:current_user) { Fabricate(:user) }
+  fab!(:group) { Fabricate(:group, users: [current_user]) }
+
+  let(:about_page) { PageObjects::Pages::About.new }
+
+  before do
+    chat_system_bootstrap
+    SiteSetting.experimental_redesigned_about_page_groups = group.id.to_s
+    sign_in(current_user)
+
+    Fabricate(:chat_message, created_at: 5.hours.ago)
+    Fabricate(:chat_message, created_at: 2.days.ago)
+    Fabricate(:chat_message, created_at: 6.days.ago)
+    Fabricate(:chat_message, created_at: 9.days.ago)
+  end
+
+  it "displays the number of chat messages in the last 7 days" do
+    about_page.visit
+
+    expect(about_page.site_activities.custom("chat-messages")).to have_custom_count(
+      I18n.t("js.about.activities.chat_messages", count: 3, formatted_number: "3"),
+    )
+    expect(about_page.site_activities.custom("chat-messages")).to have_custom_period(
+      I18n.t("js.about.activities.periods.last_7_days"),
+    )
+  end
+end