From 2be1b79e0ad18397fd1f4261d1bb125f9b80e26f Mon Sep 17 00:00:00 2001
From: gabriellsh <40830821+gabriellsh@users.noreply.github.com>
Date: Fri, 18 Sep 2020 17:27:02 -0300
Subject: [PATCH] [FIX] Reaction buttons not behaving properly (#18832)

---
 app/reactions/client/init.js       | 18 +++++++++++++++---
 app/ui-message/client/message.html |  8 +++++---
 app/ui-message/client/message.js   | 19 +++++++++++++++++++
 3 files changed, 39 insertions(+), 6 deletions(-)

diff --git a/app/reactions/client/init.js b/app/reactions/client/init.js
index 756557827e6..36dd81338e8 100644
--- a/app/reactions/client/init.js
+++ b/app/reactions/client/init.js
@@ -10,15 +10,27 @@ import { EmojiPicker } from '../../emoji';
 import { tooltip } from '../../ui/client/components/tooltip';
 
 Template.room.events({
-	'click .add-reaction, click [data-message-action="reaction-message"]'(event) {
+	'click .add-reaction'(event, instance) {
 		event.preventDefault();
 		event.stopPropagation();
 		const data = Blaze.getData(event.currentTarget);
-		const { msg: { rid, _id: mid } } = messageArgs(data);
+		const { msg: { rid, _id: mid, private: isPrivate } } = messageArgs(data);
 		const user = Meteor.user();
 		const room = Rooms.findOne({ _id: rid });
 
-		if (roomTypes.readOnly(room._id, user._id)) {
+		if (!room) {
+			return false;
+		}
+
+		if (!instance.subscription.get()) {
+			return false;
+		}
+
+		if (isPrivate) {
+			return false;
+		}
+
+		if (roomTypes.readOnly(room._id, user._id) && !room.reactWhenReadOnly) {
 			return false;
 		}
 
diff --git a/app/ui-message/client/message.html b/app/ui-message/client/message.html
index 031743f7af0..93663968e85 100644
--- a/app/ui-message/client/message.html
+++ b/app/ui-message/client/message.html
@@ -218,9 +218,11 @@
 						</span>
 					</li>
 				{{/each}}
-				<li class="add-reaction">
-					<span class="icon-people-plus"></span>
-				</li>
+				{{#unless hideAddReaction}}
+					<li class="add-reaction">
+						<span class="icon-people-plus"></span>
+					</li>
+				{{/unless}}
 			</ul>
 			{{/unless}}
 		{{/unless}}
diff --git a/app/ui-message/client/message.js b/app/ui-message/client/message.js
index f7d2b007c47..f546b72071e 100644
--- a/app/ui-message/client/message.js
+++ b/app/ui-message/client/message.js
@@ -323,6 +323,25 @@ Template.message.helpers({
 			return 'hidden';
 		}
 	},
+	hideAddReaction() {
+		const { room, u, msg, subscription } = this;
+
+		if (!room) {
+			return true;
+		}
+
+		if (!subscription) {
+			return true;
+		}
+
+		if (msg.private) {
+			return true;
+		}
+
+		if (roomTypes.readOnly(room._id, u._id) && !room.reactWhenReadOnly) {
+			return true;
+		}
+	},
 	hideMessageActions() {
 		const { msg } = this;