chore/Fix: Ensure members list updates simultaneously when a new member is added

packages/react/src/hooks/useFetchChatData.js

@@ -23,6 +23,7 @@ const useFetchChatData = (showRoles) => {
   const setViewUserInfoPermissions = useUserStore(
     (state) => state.setViewUserInfoPermissions
   );
+  const setMembersHandler = useMemberStore((state) => state.setMembersHandler);
 
   const getMessagesAndRoles = useCallback(
     async (anonymousMode) => {
@@ -107,7 +108,24 @@ const useFetchChatData = (showRoles) => {
     [isUserAuthenticated, RCInstance, setStarredMessages]
   );
 
-  return { getMessagesAndRoles, getStarredMessages };
+  const getChannelMembers = useCallback(
+    async (anonymousMode) => {
+      if (isUserAuthenticated) {
+        try {
+          if (!isUserAuthenticated && !anonymousMode) {
+            return;
+          }
+          const { members } = await RCInstance.getChannelMembers();
+          setMembersHandler(members);
+        } catch (e) {
+          console.error(e);
+        }
+      }
+    },
+    [RCInstance, setMembersHandler, isUserAuthenticated]
+  );
+
+  return { getMessagesAndRoles, getStarredMessages, getChannelMembers };
 };
 
 export default useFetchChatData;

packages/react/src/views/Message/MessageHeader.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useEffect } from 'react';
 import PropTypes from 'prop-types';
 import { format } from 'date-fns';
 import {
@@ -13,6 +13,7 @@ import { useMemberStore, useUserStore } from '../../store';
 import { getMessageHeaderStyles } from './Message.styles';
 import useDisplayNameColor from '../../hooks/useDisplayNameColor';
 import { useRCContext } from '../../context/RCInstance';
+import useFetchChatData from '../../hooks/useFetchChatData';
 
 const MessageHeader = ({
   message,
@@ -33,6 +34,10 @@ const MessageHeader = ({
   const showName = ECOptions?.showName;
   const channelLevelRoles = useMemberStore((state) => state.memberRoles);
   const admins = useMemberStore((state) => state.admins);
+  const { getChannelMembers } = useFetchChatData();
+  useEffect(() => {
+    getChannelMembers();
+  }, [getChannelMembers]);
 
   const isPinned = message.pinned;
   const isStarred =