Sprint 39

package.json

@@ -175,6 +175,7 @@
     "identity-obj-proxy": "^3.0.0",
     "jest": "^27.5.1",
     "jest-extended": "^2.0.0",
+    "jest-fetch-mock": "^3.0.3",
     "lint-staged": ">=10",
     "prettier": "^2.1.1",
     "prop-types": "^15.8.1",

src/pages/OldCommon/components/CommonDetailContainer/MembersComponent/CommonMemberComponent.tsx

@@ -122,11 +122,13 @@ const CommonMember: FC<CommonMemberProps> = ({
             </div>
           </div>
         </div>
-        <div className="members__section__common-member-date">
-          {joinedAt
-            .toDate()
-            .toLocaleDateString("en-US", { month: "short", day: "numeric" })}
-        </div>
+        {joinedAt && joinedAt.toDate && (
+          <div className="members__section__common-member-date">
+            {joinedAt
+              ?.toDate()
+              .toLocaleDateString("en-US", { month: "short", day: "numeric" })}
+          </div>
+        )}
         <MemberDropdown
           notMemberCircles={notMemberCircles}
           memberName={memberName}

src/pages/OldCommon/components/CommonDetailContainer/MembersComponent/MembersComponent.tsx

@@ -39,7 +39,7 @@ const MembersComponent: FC<MembersComponentProps> = ({ common }) => {
     () =>
       [...commonMembers].sort(
         (commonMember, prevCommonMember) =>
-          prevCommonMember.joinedAt.seconds - commonMember.joinedAt.seconds,
+          prevCommonMember.joinedAt?.seconds - commonMember.joinedAt?.seconds,
       ),
     [commonMembers],
   );

src/pages/OldCommon/hooks/useCommonMember.ts

@@ -141,6 +141,7 @@ export const useCommonMember = (options: Options = {}): Return => {
             loading: false,
             fetched: true,
             data: {
+              commonId,
               ...commonMember,
               ...generateCirclesDataForCommonMember(
                 governance.circles,
@@ -189,7 +190,7 @@ export const useCommonMember = (options: Options = {}): Return => {
         }
       }
     },
-    [state, userId],
+    [state, userId, commonId],
   );
 
   const setCommonMember = useCallback(

src/pages/OldCommon/hooks/useCommonMembers.ts

@@ -1,5 +1,6 @@
 import { useCallback, useRef, useState } from "react";
 import { useDispatch, useSelector } from "react-redux";
+import { trace } from "firebase/performance";
 import { CommonService, Logger, UserService } from "@/services";
 import { store } from "@/shared/appConfig";
 import { LoadingState } from "@/shared/interfaces";
@@ -10,6 +11,7 @@ import {
   selectUserStates,
 } from "@/store/states";
 import { useDeepCompareEffect } from "react-use";
+import { perf } from "@/shared/utils/firebase";
 
 interface Options {
   commonId?: string;
@@ -111,6 +113,9 @@ export const useCommonMembers = ({ commonId }: Options): Return => {
 
     (async () => {
       try {
+        const useCommonMembersTrace = trace(perf, 'useCommonMembers');
+        useCommonMembersTrace.start();
+
         const cachedUserStates = selectUserStates()(store.getState());
         const hasUsersFromCache = commonMembers.some(
           ({ userId }) => cachedUserStates[userId]?.data,
@@ -136,7 +141,7 @@ export const useCommonMembers = ({ commonId }: Options): Return => {
 
               const user = cachedUserStates[commonMember.userId]?.data;
 
-              return user ? [...acc, { ...commonMember, user }] : acc;
+              return user ? [...acc, { ...commonMember, user, commonId }] : acc;
             }, []);
 
             return {
@@ -173,7 +178,7 @@ export const useCommonMembers = ({ commonId }: Options): Return => {
               ({ uid }) => uid === commonMember.userId,
             );
 
-            return user ? [...acc, { ...commonMember, user }] : acc;
+            return user ? [...acc, { ...commonMember, user, commonId }] : acc;
           }, []);
 
           return {
@@ -183,6 +188,7 @@ export const useCommonMembers = ({ commonId }: Options): Return => {
           };
         });
         dispatch(cacheActions.updateUserStates(fetchedUsers));
+        useCommonMembersTrace.stop();
       } catch (err) {
         Logger.error(err);
         setState((prevState) => ({
@@ -192,7 +198,7 @@ export const useCommonMembers = ({ commonId }: Options): Return => {
         }));
       }
     })();
-  }, [commonMembersState.data]);
+  }, [commonMembersState.data, commonId]);
 
   return {
     ...state,

src/pages/common/components/ChatComponent/ChatComponent.tsx

@@ -206,10 +206,15 @@ export default function ChatComponent({
     chatChannelId: chatChannel?.id || "",
     participants: chatChannel?.participants,
   });
-  const users = chatChannel ? chatUsers : discussionUsers;
-  const discussionMessages = chatChannel
-    ? chatMessagesData.data
-    : discussionMessagesData.data || [];
+  const users = useMemo(
+    () => (chatChannel ? chatUsers : discussionUsers),
+    [chatUsers, discussionUsers, chatChannel],
+  );
+  const discussionMessages = useMemo(
+    () =>
+      chatChannel ? chatMessagesData.data : discussionMessagesData.data || [],
+    [chatChannel, chatMessagesData.data, discussionMessagesData.data],
+  );
   const isFetchedDiscussionMessages =
     discussionMessagesData.fetched || chatMessagesData.fetched;
   const areInitialMessagesLoading = isChatChannel

src/pages/common/components/CommonTabPanels/components/MembersTab/components/Members/Members.tsx

@@ -30,7 +30,7 @@ const MembersComponent: FC<MembersComponentProps> = (props) => {
     () =>
       [...commonMembers].sort(
         (commonMember, prevCommonMember) =>
-          prevCommonMember.joinedAt.seconds - commonMember.joinedAt.seconds,
+          prevCommonMember.joinedAt?.seconds - commonMember.joinedAt?.seconds,
       ),
     [commonMembers],
   );