From 15843f59c964f94d2466ae386e1ae83ee044e6c9 Mon Sep 17 00:00:00 2001
From: Roie Natan <roie.natan@gmail.com>
Date: Sat, 9 Dec 2023 18:06:03 -0600
Subject: [PATCH] init 4

---
 .../common/components/FeedItem/context.ts     |  2 +-
 .../ProfileContent/ProfileContent.tsx         |  2 +-
 .../ChatChannelItem/ChatChannelItem.tsx       | 10 +++---
 .../DirectMessageModal/DirectMessageModal.tsx | 33 ++++++++++++-------
 .../FeedItemBaseContent.tsx                   | 11 ++++---
 src/services/Proposal.ts                      |  4 +--
 .../hooks/useCases/useDMUserChatChannel.ts    |  8 ++---
 7 files changed, 40 insertions(+), 30 deletions(-)

diff --git a/src/pages/common/components/FeedItem/context.ts b/src/pages/common/components/FeedItem/context.ts
index bc4db7e5c2..edac1a35b6 100644
--- a/src/pages/common/components/FeedItem/context.ts
+++ b/src/pages/common/components/FeedItem/context.ts
@@ -44,7 +44,7 @@ export interface FeedItemBaseContentProps {
   hasImages?: boolean;
   isLoading?: boolean;
   shouldHideBottomContent?: boolean;
-  dmUserId?: string;
+  dmUserIds?: string[];
   hasUnseenMention?: boolean;
   notion?: CommonNotion;
 }
diff --git a/src/pages/commonFeed/components/FeedLayout/components/ProfileContent/ProfileContent.tsx b/src/pages/commonFeed/components/FeedLayout/components/ProfileContent/ProfileContent.tsx
index 99b64f0d26..75cdeaaceb 100644
--- a/src/pages/commonFeed/components/FeedLayout/components/ProfileContent/ProfileContent.tsx
+++ b/src/pages/commonFeed/components/FeedLayout/components/ProfileContent/ProfileContent.tsx
@@ -83,7 +83,7 @@ const ProfileContent: FC<ProfileContentProps> = (props) => {
     if (onDMClick) {
       onDMClick();
     } else {
-      fetchDMUserChatChannel(userId);
+      fetchDMUserChatChannel([userId]);
     }
   };
 
diff --git a/src/pages/inbox/components/ChatChannelItem/ChatChannelItem.tsx b/src/pages/inbox/components/ChatChannelItem/ChatChannelItem.tsx
index 9d9880c345..a4a06f2519 100644
--- a/src/pages/inbox/components/ChatChannelItem/ChatChannelItem.tsx
+++ b/src/pages/inbox/components/ChatChannelItem/ChatChannelItem.tsx
@@ -30,14 +30,14 @@ export const ChatChannelItem: FC<ChatChannelFeedLayoutItemProps> = (props) => {
     useChatContext();
   const user = useSelector(selectUser());
   const userId = user?.uid;
-  const dmUserId =
+  const dmUserIds =
     chatChannel.participants.length === 1
       ? chatChannel.participants[0]
       : chatChannel.participants.filter(
           (participant) => participant !== userId,
         )[0];
   const dmUserName = getUserName(dmUser);
-  const finalTitle = dmUserName;
+  const finalTitle = chatChannel.participants.length > 1 ? "Group" : dmUserName;
 
   const handleOpenChat = useCallback(() => {
     setChatItem({
@@ -82,8 +82,8 @@ export const ChatChannelItem: FC<ChatChannelFeedLayoutItemProps> = (props) => {
   useChatChannelSubscription(chatChannel.id, userId, handleChatChannelUpdate);
 
   useEffect(() => {
-    fetchDMUser(dmUserId);
-  }, [dmUserId]);
+    fetchDMUser(dmUserIds);
+  }, [dmUserIds]);
 
   useEffect(() => {
     fetchChatChannelUserStatus({
@@ -129,7 +129,7 @@ export const ChatChannelItem: FC<ChatChannelFeedLayoutItemProps> = (props) => {
       ownerId={userId}
       renderImage={renderImage}
       isImageRounded
-      dmUserId={dmUserId}
+      dmUserIds={[dmUserIds]}
     />
   );
 };
diff --git a/src/pages/inbox/components/DirectMessageButton/components/DirectMessageModal/DirectMessageModal.tsx b/src/pages/inbox/components/DirectMessageButton/components/DirectMessageModal/DirectMessageModal.tsx
index 5d413d5139..a9134a20c5 100644
--- a/src/pages/inbox/components/DirectMessageButton/components/DirectMessageModal/DirectMessageModal.tsx
+++ b/src/pages/inbox/components/DirectMessageButton/components/DirectMessageModal/DirectMessageModal.tsx
@@ -1,12 +1,11 @@
-import React, { FC, ReactElement, useEffect } from "react";
+import React, { FC, ReactElement, useEffect, useState } from "react";
 import { useDispatch } from "react-redux";
 import Select from "react-select";
 import { Modal, UserAvatar } from "@/shared/components";
 import { useDMUserChatChannel } from "@/shared/hooks/useCases";
 import useThemeColor from "@/shared/hooks/useThemeColor";
 import { SearchIcon } from "@/shared/icons";
-import { DMUser } from "@/shared/interfaces";
-import { Button, Loader } from "@/shared/ui-kit";
+import { Button, ButtonVariant, Loader } from "@/shared/ui-kit";
 import { emptyFunction } from "@/shared/utils";
 import { inboxActions } from "@/store/states";
 import { selectorStyles } from "./components/selectorStyles";
@@ -22,8 +21,8 @@ interface DirectMessageModalProps {
 
 interface SelectOption {
   value: string;
-  user: DMUser;
   label: JSX.Element;
+  uid: string;
 }
 
 const DirectMessageModal: FC<DirectMessageModalProps> = (props) => {
@@ -48,9 +47,10 @@ const DirectMessageModal: FC<DirectMessageModalProps> = (props) => {
     resetDMUserChatChannel,
     error: isChannelLoadedWithError,
   } = useDMUserChatChannel();
+  const [groupUids, setGroupUids] = useState<string[]>([]);
 
-  const handleUserItemClick = (item: DMUser) => {
-    fetchDMUserChatChannel(item.uid);
+  const handleChatCreate = (uid: string[]) => {
+    fetchDMUserChatChannel(uid);
   };
 
   useEffect(() => {
@@ -89,7 +89,6 @@ const DirectMessageModal: FC<DirectMessageModalProps> = (props) => {
 
     const options: SelectOption[] = dmUsers.map((user) => ({
       value: user.userName,
-      user: user,
       label: (
         <div className={styles.optionWrapper}>
           <UserAvatar
@@ -101,20 +100,31 @@ const DirectMessageModal: FC<DirectMessageModalProps> = (props) => {
           <span>{user.userName}</span>
         </div>
       ),
+      uid: user.uid,
     }));
 
-    const handleClick = (item: SelectOption) => {
+    const handleItemClick = (selectedItems) => {
       if (!groupMessage) {
-        handleUserItemClick(item.user);
+        handleChatCreate([selectedItems.uid]);
       } else {
-        console.log("HANDLE GROUP MESSAGE");
+        const uids = selectedItems.map((item) => item.uid);
+        setGroupUids(uids);
       }
     };
 
     return (
       <>
+        {groupMessage && (
+          <Button
+            onClick={() => handleChatCreate(groupUids)}
+            variant={ButtonVariant.PrimaryPink}
+            disabled={!groupUids.length}
+          >
+            Create
+          </Button>
+        )}
         <Select
-          onChange={(item) => handleClick(item as SelectOption)}
+          onChange={(selectedItems) => handleItemClick(selectedItems)}
           isMulti={groupMessage}
           options={options}
           placeholder="Search"
@@ -129,7 +139,6 @@ const DirectMessageModal: FC<DirectMessageModalProps> = (props) => {
             IndicatorSeparator: () => null,
           }}
         />
-        {groupMessage && <Button>Create</Button>}
       </>
     );
   };
diff --git a/src/pages/inbox/components/FeedItemBaseContent/FeedItemBaseContent.tsx b/src/pages/inbox/components/FeedItemBaseContent/FeedItemBaseContent.tsx
index 40ca9f1701..4dc427b302 100644
--- a/src/pages/inbox/components/FeedItemBaseContent/FeedItemBaseContent.tsx
+++ b/src/pages/inbox/components/FeedItemBaseContent/FeedItemBaseContent.tsx
@@ -42,7 +42,7 @@ export const FeedItemBaseContent: FC<FeedItemBaseContentProps> = (props) => {
     isImageRounded,
     isProject,
     discussionPredefinedType,
-    dmUserId,
+    dmUserIds,
     commonId,
     hasUnseenMention,
   } = props;
@@ -63,6 +63,7 @@ export const FeedItemBaseContent: FC<FeedItemBaseContentProps> = (props) => {
     [styles.imageNonRounded]: !shouldImageBeRounded,
     [styles.imageRounded]: shouldImageBeRounded,
   });
+  //const groupMessage = dmUserIds && dmUserIds?.length > 1;
 
   // Here we get either MouseEven, or TouchEven, but I was struggling with importing them from react
   // and use here to have correct types.
@@ -110,8 +111,8 @@ export const FeedItemBaseContent: FC<FeedItemBaseContentProps> = (props) => {
   };
 
   const handleAvatarClick = () => {
-    if (onUserSelect && dmUserId) {
-      onUserSelect(dmUserId);
+    if (onUserSelect && dmUserIds) {
+      onUserSelect(dmUserIds[0]);
     } else if (commonId) {
       history.push(getCommonPagePath(commonId));
     }
@@ -157,7 +158,7 @@ export const FeedItemBaseContent: FC<FeedItemBaseContentProps> = (props) => {
           </p>
         </div>
         <div className={styles.bottomContent}>
-          {lastMessage && !checkIsTextEditorValueEmpty(lastMessage) ? (
+          {/* {lastMessage && !checkIsTextEditorValueEmpty(lastMessage) ? (
             <TextEditor
               className={styles.lastMessageContainer}
               editorClassName={classNames(styles.text, styles.lastMessage, {
@@ -172,7 +173,7 @@ export const FeedItemBaseContent: FC<FeedItemBaseContentProps> = (props) => {
             />
           ) : (
             <div />
-          )}
+          )} */}
           <div className={styles.bottomContentRight}>
             <FeedCardTags
               unreadMessages={unreadMessages}
diff --git a/src/services/Proposal.ts b/src/services/Proposal.ts
index c09cf7737b..770b63fa67 100644
--- a/src/services/Proposal.ts
+++ b/src/services/Proposal.ts
@@ -98,10 +98,10 @@ class ProposalService {
       const proposal = snapshot.data();
 
       if (proposal) {
-        console.log("proposal found!", proposalId);
+        //console.log("proposal found!", proposalId);
         callback(proposal);
       } else {
-        console.log("proposal was not found", proposalId);
+        //console.log("proposal was not found", proposalId);
       }
     });
   };
diff --git a/src/shared/hooks/useCases/useDMUserChatChannel.ts b/src/shared/hooks/useCases/useDMUserChatChannel.ts
index 51fd6d923a..2acaded928 100644
--- a/src/shared/hooks/useCases/useDMUserChatChannel.ts
+++ b/src/shared/hooks/useCases/useDMUserChatChannel.ts
@@ -8,7 +8,7 @@ import { ChatChannel } from "@/shared/models";
 interface Return {
   loading: boolean;
   dmUserChatChannel: ChatChannel | null;
-  fetchDMUserChatChannel: (dmUserId: string) => void;
+  fetchDMUserChatChannel: (dmUserId: string[]) => void;
   resetDMUserChatChannel: () => void;
   error?: boolean;
 }
@@ -21,7 +21,7 @@ export const useDMUserChatChannel = (): Return => {
   const userId = user?.uid;
 
   const fetchDMUserChatChannel = useCallback(
-    async (dmUserId: string) => {
+    async (dmUserId: string[]) => {
       if (!userId) {
         return;
       }
@@ -37,13 +37,13 @@ export const useDMUserChatChannel = (): Return => {
       try {
         dmUserChatChannel = await ChatService.getDMUserChatChannel(
           userId,
-          dmUserId,
+          dmUserId[0],
         );
 
         if (!dmUserChatChannel) {
           dmUserChatChannel = await ChatService.createChatChannel([
             userId,
-            dmUserId,
+            ...dmUserId,
           ]);
         }
       } catch (error) {