From 21d5ee4011695815453c3ec26839ead6a5ba53ea Mon Sep 17 00:00:00 2001
From: DomW <domw30@gmail.com>
Date: Tue, 8 Oct 2024 12:54:27 +0100
Subject: [PATCH] feat(messenger-chat/conversation-previews): handle reaction
 events sent from mobile device (#2345)

* feat(messenger-chat/conversation-previews): handle reaction events sent from mobile device

* refactor: adjust condition for filtering reaction admin messages
---
 src/components/chat-view-container/chat-view.tsx |  4 ++--
 src/lib/chat/chat-message.test.ts                | 13 +++++++++++++
 src/lib/chat/chat-message.ts                     | 15 ++++++++++++---
 3 files changed, 27 insertions(+), 5 deletions(-)

diff --git a/src/components/chat-view-container/chat-view.tsx b/src/components/chat-view-container/chat-view.tsx
index c7fff08a2..874cc3643 100644
--- a/src/components/chat-view-container/chat-view.tsx
+++ b/src/components/chat-view-container/chat-view.tsx
@@ -2,7 +2,7 @@ import React, { Fragment } from 'react';
 import { Waypoint } from 'react-waypoint';
 import classNames from 'classnames';
 import moment from 'moment';
-import { Message as MessageModel, MediaType, EditMessageOptions, Media } from '../../store/messages';
+import { Message as MessageModel, MediaType, EditMessageOptions, Media, AdminMessageType } from '../../store/messages';
 import InvertedScroll from '../inverted-scroll';
 import { Lightbox } from '@zer0-os/zos-component-library';
 import { User } from '../../store/authentication/types';
@@ -140,7 +140,7 @@ export class ChatView extends React.Component<Properties, State> {
 
   renderMessageGroup(groupMessages) {
     return groupMessages.map((message, index) => {
-      if (message.isAdmin) {
+      if (message.isAdmin && message.admin.type !== AdminMessageType.REACTION) {
         return <AdminMessageContainer key={message.optimisticId || message.id} message={message} />;
       } else {
         const messageRenderProps = getMessageRenderProps(
diff --git a/src/lib/chat/chat-message.test.ts b/src/lib/chat/chat-message.test.ts
index 2a10814c9..0d0db3941 100644
--- a/src/lib/chat/chat-message.test.ts
+++ b/src/lib/chat/chat-message.test.ts
@@ -250,6 +250,19 @@ describe(adminMessageText, () => {
 
       expect(adminText).toEqual('Courtney reacted with 10 MEOW');
     });
+
+    it('translates message if amount is not found', () => {
+      const state = getState('current-user', { 'admin-user-id': { id: 'admin-user-id', firstName: 'Courtney' } });
+      const message = {
+        message: 'some message',
+        isAdmin: true,
+        admin: { type: AdminMessageType.REACTION, userId: 'admin-user-id' },
+      } as any;
+
+      const adminText = adminMessageText(message, state);
+
+      expect(adminText).toEqual('Courtney sent a reaction');
+    });
   });
 });
 
diff --git a/src/lib/chat/chat-message.ts b/src/lib/chat/chat-message.ts
index e131e2da1..a5ca80fed 100644
--- a/src/lib/chat/chat-message.ts
+++ b/src/lib/chat/chat-message.ts
@@ -94,12 +94,21 @@ export function adminMessageText(message: Message, state: RootState) {
 }
 
 function translateReaction(admin: { userId?: string; amount?: string }, currentUser, state: RootState) {
-  if (admin.userId === currentUser.id) {
+  const user = denormalizeUser(admin.userId, state);
+
+  if (!admin.amount && admin.userId === currentUser.id) {
+    return 'You sent a reaction';
+  }
+
+  if (!admin.amount && user?.firstName) {
+    return `${user.firstName} sent a reaction`;
+  }
+
+  if (admin.amount && admin.userId === currentUser.id) {
     return `You reacted with ${admin.amount} MEOW`;
   }
 
-  const user = denormalizeUser(admin.userId, state);
-  return user?.firstName ? `${user.firstName} reacted with ${admin.amount} MEOW` : null;
+  return admin.amount && user?.firstName ? `${user.firstName} reacted with ${admin.amount} MEOW` : null;
 }
 
 function translateJoinedZero(admin: { inviteeId?: string; inviterId?: string }, currentUser, state: RootState) {