From 637b1211b5c06e32050ff138d68e92415e3279d6 Mon Sep 17 00:00:00 2001
From: Alan Guo Xiang Tan <gxtan1990@gmail.com>
Date: Wed, 5 Oct 2022 14:19:46 +0800
Subject: [PATCH] DEV: Convert experimental user page activity nav to
 horizontal nav (#18483)

As usual, design is still in flux so no tests for now.

Internal Ref: /t/67780/59
---
 .../discourse/app/components/user-nav.hbs     | 44 +++----------------
 .../app/components/user-nav/messages-nav.hbs  |  2 +-
 .../discourse/app/templates/user/activity.hbs | 40 ++++++++++++++++-
 .../app/templates/user/notifications.hbs      |  2 +-
 4 files changed, 46 insertions(+), 42 deletions(-)

diff --git a/app/assets/javascripts/discourse/app/components/user-nav.hbs b/app/assets/javascripts/discourse/app/components/user-nav.hbs
index 6988e134fa2..e5f45b102df 100644
--- a/app/assets/javascripts/discourse/app/components/user-nav.hbs
+++ b/app/assets/javascripts/discourse/app/components/user-nav.hbs
@@ -9,44 +9,12 @@
           </LinkTo>
         </li>
 
-        <UserNav::DropdownList
-          @icon="stream"
-          @text={{i18n "user.activity_stream"}}
-          @isActive={{eq @currentParentRoute "userActivity"}}
-          @class="user-activity" >
-
-          <:submenu>
-            <DNavigationItem @route="userActivity.index">{{i18n "user.filters.all"}}</DNavigationItem>
-            <DNavigationItem @route="userActivity.topics">{{i18n "user_action_groups.4"}}</DNavigationItem>
-            <DNavigationItem @route="userActivity.replies">{{i18n "user_action_groups.5"}}</DNavigationItem>
-
-            {{#if @showRead}}
-              <DNavigationItem @route="userActivity.read" @title={{i18n "user.read_help"}}>
-                {{i18n "user.read"}}
-              </DNavigationItem>
-            {{/if}}
-
-            {{#if @showDrafts}}
-              <DNavigationItem @route="userActivity.drafts">
-                {{this.draftLabel}}
-              </DNavigationItem>
-            {{/if}}
-
-            {{#if (gt @user.pending_posts_count 0)}}
-              <DNavigationItem @route="userActivity.pending">
-                {{this.pendingLabel}}
-              </DNavigationItem>
-            {{/if}}
-
-            <DNavigationItem @route="userActivity.likesGiven">{{i18n "user_action_groups.1"}}</DNavigationItem>
-
-            {{#if @showBookmarks}}
-              <DNavigationItem @route="userActivity.bookmarks">{{i18n "user_action_groups.3"}}</DNavigationItem>
-            {{/if}}
-
-            <PluginOutlet @name="user-activity-bottom" @tagName="span" @connectorTagName="li" @args={{hash model=@user}} />
-          </:submenu>
-        </UserNav::DropdownList>
+        <li class="user-activity">
+          <LinkTo @route="userActivity">
+            {{d-icon "stream"}}
+            {{i18n "user.activity_stream"}}
+          </LinkTo>
+        </li>
       {{/unless}}
 
       {{#if @showNotificationsTab}}
diff --git a/app/assets/javascripts/discourse/app/components/user-nav/messages-nav.hbs b/app/assets/javascripts/discourse/app/components/user-nav/messages-nav.hbs
index a35091d7a7d..e0744b6030f 100644
--- a/app/assets/javascripts/discourse/app/components/user-nav/messages-nav.hbs
+++ b/app/assets/javascripts/discourse/app/components/user-nav/messages-nav.hbs
@@ -88,7 +88,7 @@
       {{/if}}
     {{/if}}
 
-    <PluginOutlet @name="user-messages-nav" @tagName="span" @connectorTagName="li" @args={{hash model=@user}} />
+    <PluginOutlet @name="user-messages-nav" @connectorTagName="li" @args={{hash model=@user}} />
   </ul>
 
   {{#if this.site.desktopView}}
diff --git a/app/assets/javascripts/discourse/app/templates/user/activity.hbs b/app/assets/javascripts/discourse/app/templates/user/activity.hbs
index a115f1cf064..18a0971b365 100644
--- a/app/assets/javascripts/discourse/app/templates/user/activity.hbs
+++ b/app/assets/javascripts/discourse/app/templates/user/activity.hbs
@@ -1,4 +1,40 @@
-{{#unless this.currentUser.redesigned_user_page_nav_enabled}}
+{{#if this.currentUser.redesigned_user_page_nav_enabled}}
+  <DSection @pageClass="user-activity" />
+
+  <div class="user-navigation-container">
+    <ul id="navigation-bar" class="nav-pills action-list">
+      <DNavigationItem @route="userActivity.index">{{i18n "user.filters.all"}}</DNavigationItem>
+      <DNavigationItem @route="userActivity.topics">{{i18n "user_action_groups.4"}}</DNavigationItem>
+      <DNavigationItem @route="userActivity.replies">{{i18n "user_action_groups.5"}}</DNavigationItem>
+
+      {{#if this.user.showRead}}
+        <DNavigationItem @route="userActivity.read" @title={{i18n "user.read_help"}}>
+          {{i18n "user.read"}}
+        </DNavigationItem>
+      {{/if}}
+
+      {{#if this.user.showDrafts}}
+        <DNavigationItem @route="userActivity.drafts">
+          {{this.draftLabel}}
+        </DNavigationItem>
+      {{/if}}
+
+      {{#if (gt this.model.pending_posts_count 0)}}
+        <DNavigationItem @route="userActivity.pending">
+          {{this.pendingLabel}}
+        </DNavigationItem>
+      {{/if}}
+
+      <DNavigationItem @route="userActivity.likesGiven">{{i18n "user_action_groups.1"}}</DNavigationItem>
+
+      {{#if this.user.showBookmarks}}
+        <DNavigationItem @route="userActivity.bookmarks">{{i18n "user_action_groups.3"}}</DNavigationItem>
+      {{/if}}
+
+      <PluginOutlet @name="user-activity-bottom" @connectorTagName="li" @args={{hash model=this.model}} />
+    </ul>
+  </div>
+{{else}}
   <DSection @pageClass="user-activity" @class="user-secondary-navigation" @scrollTop={{false}}>
     <nav role="navigation">
       <MobileNav @class="activity-nav" @desktopClass="action-list activity-list nav-stacked">
@@ -40,7 +76,7 @@
       <DButton @action={{action "exportUserArchive"}} @class="btn-default" @label="user.download_archive.button_text" @icon="download" />
     </section>
   {{/if}}
-{{/unless}}
+{{/if}}
 
 <section class="user-content">
   {{outlet}}
diff --git a/app/assets/javascripts/discourse/app/templates/user/notifications.hbs b/app/assets/javascripts/discourse/app/templates/user/notifications.hbs
index 462340cf054..a1ba2bbf290 100644
--- a/app/assets/javascripts/discourse/app/templates/user/notifications.hbs
+++ b/app/assets/javascripts/discourse/app/templates/user/notifications.hbs
@@ -35,7 +35,7 @@
         </LinkTo>
       </li>
 
-      <PluginOutlet @name="user-notifications-bottom" @tagName="span" @connectorTagName="li" @args={{hash model=this.model}} />
+      <PluginOutlet @name="user-notifications-bottom" @connectorTagName="li" @args={{hash model=this.model}} />
     </ul>
 
     {{#if this.model}}