fix: memoize the read_vevents calculation to make it save a rerender (#3008)

Author: khushal87

package/src/components/ChannelPreview/hooks/useLatestMessagePreview.ts

@@ -1,4 +1,4 @@
-import { useEffect, useMemo, useState } from 'react';
+import { useMemo } from 'react';
 
 import { TFunction } from 'i18next';
 import type {
@@ -285,21 +285,19 @@ export const useLatestMessagePreview = <
     ? stringifyMessage(translatedLastMessage)
     : '';
 
-  const [readEvents, setReadEvents] = useState(true);
+  const readEvents = useMemo(() => {
+    if (!channelConfigExists) {
+      return true;
+    }
+    const read_events = !channel.disconnected && !!channel?.id && channel.getConfig()?.read_events;
+    if (typeof read_events !== 'boolean') {
+      return true;
+    }
+    return read_events;
+  }, [channelConfigExists, channel]);
 
   const readStatus = getLatestMessageReadStatus(channel, client, translatedLastMessage, readEvents);
 
-  useEffect(() => {
-    if (channelConfigExists) {
-      const read_events =
-        !channel.disconnected && !!channel?.id && channel.getConfig()?.read_events;
-      if (typeof read_events === 'boolean') {
-        setReadEvents(read_events);
-      }
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [channelConfigExists]);
-
   const pollId = lastMessage?.poll_id ?? '';
   const poll = client.polls.fromState(pollId);
   const pollState: LatestMessagePreviewSelectorReturnType =

package/src/hooks/useTranslatedMessage.ts

@@ -10,9 +10,7 @@ export const useTranslatedMessage = <
 >(
   message?: MessageResponse<StreamChatGenerics> | FormatMessageResponse<StreamChatGenerics>,
 ) => {
-  const { userLanguage: translationContextUserLanguage } = useTranslationContext();
-
-  const userLanguage = translationContextUserLanguage;
+  const { userLanguage } = useTranslationContext();
 
   const translationKey: TranslationKey = `${userLanguage}_text`;