CW-2196 Fixed PR comments

daostack · Nov 22, 2023 · ce29c2a · ce29c2a
1 parent 5a9cac1
commit ce29c2a
Show file tree

Hide file tree

Showing 6 changed files with 133 additions and 129 deletions.
diff --git a/src/pages/common/components/ChatComponent/ChatComponent.tsx b/src/pages/common/components/ChatComponent/ChatComponent.tsx
@@ -713,13 +713,13 @@ export default function ChatComponent({
       discussionMessagesData.fetchDiscussionMessages();
       dispatch(chatActions.clearCurrentDiscussionMessageReply());
     }
-  }, [discussionId]);
+  }, [discussionId, dispatch]);
 
   useEffect(() => {
     if (isTopReached && discussionId) {
       discussionMessagesData.fetchDiscussionMessages();
     }
-  }, [isTopReached, discussionId, dispatch]);
+  }, [isTopReached, discussionId]);
 
   return (
     <div className={styles.chatWrapper}>

diff --git a/src/pages/common/components/ChatComponent/components/ChatContent/ChatContent.tsx b/src/pages/common/components/ChatComponent/components/ChatContent/ChatContent.tsx
@@ -58,10 +58,7 @@ interface ChatContentInterface {
   onInternalLinkClick?: (data: InternalLinkData) => void;
   isEmpty?: boolean;
   isChatChannel: boolean;
-  fetchReplied: (
-    messageId: string,
-    endDate: Date,
-  ) => Promise<void>;
+  fetchReplied: (messageId: string, endDate: Date) => Promise<void>;
 }
 
 const isToday = (someDate: Date) => {
@@ -160,13 +157,12 @@ const ChatContent: ForwardRefRenderFunction<
     useState<string>();
 
   useEffect(() => {
-    if (shouldScrollToElementId) {
-      if (
-        discussionMessages?.find((item) => item.id === shouldScrollToElementId)
-      ) {
-        setHighlightedMessageId(shouldScrollToElementId);
-        setShouldScrollToElementId("");
-      }
+    if (
+      shouldScrollToElementId &&
+      discussionMessages?.find((item) => item.id === shouldScrollToElementId)
+    ) {
+      setHighlightedMessageId(shouldScrollToElementId);
+      setShouldScrollToElementId("");
     }
   }, [shouldScrollToElementId, discussionMessages]);
 

diff --git a/src/pages/common/components/ChatComponent/hooks/useDiscussionChatAdapter.ts b/src/pages/common/components/ChatComponent/hooks/useDiscussionChatAdapter.ts
@@ -28,18 +28,18 @@ interface Return {
 }
 
 export const useDiscussionChatAdapter = (options: Options): Return => {
-  const { hasPermissionToHide, textStyles, discussionId} = options;
-  
+  const { hasPermissionToHide, textStyles, discussionId } = options;
+
   const user = useSelector(selectUser());
   const userId = user?.uid;
   const { data: commonMembers, fetchCommonMembers } = useCommonMembers();
-    const users = useMemo(
-      () =>
-        commonMembers
-          .filter((member) => member.userId !== userId)
-          .map(({ user }) => user),
-      [userId, commonMembers],
-    );
+  const users = useMemo(
+    () =>
+      commonMembers
+        .filter((member) => member.userId !== userId)
+        .map(({ user }) => user),
+    [userId, commonMembers],
+  );
   const discussionMessagesData = useDiscussionMessagesById({
     discussionId,
     hasPermissionToHide,

diff --git a/src/services/DiscussionMessage.ts b/src/services/DiscussionMessage.ts
@@ -26,25 +26,39 @@ class DiscussionMessageService {
     return transformFirebaseDataSingle<DiscussionMessage>(discussionMessage);
   }
 
-  public getDiscussionMessagesByEndDate = async (discussionId: string,lastVisible: firebase.firestore.QueryDocumentSnapshot<DiscussionMessage> | null, endDate: Date): Promise<{data: DiscussionMessage[], lastVisibleSnapshot: firebase.firestore.QueryDocumentSnapshot<DiscussionMessage>}> => {
+  public getDiscussionMessagesByEndDate = async (
+    discussionId: string,
+    lastVisible: firebase.firestore.QueryDocumentSnapshot<DiscussionMessage> | null,
+    endDate: Date
+  ): Promise<{ data: DiscussionMessage[], lastVisibleSnapshot: firebase.firestore.QueryDocumentSnapshot<DiscussionMessage> }> => {
     const snapshot = await this.getDiscussionMessageCollection().where(
       "discussionId",
       "==",
       discussionId,
-    ).where("createdAt", ">=", endDate).orderBy('createdAt', 'desc').startAfter(lastVisible).get();
+    ).where("createdAt", ">=", endDate)
+      .orderBy('createdAt', 'desc')
+      .startAfter(lastVisible)
+      .get();
 
     const data = transformFirebaseDataList<DiscussionMessage>(snapshot);
     const snapshotOfItemsAfterEndDate = await this.getDiscussionMessageCollection().where(
       "discussionId",
       "==",
       discussionId,
-    ).orderBy('createdAt', 'desc').startAfter(snapshot.docs[data.length - 1]).limit(5).get();
+    ).orderBy('createdAt', 'desc')
+      .startAfter(snapshot.docs[data.length - 1])
+      .limit(5)
+      .get();
     const dataAfterEndDate = transformFirebaseDataList<DiscussionMessage>(snapshotOfItemsAfterEndDate);
 
-    return {data: [...data, ...dataAfterEndDate], lastVisibleSnapshot: snapshotOfItemsAfterEndDate.docs[dataAfterEndDate.length - 1]};
+    return { data: [...data, ...dataAfterEndDate], lastVisibleSnapshot: snapshotOfItemsAfterEndDate.docs[dataAfterEndDate.length - 1] };
   }
 
-  public getDiscussionMessagesByDiscussionId = (discussionId: string,  lastVisible: firebase.firestore.QueryDocumentSnapshot<DiscussionMessage> | null, callback: (snapshot: firebase.firestore.QuerySnapshot<DiscussionMessage>, discussion: DiscussionMessage[]) => void,): UnsubscribeFunction => {
+  public getDiscussionMessagesByDiscussionId = (discussionId: string,
+    lastVisible: firebase.firestore.QueryDocumentSnapshot<DiscussionMessage> | null,
+    callback: (snapshot: firebase.firestore.QuerySnapshot<DiscussionMessage>,
+      discussion: DiscussionMessage[]) => void
+  ): UnsubscribeFunction => {
     let query = this.getDiscussionMessageCollection().where(
       "discussionId",
       "==",

diff --git a/src/shared/components/Chat/ChatMessage/ChatMessage.tsx b/src/shared/components/Chat/ChatMessage/ChatMessage.tsx
@@ -310,9 +310,7 @@ export default function ChatMessage({
             isProposalMessage={chatType === ChatType.ProposalComments}
             isChatMessage={chatType === ChatType.ChatMessages}
             discussionMessage={discussionMessage}
-            onClose={() => {
-              setEditMode(false);
-            }}
+            onClose={() => setEditMode(false)}
             commonMember={commonMember}
           />
         ) : (
@@ -399,9 +397,7 @@ export default function ChatMessage({
                   }
                   userId={userId}
                   commonId={discussionMessage.commonId}
-                  onEdit={() => {
-                    setEditMode(true);
-                  }}
+                  onEdit={() => setEditMode(true)}
                   isControlledDropdown={false}
                   isOpen={isMenuOpen}
                   styles={{

diff --git a/src/shared/hooks/useCases/useDiscussionMessagesById.ts b/src/shared/hooks/useCases/useDiscussionMessagesById.ts
@@ -1,4 +1,4 @@
-import {  useEffect, useState } from "react";
+import { useEffect, useState } from "react";
 import { useDispatch, useSelector } from "react-redux";
 import classNames from 'classnames';
 import { isEqual, xor } from "lodash";
@@ -113,48 +113,48 @@ export const useDiscussionMessagesById = ({
     );
   };
 
-  const fetchRepliedMessages = async (messageId: string,  endDate: Date): Promise<void> => {
-    if(state.data?.find((item) => item.id === discussionId)) {
+  const fetchRepliedMessages = async (messageId: string, endDate: Date): Promise<void> => {
+    if (state.data?.find((item) => item.id === discussionId)) {
       return Promise.resolve();
     }
 
-    const {data: updatedDiscussionMessages, lastVisibleSnapshot} = await DiscussionMessageService.getDiscussionMessagesByEndDate(discussionId, lastVisible && lastVisible[discussionId], endDate);
+    const { data: updatedDiscussionMessages, lastVisibleSnapshot } = await DiscussionMessageService.getDiscussionMessagesByEndDate(discussionId, lastVisible && lastVisible[discussionId], endDate);
 
-    setLastVisible((prevVisible) => ({...prevVisible, [discussionId]: lastVisibleSnapshot}));
+    setLastVisible((prevVisible) => ({ ...prevVisible, [discussionId]: lastVisibleSnapshot }));
     const discussionsWithText = await Promise.all((updatedDiscussionMessages.map(async (discussionMessage) => {
       const emojiCount = countTextEditorEmojiElements(
         parseStringToTextEditorValue(discussionMessage.text),
       );
 
       const isUserDiscussionMessage =
-      checkIsUserDiscussionMessage(discussionMessage);
+        checkIsUserDiscussionMessage(discussionMessage);
       const isSystemMessage = checkIsSystemDiscussionMessage(discussionMessage);
 
       const isNotCurrentUserMessage =
-      !isUserDiscussionMessage || userId !== discussionMessage.ownerId;
-     const parsedText = await getTextFromTextEditorString({
-          textEditorString: discussionMessage.text,
-          users,
-          mentionTextClassName: !isNotCurrentUserMessage
-            ? textStyles.mentionTextCurrentUser
-            : "",
-          emojiTextClassName: classNames({
-            [textStyles.singleEmojiText]: emojiCount.isSingleEmoji,
-            [textStyles.multipleEmojiText]: emojiCount.isMultipleEmoji,
-          }),
-          commonId: discussionMessage.commonId,
-          systemMessage: isSystemMessage ? discussionMessage : undefined,
-          getCommonPagePath,
-          getCommonPageAboutTabPath,
-          directParent,
-          onUserClick,
-          onFeedItemClick,
-        });
+        !isUserDiscussionMessage || userId !== discussionMessage.ownerId;
+      const parsedText = await getTextFromTextEditorString({
+        textEditorString: discussionMessage.text,
+        users,
+        mentionTextClassName: !isNotCurrentUserMessage
+          ? textStyles.mentionTextCurrentUser
+          : "",
+        emojiTextClassName: classNames({
+          [textStyles.singleEmojiText]: emojiCount.isSingleEmoji,
+          [textStyles.multipleEmojiText]: emojiCount.isMultipleEmoji,
+        }),
+        commonId: discussionMessage.commonId,
+        systemMessage: isSystemMessage ? discussionMessage : undefined,
+        getCommonPagePath,
+        getCommonPageAboutTabPath,
+        directParent,
+        onUserClick,
+        onFeedItemClick,
+      });
 
-        return {
-          ...discussionMessage,
-          parsedText,
-        }
+      return {
+        ...discussionMessage,
+        parsedText,
+      }
     })))
     dispatch(
       cacheActions.updateDiscussionMessagesStateByDiscussionId({
@@ -165,7 +165,7 @@ export const useDiscussionMessagesById = ({
           data: discussionsWithText as any,
         },
       }),
-      )
+    )
   }
 
   const fetchDiscussionMessages = () => {
@@ -176,76 +176,74 @@ export const useDiscussionMessagesById = ({
       return null;
     }
 
-    if(!state.data?.length) {
+    if (!state.data?.length) {
       setDefaultState({ ...DEFAULT_STATE });
     }
 
     DiscussionMessageService.getDiscussionMessagesByDiscussionId(
       discussionId,
       lastVisible && lastVisible[discussionId],
       async (snapshot, updatedDiscussionMessages) => {
-          const lastVisibleDocument =
-            snapshot.docs[updatedDiscussionMessages.length - 1];
+        const lastVisibleDocument = snapshot.docs[updatedDiscussionMessages.length - 1];
 
-          setLastVisible((prevVisible) => ({...prevVisible, [discussionId]: lastVisibleDocument}));
+        setLastVisible((prevVisible) => ({ ...prevVisible, [discussionId]: lastVisibleDocument }));
 
-          const hasLastVisibleDocument = !!lastVisibleDocument?.data();
-
-          const discussionsWithText = await Promise.all((updatedDiscussionMessages.map(async (discussionMessage) => {
-            const emojiCount = countTextEditorEmojiElements(
-              parseStringToTextEditorValue(discussionMessage.text),
-            );
+        const hasLastVisibleDocument = !!lastVisibleDocument?.data();
 
-            const isUserDiscussionMessage =
-            checkIsUserDiscussionMessage(discussionMessage);
-            const isSystemMessage = checkIsSystemDiscussionMessage(discussionMessage);
+        const discussionsWithText = await Promise.all((updatedDiscussionMessages.map(async (discussionMessage) => {
+          const emojiCount = countTextEditorEmojiElements(
+            parseStringToTextEditorValue(discussionMessage.text),
+          );
 
-            const isNotCurrentUserMessage =
-            !isUserDiscussionMessage || userId !== discussionMessage.ownerId;
-           const parsedText = await getTextFromTextEditorString({
-                textEditorString: discussionMessage.text,
-                users,
-                mentionTextClassName: !isNotCurrentUserMessage
-                  ? textStyles.mentionTextCurrentUser
-                  : "",
-                emojiTextClassName: classNames({
-                  [textStyles.singleEmojiText]: emojiCount.isSingleEmoji,
-                  [textStyles.multipleEmojiText]: emojiCount.isMultipleEmoji,
-                }),
-                commonId: discussionMessage.commonId,
-                systemMessage: isSystemMessage ? discussionMessage : undefined,
-                getCommonPagePath,
-                getCommonPageAboutTabPath,
-                directParent,
-                onUserClick,
-                onFeedItemClick,
-              });
+          const isUserDiscussionMessage = checkIsUserDiscussionMessage(discussionMessage);
+          const isSystemMessage = checkIsSystemDiscussionMessage(discussionMessage);
 
-              return {
-                ...discussionMessage,
-                parsedText,
-              }
-          })))
-          dispatch(
-            cacheActions.updateDiscussionMessagesStateByDiscussionId({
-              discussionId,
-              state: {
-                loading: false,
-                fetched: true,
-                data: discussionsWithText as any,
-              },
+          const isNotCurrentUserMessage =
+            !isUserDiscussionMessage || userId !== discussionMessage.ownerId;
+          const parsedText = await getTextFromTextEditorString({
+            textEditorString: discussionMessage.text,
+            users,
+            mentionTextClassName: !isNotCurrentUserMessage
+              ? textStyles.mentionTextCurrentUser
+              : "",
+            emojiTextClassName: classNames({
+              [textStyles.singleEmojiText]: emojiCount.isSingleEmoji,
+              [textStyles.multipleEmojiText]: emojiCount.isMultipleEmoji,
             }),
-            )
-
-            if (
-              discussionsWithText.length < 15 &&
-              !hasLastVisibleDocument
-            ) {
-              setIsEndOfList((prevIsEndOfList) => ({...prevIsEndOfList, [discussionId]: true}));
-            }
+            commonId: discussionMessage.commonId,
+            systemMessage: isSystemMessage ? discussionMessage : undefined,
+            getCommonPagePath,
+            getCommonPageAboutTabPath,
+            directParent,
+            onUserClick,
+            onFeedItemClick,
+          });
+
+          return {
+            ...discussionMessage,
+            parsedText,
+          }
+        })));
+        dispatch(
+          cacheActions.updateDiscussionMessagesStateByDiscussionId({
+            discussionId,
+            state: {
+              loading: false,
+              fetched: true,
+              data: discussionsWithText as any,
+            },
+          }),
+        )
+
+        if (
+          discussionsWithText.length < 15 &&
+          !hasLastVisibleDocument
+        ) {
+          setIsEndOfList((prevIsEndOfList) => ({ ...prevIsEndOfList, [discussionId]: true }));
+        }
       },
     );
-    };
+  };
 
   const fetchMessageOwners = async (ids: string[]): Promise<User[]> => {
     if (isEqual(messageOwnersIds, ids)) {
@@ -287,17 +285,17 @@ export const useDiscussionMessagesById = ({
         }
         newDiscussionMessage.parentMessage = parentMessage
           ? {
-              id: parentMessage.id,
-              text: parentMessage.text,
-              ownerName: parentMessage?.ownerName,
-              ...(checkIsUserDiscussionMessage(parentMessage) && {
-                ownerId: parentMessage.ownerId,
-              }),
-              moderation: parentMessage?.moderation,
-              images: parentMessage?.images,
-              files: parentMessage?.files,
-              createdAt: parentMessage.createdAt
-            }
+            id: parentMessage.id,
+            text: parentMessage.text,
+            ownerName: parentMessage?.ownerName,
+            ...(checkIsUserDiscussionMessage(parentMessage) && {
+              ownerId: parentMessage.ownerId,
+            }),
+            moderation: parentMessage?.moderation,
+            images: parentMessage?.images,
+            files: parentMessage?.files,
+            createdAt: parentMessage.createdAt
+          }
           : null;
         return newDiscussionMessage;
       }));