fixed chat creation, chat preview

src/actions/msgActions.js

@@ -72,7 +72,7 @@ export const actionFullMsgsByChat = (chatId, currentCount, limitCount=50) => (
       if (!chat || ( (chat.messages && chat.messages[0]?._id !== chat.firstMsgId) &&
                         ( (chat.messages?.length ?? 0) < currentCount + limitCount) )
                         ) {
-         console.log(chat)
+         // console.log(chat)
 
          let payload = await dispatch(actionGetMsgsByChat(chatId, currentCount, limitCount))
          if (payload) {

src/components/ChatList.jsx

@@ -13,8 +13,9 @@ const Chat = ({ chat, currChat, myId, lv }) => {
   const [newMsgCount, setNewMsgCount] = useState( chat.messages &&
                      (chat.messages.filter(msg => ( !currChat && (msg.owner._id !== myId) && (msg.createdAt > chat.lastVizited)) )).length )
   
-  const [msgText, setMsgText] = useState( chat.messages && 
-                    chat.messages[chat.messages.length - 1]?.text || '...')
+  const [msgText, setMsgText] = useState( chat.messages && (
+                                            chat.messages[chat.messages.length - 1]?.text || 
+                                                (chat.messages[chat.messages.length - 1]?.media && 'медиа') ) || '...')
 
 
   useEffect(() => {
@@ -22,8 +23,9 @@ const Chat = ({ chat, currChat, myId, lv }) => {
     setNewMsgCount( chat.messages &&
             (chat.messages.filter(msg => ( !currChat && (msg.owner._id !== myId) && (msg.createdAt > chat.lastVizited)) )).length )
 
-    setMsgText( chat.messages && 
-            chat.messages[chat.messages.length - 1]?.text || '...' )
+    setMsgText( chat.messages && (
+                    chat.messages[chat.messages.length - 1]?.text || 
+                        (chat.messages[chat.messages.length - 1]?.media && 'медиа') ) || '...' )
   }, [chat, currChat, lv])
 
   return (

src/components/ChatModal.jsx

@@ -65,7 +65,7 @@ const ChatModal = ({ minTitle="2", chat, onСonfirm, titleError, myProfile, crea
    })
 
 
-   const [members, setMembers] = useState(chat?.members || [])
+   const [members, setMembers] = useState(chat?.members || [myProfile])
 
    const onAddMember = (newMember) => {
       setMembers([...members, newMember])
@@ -88,15 +88,27 @@ const ChatModal = ({ minTitle="2", chat, onСonfirm, titleError, myProfile, crea
    useEffect(() => {
       setTitle(chat?.title || '')
       setImg(null)
-      setMembers(chat?.members || [])
+      setMembers(chat?.members || [myProfile])
    },[open])
  
 
 
    function prepareMembers(members) {
       const newMembers = []
+
       for (const member of members) {
-         newMembers.push({_id: member._id})
+
+         if (create) {
+
+            if (member._id !== myProfile?._id) {
+
+               newMembers.push({_id: member._id})
+            }            
+         } else {
+            
+            newMembers.push({_id: member._id})
+         }
+        
       }
       return newMembers
    }
@@ -113,7 +125,7 @@ const ChatModal = ({ minTitle="2", chat, onСonfirm, titleError, myProfile, crea
           
          <Box sx={styleModalParrent}>
 
-            <Box sx={{ display: 'flex', justifyContent: 'space-between', borderBottom: '1px solid #999', pb: 1 }}>
+            <Box sx={{ display: 'flex', justifyContent: 'space-between', borderBottom: '1px solid #999', pb: 1, mb: 1 }}>
 
                <Box sx={{ display: 'flex', justifyContent: 'start' }}>
                   <Typography variant="h6">
@@ -135,7 +147,6 @@ const ChatModal = ({ minTitle="2", chat, onСonfirm, titleError, myProfile, crea
             <Box sx={{ display: 'flex', justifyContent: 'space-between', pl: 3, pr: 6 }} >
 
                   <Box sx={{ display: 'flex', justifyContent: 'start', alignItems: 'start', flexBasis: "35%" }}> 
-                     <form action="/upload" method="post" encType="multipart/form-data" id='formChat'> 
                         <section className="container">
                            <Box {...getRootProps({className: 'dropzone'})} 
                                  sx={{ cursor: 'pointer', height: '80px', display: 'flex' }}
@@ -153,14 +164,15 @@ const ChatModal = ({ minTitle="2", chat, onСonfirm, titleError, myProfile, crea
                               </Box>
                            </Box>
                         </section>
-                     </form>
                   </Box>
    
                   <Box sx={{ display: 'flex', flexDirection: 'column', justifyContent: 'start', alignItems: 'stretch',
                               flexBasis: "35%" }}>
+
                      <Typography sx={{ fontWeight: 500, fontSize: 18 }}>
                         Название
                      </Typography>
+
                      <TextField            
                         onChange={(e) => {
                               setTitle(e.target.value)
@@ -218,8 +230,7 @@ const ChatModal = ({ minTitle="2", chat, onСonfirm, titleError, myProfile, crea
                         <List
                            sx={{ maxWidth: '100%', bgcolor: 'background.paper' }}
                            >
-                           {/* { create && <UserCard key={'iAm'} user={myProfile} /> } */}
-                           { members.map((member, i) => <UserCard key={member._id} user={member} 
+                           { members.map((member, i) => <UserCard key={member._id || i} user={member} 
                                                                   render={DelBtn}  onAction={() => onDelMember(i)} />)}
                         </List>
                      </Box>

src/components/Msg.jsx

@@ -187,28 +187,28 @@ const Msg = ({ msg, myProfile, onEdit }) => {
             }}
          >
               
-         <List sx={{ width: '100%', maxWidth: 300, bgcolor: 'background.paper' }}>
-
-            <ListItemButton onClick={() => {
-               handleClose()
-            }}>
-               Ответить
-            </ListItemButton>
-
-            {  (myId === owner._id) && 
+            <List sx={{ width: '100%', maxWidth: 300, bgcolor: 'background.paper' }}>
 
                <ListItemButton onClick={() => {
-                  onEdit(msg);
                   handleClose()
-               }} >
-                  Редактировать
+               }}>
+                  Ответить
                </ListItemButton>
-            }
 
-         </List>
+               {  (myId === owner._id) && 
+
+                  <ListItemButton onClick={() => {
+                     onEdit(msg);
+                     handleClose()
+                  }} >
+                     Редактировать
+                  </ListItemButton>
+               }
+
+            </List>
 
+         </Popover>
 
-       </Popover>
 
          <div onClick={handleClick}
 

src/components/ProfileModal.jsx

@@ -252,20 +252,18 @@ const ProfileModal = ({minLog='2', myProfile, onСonfirm, logError}) => {
             <Box sx={{ display: 'flex', justifyContent: 'start', mt: 2,  }}>
 
 
-               <form action="/upload" method="post" encType="multipart/form-data" id='formUser'> 
-                  <section className="container">
-                     <Box {...getRootProps({className: 'dropzone'})} 
-                           sx={{ cursor: 'pointer', height: '80px', display: 'flex' }} 
-                           className="avatarInModal" >
-
-                        <UserAvatar profile={{  login: login, nick: nick, avatar: {url: myProfile.avatar?.url || ''},
-                                       localUrl: img && URL.createObjectURL(img)}} bigSize={true} />
-
-                        <input {...getInputProps()} type="file" name="media" id='mediaUser' />
-                        <Box sx={{ p: '20px', ml: 1 }} >Изменить аватар</Box>
-                     </Box>
-                  </section>
-               </form>
+               <section className="container">
+                  <Box {...getRootProps({className: 'dropzone'})} 
+                        sx={{ cursor: 'pointer', height: '80px', display: 'flex' }} 
+                        className="avatarInModal" >
+
+                     <UserAvatar profile={{  login: login, nick: nick, avatar: {url: myProfile.avatar?.url || ''},
+                                    localUrl: img && URL.createObjectURL(img)}} bigSize={true} />
+
+                     <input {...getInputProps()} type="file" name="media" id='mediaUser' />
+                     <Box sx={{ p: '20px', ml: 1 }} >Изменить аватар</Box>
+                  </Box>
+               </section>
 
             </Box>