DEV: First pass at messages section experimental sidebar (#17084)

app/assets/javascripts/discourse/app/components/sidebar/messages-section.js

@@ -0,0 +1,17 @@
+import { action } from "@ember/object";
+
+import GlimmerComponent from "discourse/components/glimmer";
+import Composer from "discourse/models/composer";
+import { getOwner } from "discourse-common/lib/get-owner";
+
+export default class SidebarMessagesSection extends GlimmerComponent {
+  @action
+  composePersonalMessage() {
+    const composerArgs = {
+      action: Composer.PRIVATE_MESSAGE,
+      draftKey: Composer.NEW_TOPIC_KEY,
+    };
+
+    getOwner(this).lookup("controller:composer").open(composerArgs);
+  }
+}

app/assets/javascripts/discourse/app/templates/components/sidebar.hbs

@@ -7,6 +7,8 @@
       {{#if this.siteSettings.tagging_enabled}}
         <Sidebar::TagsSection />
       {{/if}}
+
+      <Sidebar::MessagesSection />
     </div>
   </div>
 {{/if}}

app/assets/javascripts/discourse/app/templates/components/sidebar/messages-section.hbs

@@ -0,0 +1,10 @@
+<Sidebar::Section
+  @sectionName="messages"
+  @headerRoute="userPrivateMessages.index"
+  @headerModel={{this.currentUser}}
+  @headerAction={{this.composePersonalMessage}}
+  @headerActionIcon="plus"
+  @headerLinkText={{i18n "sidebar.sections.messages.header_link_text"}}
+  @headerLinkTitle={{i18n "sidebar.sections.messages.header_link_title"}} >
+
+</Sidebar::Section>

app/assets/javascripts/discourse/app/templates/components/sidebar/section.hbs

@@ -4,7 +4,13 @@
       {{d-icon this.headerCaretIcon}}
     </button>
 
-    <LinkTo @route={{@headerRoute}} @query={{@headerQuery}} @class="sidebar-section-header-link" title={{@headerLinkTitle}}>
+    <LinkTo
+      @route={{@headerRoute}}
+      @query={{@headerQuery}}
+      @models={{if @headerModel (array @headerModel) (if @headerModels @headerModels (array))}}
+      @class="sidebar-section-header-link"
+      title={{@headerLinkTitle}}>
+
       {{@headerLinkText}}
     </LinkTo>
 

app/assets/javascripts/discourse/tests/acceptance/sidebar-messages-section-test.js

@@ -0,0 +1,44 @@
+import { click, currentURL, visit } from "@ember/test-helpers";
+
+import {
+  acceptance,
+  conditionalTest,
+  exists,
+} from "discourse/tests/helpers/qunit-helpers";
+import { isLegacyEmber } from "discourse-common/config/environment";
+
+acceptance("Sidebar - Messages Section", function (needs) {
+  needs.user({
+    experimental_sidebar_enabled: true,
+  });
+
+  conditionalTest(
+    "clicking on section header button",
+    !isLegacyEmber(),
+    async function (assert) {
+      await visit("/");
+
+      await click(".sidebar-section-messages .sidebar-section-header-button");
+
+      assert.ok(
+        exists("#reply-control.private-message"),
+        "it opens the composer"
+      );
+    }
+  );
+
+  conditionalTest(
+    "clicking on section header link",
+    !isLegacyEmber(),
+    async function (assert) {
+      await visit("/");
+      await click(".sidebar-section-messages .sidebar-section-header-link");
+
+      assert.strictEqual(
+        currentURL(),
+        `/u/eviltrout/messages`,
+        "it should transistion to the user's messages"
+      );
+    }
+  );
+});

config/locales/client.en.yml

@@ -4041,6 +4041,10 @@ en:
       unread_count: "%{count} unread"
       new_count: "%{count} new"
       sections:
+        messages:
+          header_link_title: "personal messages"
+          header_link_text: "Messages"
+          header_action_title: "create a personal message"
         tags:
           no_tracked_tags: "You are not tracking any tags."
           header_link_title: "all tags"