FIX: re-adds favorite reactions on mobile (#30746)

This feature has been mistakenly removed in
6740a340ca

<img width="382" alt="Screenshot 2025-01-13 at 20 49 03"
src="https://github.com/user-attachments/assets/9710255d-3a1b-4e52-9acc-4e9c410db1b9"
/>

plugins/chat/assets/javascripts/discourse/components/chat-message-actions-desktop.gjs

@@ -18,7 +18,6 @@ import DropdownSelectBox from "select-kit/components/dropdown-select-box";
 import ChatMessageReaction from "discourse/plugins/chat/discourse/components/chat-message-reaction";
 import chatMessageContainer from "discourse/plugins/chat/discourse/lib/chat-message-container";
 import ChatMessageInteractor from "discourse/plugins/chat/discourse/lib/chat-message-interactor";
-import ChatMessageReactionModel from "discourse/plugins/chat/discourse/models/chat-message-reaction";
 
 const MSG_ACTIONS_VERTICAL_PADDING = -10;
 const FULL = "full";
@@ -28,29 +27,11 @@ const REDUCED_WIDTH_THRESHOLD = 500;
 export default class ChatMessageActionsDesktop extends Component {
   @service chat;
   @service site;
-  @service siteSettings;
-  @service emojiStore;
 
   @tracked size = FULL;
 
   popper = null;
 
-  get favoriteReactions() {
-    const defaultReactions = this.siteSettings.default_emoji_reactions
-      .split("|")
-      .filter(Boolean);
-
-    return this.emojiStore
-      .favoritesForContext(`channel_${this.message.channel.id}`)
-      .concat(defaultReactions)
-      .slice(0, 3)
-      .map(
-        (emoji) =>
-          this.message.reactions.find((reaction) => reaction.emoji === emoji) ||
-          ChatMessageReactionModel.create({ emoji })
-      );
-  }
-
   get message() {
     return this.chat.activeMessage.model;
   }
@@ -156,7 +137,7 @@ export default class ChatMessageActionsDesktop extends Component {
           }}
         >
           {{#if this.shouldRenderFavoriteReactions}}
-            {{#each this.favoriteReactions as |reaction|}}
+            {{#each this.messageInteractor.emojiReactions as |reaction|}}
               <ChatMessageReaction
                 @reaction={{reaction}}
                 @onReaction={{this.messageInteractor.react}}

plugins/chat/assets/javascripts/discourse/lib/chat-message-interactor.js

@@ -15,7 +15,9 @@ import { i18n } from "discourse-i18n";
 import { MESSAGE_CONTEXT_THREAD } from "discourse/plugins/chat/discourse/components/chat-message";
 import ChatMessageFlag from "discourse/plugins/chat/discourse/lib/chat-message-flag";
 import ChatMessage from "discourse/plugins/chat/discourse/models/chat-message";
-import { REACTIONS } from "discourse/plugins/chat/discourse/models/chat-message-reaction";
+import ChatMessageReactionModel, {
+  REACTIONS,
+} from "discourse/plugins/chat/discourse/models/chat-message-reaction";
 
 const removedSecondaryActions = new Set();
 
@@ -41,9 +43,11 @@ export default class ChatemojiReactions {
   @service router;
   @service modal;
   @service capabilities;
+  @service siteSettings;
   @service menu;
   @service toasts;
   @service interactedChatMessage;
+  @service emojiStore;
 
   @tracked message = null;
   @tracked context = null;
@@ -55,6 +59,22 @@ export default class ChatemojiReactions {
     this.context = context;
   }
 
+  get emojiReactions() {
+    const defaultReactions = this.siteSettings.default_emoji_reactions
+      .split("|")
+      .filter(Boolean);
+
+    return this.emojiStore
+      .favoritesForContext(`channel_${this.message.channel.id}`)
+      .concat(defaultReactions)
+      .slice(0, 3)
+      .map(
+        (emoji) =>
+          this.message.reactions.find((reaction) => reaction.emoji === emoji) ||
+          ChatMessageReactionModel.create({ emoji })
+      );
+  }
+
   get pane() {
     return this.context === MESSAGE_CONTEXT_THREAD
       ? this.chatThreadPane

plugins/chat/spec/system/react_to_message_spec.rb

@@ -118,7 +118,7 @@ RSpec.describe "React to message", type: :system do
           end
         end
 
-        context "when using frequent reactions" do
+        context "when using favorite reactions" do
           it "adds a reaction" do
             sign_in(current_user)
             chat.visit_channel(category_channel_1)
@@ -132,6 +132,19 @@ RSpec.describe "React to message", type: :system do
         end
       end
     end
+
+    context "when mobile", mobile: true do
+      context "when using favorite reactions" do
+        it "adds a reaction" do
+          sign_in(current_user)
+          chat.visit_channel(category_channel_1)
+          channel.expand_message_actions_mobile(message_1)
+          find(".main-actions [data-emoji-name=\"+1\"]").click
+
+          expect(channel.message_reactions_list(message_1)).to have_css("[data-emoji-name=\"+1\"]")
+        end
+      end
+    end
   end
 
   context "when current user and another have reacted" do