[FIX] Ignored messages (#14465)

* Update styles for ignored messages

* Toggle ignored message visibility from thread tab

* Force main thread message to not be ignored

app/theme/client/imports/components/messages.css

@@ -49,8 +49,37 @@
 		display: none;
 	}
 
-	&--ignored {
-		& .body {
+	&&--ignored {
+		min-height: 25px;
+		padding: 2px 50px 2px 70px;
+
+		font-size: 12px;
+
+		& > .thumb {
+			top: 3px;
+
+			width: 20px;
+			height: 20px;
+			margin-left: 16px;
+
+			& .avatar {
+				width: 100%;
+				height: 100%;
+			}
+		}
+
+		& .user {
+			font-size: 0.75rem;
+			font-weight: initial;
+		}
+
+		& .message-body-wrapper .body,
+		& .message-oembed,
+		& .attachment,
+		& .message-discussion,
+		& .reactions,
+		& .edited,
+		& .role-tag {
 			display: none;
 		}
 

app/threads/client/flextab/thread.html

@@ -21,7 +21,7 @@
 					{{> loading}}
 				</li>
 				{{else}}
-						{{> message groupable=false hideRoles=true msg=mainMessage room=room subscription=subscription settings=settings customClass="thread-message" templatePrefix='thread-' customClass="thread-main" u=u}}
+						{{> message groupable=false hideRoles=true msg=mainMessage room=room subscription=subscription settings=settings customClass="thread-message" templatePrefix='thread-' customClass="thread-main" u=u ignored=false}}
 						{{#each msg in messages}}
 							{{> message hideRoles=true msg=msg room=room subscription=subscription settings=settings templatePrefix='thread-' u=u context="threads"}}
 						{{/each}}

app/threads/client/flextab/thread.js

@@ -32,6 +32,10 @@ Template.thread.events({
 		const { atBottom } = this;
 		atBottom && this.sendToBottom();
 	},
+	'click .toggle-hidden'(e) {
+		const id = e.currentTarget.dataset.message;
+		document.querySelector(`#thread-${ id }`).classList.toggle('message--ignored');
+	},
 });
 
 Template.thread.helpers({

app/threads/client/flextab/threads.html

@@ -20,6 +20,7 @@
 							showDateSeparator=false
 							context="threads"
 							timeAgo=true
+							ignored=false
 						}}
 					{{/each}}
 				</ul>

app/ui-message/client/message.js

@@ -118,12 +118,14 @@ Template.message.helpers({
 		return !msg.private && !msg.t && msg.u._id !== u._id && room && room.broadcast;
 	},
 	isIgnored() {
-		const { msg } = this;
-		return msg.ignored;
+		const { ignored, msg } = this;
+		const isIgnored = typeof ignored !== 'undefined' ? ignored : msg.ignored;
+		return isIgnored;
 	},
 	ignoredClass() {
-		const { msg } = this;
-		return msg.ignored ? 'message--ignored' : '';
+		const { ignored, msg } = this;
+		const isIgnored = typeof ignored !== 'undefined' ? ignored : msg.ignored;
+		return isIgnored ? 'message--ignored' : '';
 	},
 	isDecrypting() {
 		const { msg } = this;