From 3c923d1238e4c6939e4eacfeada9895de6c62ce5 Mon Sep 17 00:00:00 2001 From: Roie Natan Date: Wed, 29 Nov 2023 20:28:46 -0500 Subject: [PATCH 1/2] clicking on a user mention now opens the chat panel with the info instead of the profile popup ; eliminated unnecessary UserInfoPopup components calls --- .../ChatComponent/ChatComponent.tsx | 1 + .../hooks/useDiscussionChatAdapter.ts | 10 ++++-- src/pages/commonFeed/CommonFeed.tsx | 1 - .../Chat/ChatMessage/ChatMessage.tsx | 20 +++-------- .../Chat/ChatMessage/DMChatMessage.tsx | 19 ++-------- .../components/UserMention/UserMention.tsx | 35 +++---------------- .../utils/getTextFromSystemMessage.tsx | 2 -- .../utils/getTextFromTextEditorString.tsx | 2 -- 8 files changed, 20 insertions(+), 70 deletions(-) diff --git a/src/pages/common/components/ChatComponent/ChatComponent.tsx b/src/pages/common/components/ChatComponent/ChatComponent.tsx index 3903aa4e78..a8c8677679 100644 --- a/src/pages/common/components/ChatComponent/ChatComponent.tsx +++ b/src/pages/common/components/ChatComponent/ChatComponent.tsx @@ -175,6 +175,7 @@ export default function ChatComponent({ multipleEmojiText: styles.multipleEmojiText, }, onFeedItemClick, + onUserClick, }); const { chatMessagesData, diff --git a/src/pages/common/components/ChatComponent/hooks/useDiscussionChatAdapter.ts b/src/pages/common/components/ChatComponent/hooks/useDiscussionChatAdapter.ts index 77c2fcf37f..2834d66445 100644 --- a/src/pages/common/components/ChatComponent/hooks/useDiscussionChatAdapter.ts +++ b/src/pages/common/components/ChatComponent/hooks/useDiscussionChatAdapter.ts @@ -28,8 +28,13 @@ interface Return { } export const useDiscussionChatAdapter = (options: Options): Return => { - const { hasPermissionToHide, textStyles, discussionId, onFeedItemClick } = - options; + const { + hasPermissionToHide, + textStyles, + discussionId, + onFeedItemClick, + onUserClick, + } = options; const user = useSelector(selectUser()); const userId = user?.uid; const { data: commonMembers, fetchCommonMembers } = useCommonMembers(); @@ -46,6 +51,7 @@ export const useDiscussionChatAdapter = (options: Options): Return => { users, textStyles, onFeedItemClick, + onUserClick, }); const { markFeedItemAsSeen } = useMarkFeedItemAsSeen(); diff --git a/src/pages/commonFeed/CommonFeed.tsx b/src/pages/commonFeed/CommonFeed.tsx index 97bd7b46fa..f2a1354851 100644 --- a/src/pages/commonFeed/CommonFeed.tsx +++ b/src/pages/commonFeed/CommonFeed.tsx @@ -51,7 +51,6 @@ import { import { cacheActions, commonActions, - commonLayoutActions, selectCommonAction, selectRecentStreamId, selectSharedFeedItem, diff --git a/src/shared/components/Chat/ChatMessage/ChatMessage.tsx b/src/shared/components/Chat/ChatMessage/ChatMessage.tsx index e848e04513..6f8c91e61e 100644 --- a/src/shared/components/Chat/ChatMessage/ChatMessage.tsx +++ b/src/shared/components/Chat/ChatMessage/ChatMessage.tsx @@ -8,11 +8,7 @@ import React, { import classNames from "classnames"; import { useLongPress } from "use-long-press"; import { DiscussionMessageService } from "@/services"; -import { - ElementDropdown, - UserAvatar, - UserInfoPopup, -} from "@/shared/components"; +import { ElementDropdown, UserAvatar } from "@/shared/components"; import { Orientation, ChatType, @@ -20,7 +16,7 @@ import { QueryParamKey, } from "@/shared/constants"; import { Colors } from "@/shared/constants"; -import { useModal } from "@/shared/hooks"; +//import { useModal } from "@/shared/hooks"; import { useIsTabletView } from "@/shared/hooks/viewport"; import { ModerationFlags } from "@/shared/interfaces/Moderation"; import { @@ -146,17 +142,9 @@ export default function ChatMessage({ (discussionMessage.editedAt?.seconds ?? 0) * 1000, ); - const { - isShowing: isShowingUserProfile, - onClose: onCloseUserProfile, - onOpen: onOpenUserProfile, - } = useModal(false); - const handleUserClick = () => { if (onUserClick && discussionMessageUserId) { onUserClick(discussionMessageUserId); - } else { - onOpenUserProfile(); } }; @@ -414,7 +402,7 @@ export default function ChatMessage({ )} - {isShowingUserProfile && isUserDiscussionMessage && ( + {/* {isShowingUserProfile && isUserDiscussionMessage && ( - )} + )} */} ); } diff --git a/src/shared/components/Chat/ChatMessage/DMChatMessage.tsx b/src/shared/components/Chat/ChatMessage/DMChatMessage.tsx index 42b3a3add8..88f056203e 100644 --- a/src/shared/components/Chat/ChatMessage/DMChatMessage.tsx +++ b/src/shared/components/Chat/ChatMessage/DMChatMessage.tsx @@ -8,11 +8,7 @@ import React, { import classNames from "classnames"; import { useLongPress } from "use-long-press"; import { Logger } from "@/services"; -import { - ElementDropdown, - UserAvatar, - UserInfoPopup, -} from "@/shared/components"; +import { ElementDropdown, UserAvatar } from "@/shared/components"; import { Orientation, ChatType, @@ -21,7 +17,6 @@ import { } from "@/shared/constants"; import { Colors } from "@/shared/constants"; import { useRoutesContext } from "@/shared/contexts"; -import { useModal } from "@/shared/hooks"; import { useIsTabletView } from "@/shared/hooks/viewport"; import { ModerationFlags } from "@/shared/interfaces/Moderation"; import { @@ -122,17 +117,9 @@ export default function DMChatMessage({ (discussionMessage.editedAt?.seconds ?? 0) * 1000, ); - const { - isShowing: isShowingUserProfile, - onClose: onCloseUserProfile, - onOpen: onOpenUserProfile, - } = useModal(false); - const handleUserClick = () => { if (onUserClick && discussionMessageUserId) { onUserClick(discussionMessageUserId); - } else { - onOpenUserProfile(); } }; @@ -472,7 +459,7 @@ export default function DMChatMessage({ )} - {isShowingUserProfile && isUserDiscussionMessage && ( + {/* {isShowingUserProfile && isUserDiscussionMessage && ( - )} + )} */} ); } diff --git a/src/shared/components/Chat/ChatMessage/components/UserMention/UserMention.tsx b/src/shared/components/Chat/ChatMessage/components/UserMention/UserMention.tsx index 6246aea93d..a0d6861502 100644 --- a/src/shared/components/Chat/ChatMessage/components/UserMention/UserMention.tsx +++ b/src/shared/components/Chat/ChatMessage/components/UserMention/UserMention.tsx @@ -1,8 +1,6 @@ import React, { FC } from "react"; import classNames from "classnames"; -import { UserInfoPopup } from "@/shared/components"; -import { useModal } from "@/shared/hooks"; -import { DirectParent, User } from "@/shared/models"; +import { User } from "@/shared/models"; import { getUserName } from "@/shared/utils"; import styles from "../../ChatMessage.module.scss"; @@ -11,26 +9,13 @@ interface UserMentionProps { userId: string; displayName: string; mentionTextClassName?: string; - commonId?: string; - directParent?: DirectParent | null; onUserClick?: (userId: string) => void; } const UserMention: FC = (props) => { - const { - users, - userId, - displayName, - mentionTextClassName, - commonId, - directParent, - onUserClick, - } = props; - const { - isShowing: isShowingUserProfile, - onClose: onCloseUserProfile, - onOpen: onOpenUserProfile, - } = useModal(false); + const { users, userId, displayName, mentionTextClassName, onUserClick } = + props; + const user = users.find(({ uid }) => uid === userId); const withSpace = displayName[displayName.length - 1] === " "; const userName = user @@ -40,8 +25,6 @@ const UserMention: FC = (props) => { const handleUserNameClick = () => { if (onUserClick) { onUserClick(userId); - } else { - onOpenUserProfile(); } }; @@ -53,16 +36,6 @@ const UserMention: FC = (props) => { > @{userName} - {!onUserClick && ( - - )} ); }; diff --git a/src/shared/components/Chat/ChatMessage/utils/getTextFromSystemMessage.tsx b/src/shared/components/Chat/ChatMessage/utils/getTextFromSystemMessage.tsx index 7267d13c75..8a8005b47d 100644 --- a/src/shared/components/Chat/ChatMessage/utils/getTextFromSystemMessage.tsx +++ b/src/shared/components/Chat/ChatMessage/utils/getTextFromSystemMessage.tsx @@ -42,8 +42,6 @@ const renderUserMention = ( userId={user.uid} displayName={getUserName(user)} mentionTextClassName={data.mentionTextClassName} - commonId={data.commonId} - directParent={data.directParent} onUserClick={data.onUserClick} /> ) : ( diff --git a/src/shared/components/Chat/ChatMessage/utils/getTextFromTextEditorString.tsx b/src/shared/components/Chat/ChatMessage/utils/getTextFromTextEditorString.tsx index 622c859ca0..9d063f6719 100644 --- a/src/shared/components/Chat/ChatMessage/utils/getTextFromTextEditorString.tsx +++ b/src/shared/components/Chat/ChatMessage/utils/getTextFromTextEditorString.tsx @@ -72,8 +72,6 @@ const getTextFromDescendant = ({ userId={descendant.userId} displayName={descendant.displayName} mentionTextClassName={mentionTextClassName} - commonId={commonId} - directParent={directParent} onUserClick={onUserClick} /> ); From d44d1e2bf4643784d89243365f54070b20af1093 Mon Sep 17 00:00:00 2001 From: Roie Natan Date: Wed, 29 Nov 2023 20:32:32 -0500 Subject: [PATCH 2/2] clean unnecessary comments --- .../components/Chat/ChatMessage/ChatMessage.tsx | 11 ----------- .../components/Chat/ChatMessage/DMChatMessage.tsx | 10 ---------- 2 files changed, 21 deletions(-) diff --git a/src/shared/components/Chat/ChatMessage/ChatMessage.tsx b/src/shared/components/Chat/ChatMessage/ChatMessage.tsx index 6f8c91e61e..c73d6bc80e 100644 --- a/src/shared/components/Chat/ChatMessage/ChatMessage.tsx +++ b/src/shared/components/Chat/ChatMessage/ChatMessage.tsx @@ -16,7 +16,6 @@ import { QueryParamKey, } from "@/shared/constants"; import { Colors } from "@/shared/constants"; -//import { useModal } from "@/shared/hooks"; import { useIsTabletView } from "@/shared/hooks/viewport"; import { ModerationFlags } from "@/shared/interfaces/Moderation"; import { @@ -402,16 +401,6 @@ export default function ChatMessage({ )} - {/* {isShowingUserProfile && isUserDiscussionMessage && ( - - )} */} ); } diff --git a/src/shared/components/Chat/ChatMessage/DMChatMessage.tsx b/src/shared/components/Chat/ChatMessage/DMChatMessage.tsx index 88f056203e..b8ca5ec15f 100644 --- a/src/shared/components/Chat/ChatMessage/DMChatMessage.tsx +++ b/src/shared/components/Chat/ChatMessage/DMChatMessage.tsx @@ -459,16 +459,6 @@ export default function DMChatMessage({ )} - {/* {isShowingUserProfile && isUserDiscussionMessage && ( - - )} */} ); }