From 6604a7a508bb3bac0596c3050a8302851b6bb131 Mon Sep 17 00:00:00 2001
From: Khushal Agarwal <khushal.agarwal987@gmail.com>
Date: Mon, 8 Jul 2024 11:30:09 +0530
Subject: [PATCH] fix: channel preview update on new message when coming from
 BG to FG

---
 .../components/ChannelPreview/ChannelPreview.tsx  |  2 +-
 .../hooks/useLatestMessagePreview.ts              | 15 ++++++++++-----
 package/src/utils/utils.ts                        |  6 +++++-
 3 files changed, 16 insertions(+), 7 deletions(-)

diff --git a/package/src/components/ChannelPreview/ChannelPreview.tsx b/package/src/components/ChannelPreview/ChannelPreview.tsx
index 4f1be10cf9..1f8d645d91 100644
--- a/package/src/components/ChannelPreview/ChannelPreview.tsx
+++ b/package/src/components/ChannelPreview/ChannelPreview.tsx
@@ -42,7 +42,7 @@ const ChannelPreviewWithContext = <
   const [forceUpdate, setForceUpdate] = useState(0);
   const [unread, setUnread] = useState(channel.countUnread());
 
-  const latestMessagePreview = useLatestMessagePreview(channel, forceUpdate);
+  const latestMessagePreview = useLatestMessagePreview(channel, forceUpdate, lastMessage);
 
   const channelLastMessage = channel.lastMessage();
   const channelLastMessageString = `${channelLastMessage?.id}${channelLastMessage?.updated_at}`;
diff --git a/package/src/components/ChannelPreview/hooks/useLatestMessagePreview.ts b/package/src/components/ChannelPreview/hooks/useLatestMessagePreview.ts
index 29c69a5622..2d34b3c7c9 100644
--- a/package/src/components/ChannelPreview/hooks/useLatestMessagePreview.ts
+++ b/package/src/components/ChannelPreview/hooks/useLatestMessagePreview.ts
@@ -8,6 +8,7 @@ import { useTranslationContext } from '../../../contexts/translationContext/Tran
 
 import { useTranslatedMessage } from '../../../hooks/useTranslatedMessage';
 import type { DefaultStreamChatGenerics } from '../../../types/types';
+import { stringifyMessage } from '../../../utils/utils';
 
 type LatestMessage<
   StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
@@ -218,18 +219,22 @@ export const useLatestMessagePreview = <
 >(
   channel: Channel<StreamChatGenerics>,
   forceUpdate: number,
+  lastMessage?:
+    | ReturnType<ChannelState<StreamChatGenerics>['formatMessage']>
+    | MessageResponse<StreamChatGenerics>,
 ) => {
   const { client } = useChatContext<StreamChatGenerics>();
   const { t } = useTranslationContext();
 
   const channelConfigExists = typeof channel?.getConfig === 'function';
 
-  const messages = channel.state.messages;
-  const message = messages.length ? messages[messages.length - 1] : undefined;
-
-  const translatedLastMessage = useTranslatedMessage<StreamChatGenerics>(message);
+  const translatedLastMessage = useTranslatedMessage<StreamChatGenerics>(
+    lastMessage || ({} as MessageResponse<StreamChatGenerics>),
+  );
 
-  const channelLastMessageString = `${message?.id}${message?.updated_at}`;
+  const channelLastMessageString = translatedLastMessage
+    ? stringifyMessage(translatedLastMessage)
+    : '';
 
   const [readEvents, setReadEvents] = useState(true);
   const [latestMessagePreview, setLatestMessagePreview] = useState<
diff --git a/package/src/utils/utils.ts b/package/src/utils/utils.ts
index 059049a026..bcec4894e2 100644
--- a/package/src/utils/utils.ts
+++ b/package/src/utils/utils.ts
@@ -9,6 +9,7 @@ import type {
   ChannelMemberResponse,
   CommandResponse,
   FormatMessageResponse,
+  MessageResponse,
   StreamChat,
   UserResponse,
 } from 'stream-chat';
@@ -614,7 +615,10 @@ export const stringifyMessage = <
   text,
   type,
   updated_at,
-}: FormatMessageResponse<StreamChatGenerics> | MessageType<StreamChatGenerics>): string =>
+}:
+  | MessageResponse<StreamChatGenerics>
+  | FormatMessageResponse<StreamChatGenerics>
+  | MessageType<StreamChatGenerics>): string =>
   `${
     latest_reactions ? latest_reactions.map(({ type, user }) => `${type}${user?.id}`).join() : ''
   }${