FIX: set channels tab as default on mobile chat footer (#25296)

This change moves the "Channels" tab to first position in the chat footer nav, and loads it as the default page when opening chat for the first time on mobile.

plugins/chat/assets/javascripts/discourse/components/chat-footer.gjs

@@ -42,6 +42,19 @@ export default class ChatFooter extends Component {
   <template>
     {{#if this.shouldRenderFooter}}
       <nav class="c-footer" {{this.updateThreadCount}}>
+        <DButton
+          @route="chat.channels"
+          @class={{concatClass
+            "btn-flat"
+            "c-footer__item"
+            (if (eq this.router.currentRouteName "chat.channels") "--active")
+          }}
+          @icon="comments"
+          @id="c-footer-channels"
+          @translatedLabel={{i18n "chat.channel_list.title"}}
+          aria-label={{i18n "chat.channel_list.aria_label"}}
+        />
+
         {{#if this.directMessagesEnabled}}
           <DButton
             @route="chat.direct-messages"
@@ -60,19 +73,6 @@ export default class ChatFooter extends Component {
           />
         {{/if}}
 
-        <DButton
-          @route="chat.channels"
-          @class={{concatClass
-            "btn-flat"
-            "c-footer__item"
-            (if (eq this.router.currentRouteName "chat.channels") "--active")
-          }}
-          @icon="comments"
-          @id="c-footer-channels"
-          @translatedLabel={{i18n "chat.channel_list.title"}}
-          aria-label={{i18n "chat.channel_list.aria_label"}}
-        />
-
         {{#if this.threadsEnabled}}
           <DButton
             @route="chat.threads"

plugins/chat/assets/javascripts/discourse/routes/chat-index.js

@@ -13,11 +13,7 @@ export default class ChatIndexRoute extends DiscourseRoute {
   redirect() {
     // on mobile redirect user to the first footer tab route
     if (this.site.mobileView) {
-      if (this.chat.userCanAccessDirectMessages) {
+      return this.router.replaceWith("chat.channels");
-        return this.router.replaceWith("chat.direct-messages");
-      } else {
-        return this.router.replaceWith("chat.channels");
-      }
     }
 
     // We are on desktop. Check for a channel to enter and transition if so

plugins/chat/spec/system/browse_page_spec.rb

@@ -69,7 +69,7 @@ RSpec.describe "Browse page", type: :system do
         chat_page.visit_browse
         find(".c-navbar__back-button").click
 
-        expect(browse_page).to have_current_path("/chat/direct-messages")
+        expect(browse_page).to have_current_path("/chat/channels")
       end
     end
 

plugins/chat/spec/system/chat_footer_spec.rb

@@ -29,11 +29,11 @@ RSpec.describe "Chat footer on mobile", type: :system, mobile: true do
       expect(page).to have_no_css(".c-footer")
     end
 
-    it "redirects the user to the direct messages tab" do
+    it "redirects the user to the channels tab" do
       visit("/")
       chat_page.open_from_header
 
-      expect(page).to have_current_path("/chat/direct-messages")
+      expect(page).to have_current_path("/chat/channels")
     end
 
     it "shows threads tab when user has threads" do

plugins/chat/spec/system/list_channels/mobile_spec.rb

@@ -63,7 +63,7 @@ RSpec.describe "List channels | mobile", type: :system, mobile: true do
 
       context "when member of the channel" do
         it "shows the channel in the correct section" do
-          visit("/chat")
+          visit("/chat/direct-messages")
           expect(page.find(".direct-message-channels")).to have_content(current_user.username)
         end
       end

plugins/chat/spec/system/message_notifications_mobile_spec.rb

@@ -118,7 +118,7 @@ RSpec.describe "Message notifications - mobile", type: :system, mobile: true do
 
         context "when a message is created" do
           it "correctly renders notifications" do
-            visit("/chat")
+            visit("/chat/direct-messages")
 
             create_message(dm_channel_1, user: user_1)
 
@@ -139,7 +139,7 @@ RSpec.describe "Message notifications - mobile", type: :system, mobile: true do
           end
 
           it "reorders channels" do
-            visit("/chat")
+            visit("/chat/direct-messages")
 
             expect(page).to have_css(
               ".chat-channel-row:nth-child(1)[data-chat-channel-id=\"#{dm_channel_1.id}\"]",

plugins/chat/spec/system/navigation_spec.rb

@@ -38,11 +38,11 @@ RSpec.describe "Navigation", type: :system do
   end
 
   context "when clicking chat icon on mobile and is viewing channel" do
-    it "navigates to direct messages tab", mobile: true do
+    it "navigates to channels tab", mobile: true do
       chat_page.visit_channel(category_channel_2)
       chat_page.open_from_header
 
-      expect(page).to have_current_path("/chat/direct-messages")
+      expect(page).to have_current_path("/chat/channels")
     end
   end