02.04.2023 19:30

js/Project/project/src/App.js

@@ -15,7 +15,7 @@ import { CHeader } from './components/structure/header';
 import Footer from './components/structure/footer';
 import Search from './components/search';
 import Page404 from './components/404';
-import UpsertProfile from './components/update_profile';
+// import UpsertProfile from './components/update_profile';
 
 // url проекта
 export const url = 'http://hipstagram.node.ed.asmer.org.ua/'
@@ -32,8 +32,8 @@ const MyRoutes = () => {
             <Route path="/" component={CFeed} exact />
             <Route path="/post/:postId" component={CComments} />
             <Route path="/user/:userId" component={CUser} />
-            <Route path="/upsertpost" component={CreatePost} />
-            <Route path="/updateprofile" component={UpsertProfile} />
+            <Route path="/upsert/:postId" component={CreatePost} />
+            {/* <Route path="/updateprofile" component={UpsertProfile} /> */}
             <Route path='/search' component={Search} />
             <Route path="*" component={Page404} />
         </Switch>

js/Project/project/src/components/create_post/index.js

@@ -1,15 +1,16 @@
 import * as React from 'react';
 import { useState, useEffect } from 'react';
 import { connect, useDispatch, useSelector } from 'react-redux';
-import { useHistory } from "react-router-dom";
+import { useHistory, useParams } from "react-router-dom";
 import { store } from '../../redux';
 
 import Box from '@mui/material/Box';
 import TextField from '@mui/material/TextField';
 import Stack from '@mui/material/Stack';
-import Button from '@mui/material/Button';
+// import Button from '@mui/material/Button';
 import Container from '@mui/material/Container';
 import SendRoundedIcon from '@mui/icons-material/SendRounded';
+import Button from '@mui/material-next/Button';
 
 import { StyledDropzone } from './dropzone';
 import { actionFilesUpload, actionFullCreatePost } from '../../redux/thunks';
@@ -17,13 +18,44 @@ import { actionCreatePost } from '../../redux/action';
 import HighlightOffRoundedIcon from '@mui/icons-material/HighlightOffRounded';
 import { Dnd } from './dnd';
 import { UploadedFiles } from './uploaded_files';
+import { actionFindPostOne } from '../../redux/action';
 
 
 export const CreatePost = () => {
+
+    // отслеживаем url поста. если create - создаем новый
+    const { postId } = useParams()
+    // console.log('params', postId)
+
+    // редактирование поста
+    useEffect(() => {
+        if (postId !== 'create') {
+            const getPost = async (id) => {
+                const res = await dispatch(actionFindPostOne(id))
+                console.log('res', res)
+
+                if (res) {
+                    post._id = postId
+                    setPost({
+                        ...post,
+                        images: [...post.images, ...(res?.images || [])],
+                        title: res?.title,
+                        text: res?.text
+                    })
+                }
+            }
+            getPost(postId)
+        }
+    }, [postId])
+
+
+    // параметры для поста
     const [post, setPost] = useState({ title: '', text: '', images: [] })
+    console.log('post', post)
 
     // создаем объект с данными из форм для отправки на бек
     const newPostData = ({ ...post, images: ((post.images)?.map(item => ({ _id: item._id }))) })
+    console.log('newPostData', newPostData)
 
     const dispatch = useDispatch()
 
@@ -50,7 +82,6 @@ export const CreatePost = () => {
     // console.log('newPost', newPost)
 
 
-    // какого хуя не работает await???
     async function onSend() {
         const res = await dispatch(actionFullCreatePost(newPostData));
 
@@ -84,7 +115,6 @@ export const CreatePost = () => {
                     variant="standard"
                     onChange={e => setPost({ ...post, title: e.target.value })}
                     value={post.title}
-
                 />
             </Box>
 
@@ -104,8 +134,8 @@ export const CreatePost = () => {
                 />
             </Box>
 
-            <Stack spacing={2} direction="row" >
-                <Button
+            {/* <Container spacing={2} direction="row" > */}
+            {/* <Button
                     variant="outlined"
                     startIcon={
                         <SendRoundedIcon
@@ -115,8 +145,29 @@ export const CreatePost = () => {
                     onClick={onSend}
                 >
                     Опубликовать пост
+                </Button> */}
+
+
+            <Container
+                onClick={onSend}
+                sx={{
+                    display: 'flex',
+                    justifyContent: 'center'
+                }}
+            >
+                <Button
+                    size="medium"
+                    variant="filledTonal"
+                    startIcon={
+                        <SendRoundedIcon
+                            style={{ transform: 'translate(3px, -4px) rotate(-30deg)' }}
+                        />}
+                >
+                    Опубликовать пост
                 </Button>
-            </Stack >
+            </Container>
+
+            {/* </Container > */}
         </Container >
     )
 }

js/Project/project/src/components/search/index.js

@@ -187,9 +187,13 @@ function SearchCard({ data }) {
     const history = useHistory()
 
     function toPost() {
-        if (data?.title) history.push(`/post/${data?._id}`)
+        // if (data?.title) history.push(`/post/${data?._id}`)
 
-        if (data?.post) history.push(`/post/${data?.post?._id}`)
+        if (data?.post) {
+            history.push(`/post/${data?.post?._id}`)
+        } else {
+            history.push(`/post/${data?._id}`)
+        }
     }
 
     function toUser() {
@@ -250,14 +254,26 @@ function SearchCard({ data }) {
                     <ListItemText
                         primary={data?.title && data?.title}
                         secondary={data?.text &&
-                            <Typography
-                                sx={{ display: 'inline' }}
-                                component="span"
-                                variant="body2"
-                                color="text.primary"
-                            >
-                                {data?.text}
-                            </Typography>
+                            <React.Fragment>
+                                {data?.post &&
+                                    <Typography
+                                        variant="caption"
+                                        color="text.secondary"
+                                        display="block"
+                                    >
+                                        Комментарий к посту:
+                                    </Typography>
+                                }
+
+                                <Typography
+                                    sx={{ display: 'inline' }}
+                                    component="span"
+                                    variant="body2"
+                                    color="text.primary"
+                                >
+                                    {data?.text}
+                                </Typography>
+                            </React.Fragment>
                         }
                     />
                 </ListItem>}

js/Project/project/src/components/structure/header.js

@@ -67,7 +67,7 @@ function UserMenu({ user }) {
     }
 
     function toCreatepost() {
-        history.push('/upsertpost')
+        history.push('/upsert/create')
     }
 
     function toMyAccount() {

js/Project/project/src/components/structure/modal.js

@@ -90,7 +90,11 @@ export function RecommendedCard({ data }) {
                 < Typography
                     sx={{
                         cursor: 'pointer',
-                        width: 'fit-content'
+                        width: 'fit-content',
+                        maxWidth: '155px',
+                        whiteSpace: 'nowrap', /* запрещает перенос текста на новую строку */
+                        overflowX: 'hidden', /* скрывает текст, который выходит за пределы контейнера */
+                        textOverflow: 'ellipsis',
                     }}
                     variant="subtitle2"
                     color='text.secondary'
@@ -187,7 +191,8 @@ function ModalWindow() {
                                 width: '95%',
                                 minHeight: 'fit-content',
                                 maxHeight: 350,
-                                overflowY: 'auto'
+                                overflowY: 'auto',
+                                overflowX: 'hidden'
                             }}>
                             {modalArray.length != 0
                                 ? modalArray?.map(item => <RecommendedCard key={item._id} data={item} />)

js/Project/project/src/components/user/gallery.js

@@ -221,7 +221,7 @@ export default function StandardImageList({ images }) {
     // переход на пост при клике на его картинку
     function toPost(id) {
         if (isEditProfile) {
-            history.push(`/upsertpost/${id}`)
+            history.push(`/upsert/${id}`)
         } else {
             history.push(`/post/${id}`)
         }

js/Project/project/src/components/user/userData.js

@@ -1,10 +1,309 @@
+// import { url } from "../../App"
+
+// import React, { useContext, useState } from 'react';
+// import { useHistory, useParams } from 'react-router-dom';
+// import { useDispatch, useSelector } from 'react-redux';
+
+// import { CardContent, Typography, Stack, Avatar, Box, Container, Badge, TextField, InputAdornment, IconButton } from '@mui/material';
+// import Button from '@mui/material-next/Button';
+// import { PersonRemoveRounded, PersonAddRounded, ManageAccountsRounded, BorderColorRounded, ImageSearchRounded, AccountCircle, HttpsRounded } from '@mui/icons-material';
+// import { actionUserPageSubscribing } from "../../redux/thunks";
+
+// import ModalWindow from '../structure/modal';
+// import ChangeData from "./change_data";
+// import { ModalForCountsContext, UpdateProfile } from "../../App";
+
+// import { EditProfile } from ".";
+
+
+
+// // Функция отображения кнопки редактирования своего профиля/отписки или подписки на другого юзера
+// function UptadeProfileButton({ data }) {
+//     // console.log('UserData: ', data)
+
+//     const history = useHistory()
+//     const { userId } = useParams()
+//     const dispatch = useDispatch()
+
+//     // отслеживание нажатия кнопки редактирования профиля
+//     const [isEditProfile, setIsEditProfile] = useContext(EditProfile)
+
+//     // контекст обновления профиля
+//     const [updateProfile, setUpdateProfile] = useContext(UpdateProfile)
+//     // console.log('updateProfile: ', updateProfile)
+
+//     // определяем мой id
+//     const myId = updateProfile?._id
+
+//     // определяем всех моих подписчиков
+//     const myFollowingList = updateProfile?.following?.map(user => user?._id)
+
+//     // проверка, является ли пользователь моим подписчиком
+//     const isFollowing = myFollowingList && (myFollowingList)?.some(item => item === (data?.owner?._id || data?._id))
+
+
+//     // функция подписки/отписки - это чисто кнопка
+//     function isSubscribing() {
+
+//         // при клике на посте
+//         const newData = {
+//             ...updateProfile, following: (isFollowing
+//                 ? updateProfile?.following?.filter(item => item?._id !== (data?.owner?._id || data?._id)) // отписка
+//                 // : [...updateProfile?.following, { _id: (data?.owner?._id || data?._id) }] // подписка
+//                 : updateProfile?.following
+//                     ? [...updateProfile?.following, { _id: (data?.owner?._id || data?._id) }] // подписка если уже есть кто-то в подписках
+//                     : [{ _id: (data?.owner?._id || data?._id) }] // подписка, если это первая подписка
+//             )
+//         }
+
+//         dispatch(actionUserPageSubscribing(newData, userId))
+//     }
+
+//     // функция перехода на редактирование профиля
+//     function upsertProfile() {
+//         // history.push('/updateprofile')
+//         setIsEditProfile(true)
+//     }
+
+
+//     return (
+//         <Box
+//             onClick={
+//                 (userId === myId && upsertProfile) ||
+//                 (myFollowingList?.includes(userId) && isSubscribing) ||
+//                 ((userId !== myId && !myFollowingList?.includes(userId)) && isSubscribing)}
+//         >
+//             <Button
+//                 size="large"
+//                 // variant="elevated"
+//                 variant={
+//                     ((userId === myId) && 'elevated') ||
+//                     ((myFollowingList?.includes(userId)) && 'elevated') ||
+//                     ((userId !== myId && !myFollowingList?.includes(userId)) && 'filledTonal')
+//                 }
+//                 sx={{
+//                     minWidth: '300px'
+//                 }}
+//                 startIcon={
+//                     ((userId === myId) && <ManageAccountsRounded />) ||
+//                     ((myFollowingList?.includes(userId)) && <PersonRemoveRounded />) ||
+//                     ((userId !== myId && !myFollowingList?.includes(userId)) && <PersonAddRounded />)
+//                 }
+//                 disableRipple
+//             >
+//                 <Typography
+//                     variant='button'
+//                     display='block'
+//                 >
+//                     {(userId === myId) && 'Редактировать аккаунт' ||
+//                         (myFollowingList?.includes(userId)) && 'Отписаться' ||
+//                         (userId !== myId && !myFollowingList?.includes(userId)) && 'Подписаться'
+//                     }
+//                 </Typography>
+//             </Button>
+//         </Box>
+//     )
+// }
+
+
+
+// // блок пользовательских данных
+// export default function BasicCard({ userData }) {
+//     // console.log('userData: ', userData)
+
+//     // определяем количество постов пользоваеля
+//     const userPostsCount = useSelector(state => state?.promise?.UserPostsCount?.payload)
+
+//     // контекст обновления профиля
+//     const [updateProfile, setUpdateProfile] = useContext(UpdateProfile)
+//     // console.log('updateProfile: ', updateProfile)
+
+//     // отслеживание нажатия кнопки редактирования профиля
+//     const [isEditProfile, setIsEditProfile] = useContext(EditProfile)
+
+//     // контекст модального окна
+//     const [modalName, setModalName, modalArray, setModalArray, openModal, setOpenModal, handleOpenModal, handleCloseModal] = useContext(ModalForCountsContext)
+
+//     // отслеживание статуса изменения пароля
+//     const [changePassword, setChangePassword] = useState(false)
+
+//     // открытие поля редактирвоания пароля
+//     function changePasswordButton() {
+//         setChangePassword(true)
+//     }
+
+
+//     function userFollowers() {
+//         handleOpenModal({
+//             arr: userData?.followers, name: `Подписчики ${userData?.login}`
+//         })
+//     }
+
+//     function userFollowing() {
+//         handleOpenModal({
+//             arr: userData?.following, name: `Подписки ${userData?.login}`
+//         })
+//     }
+
+
+//     return (
+//         <Container sx={{
+//             display: 'flex',
+//             alignItems: 'center'
+//         }}
+//         >
+//             <Box
+//                 sx={{
+//                     position: 'relative',
+//                     display: 'inline-block'
+//                 }}>
+//                 <Avatar
+//                     alt={userData?.login}
+//                     src={url + userData?.avatar?.url}
+//                     sx={{
+//                         width: 130,
+//                         height: 130
+//                     }}
+//                 />
+//                 {isEditProfile &&
+//                     <Box
+//                         sx={{
+//                             position: 'absolute',
+//                             top: 0,
+//                             left: 0,
+//                             width: '100%',
+//                             height: '100%',
+//                             display: 'flex',
+//                             justifyContent: 'center',
+//                             alignItems: 'center',
+//                             zIndex: 1,
+//                             '&:before': {
+//                                 content: '""',
+//                                 position: 'absolute',
+//                                 top: 0,
+//                                 left: 0,
+//                                 width: '100%',
+//                                 height: '100%',
+//                                 backgroundColor: 'rgba(0,0,0,0.5)',
+//                                 zIndex: -1,
+//                                 borderRadius: '50%',
+//                             }
+//                         }}
+//                     >
+//                         <IconButton
+//                             color="primary"
+//                             aria-label="upload avatar"
+//                             component="label"
+//                         >
+//                             <input hidden accept="image/*" type="file" />
+//                             <ImageSearchRounded
+//                                 sx={{
+//                                     color: '#FFF',
+//                                     fontSize: '40px'
+//                                 }}
+//                             />
+//                         </IconButton>
+
+//                     </Box>}
+//             </Box>
+
+
+
+//             {!isEditProfile &&
+//                 <Box
+//                     sx={{
+//                         display: 'flex',
+//                         flexDirection: 'column',
+//                         marginLeft: '50px '
+//                     }}
+//                 >
+//                     <CardContent sx={{
+//                         flex: '1 0 auto'
+//                     }}
+//                     >
+//                         <Stack
+//                             sx={{
+//                                 justifyContent: 'space-between'
+//                             }}
+//                             direction="row"
+//                             spacing={2}
+//                         >
+//                             <Typography
+//                                 component="div"
+//                                 variant="h4"
+//                             >
+//                                 {userData?.login}
+//                             </Typography>
+
+//                             <UptadeProfileButton data={userData} />
+//                         </Stack>
+
+//                         <Typography
+//                             variant="subtitle1"
+//                             color="text.secondary"
+//                             component="div"
+//                         >
+//                             {userData?.nick || ''}
+//                         </Typography>
+//                     </CardContent>
+
+//                     <Stack
+//                         direction="row"
+//                         spacing={5}
+//                         padding={2}
+//                         paddingTop={1}
+//                     >
+//                         <Typography
+//                             variant="subtitle1"
+//                         >
+//                             {userPostsCount || '0'} публикаций
+//                         </Typography>
+
+//                         <Typography
+//                             sx={{
+//                                 cursor: 'pointer'
+//                             }}
+//                             variant="subtitle1"
+//                             onClick={userFollowers}
+//                         >
+//                             {userData?.followers?.length || '0'} подписчиков
+//                         </Typography>
+
+//                         <Typography
+//                             sx={{
+//                                 cursor: 'pointer'
+//                             }}
+//                             variant="subtitle1"
+//                             onClick={userFollowing}
+//                         >
+//                             {userData?.following?.length || '0'} подписок
+//                         </Typography>
+//                     </Stack>
+//                 </Box>}
+
+//             {isEditProfile && <ChangeData />
+//             }
+
+//             {modalArray && <ModalWindow />}
+//         </Container>
+//     )
+// }
+
+
+
+
+
+
+
+
+
 import { url } from "../../App"
 
-import React, { useContext, useState } from 'react';
+import React, { useContext, useState, useEffect } from 'react';
 import { useHistory, useParams } from 'react-router-dom';
 import { useDispatch, useSelector } from 'react-redux';
 
-import { CardContent, Typography, Stack, Avatar, Box, Container, Badge, TextField, InputAdornment } from '@mui/material';
+import { CardContent, Typography, Stack, Avatar, Box, Container, Badge, TextField, InputAdornment, IconButton } from '@mui/material';
 import Button from '@mui/material-next/Button';
 import { PersonRemoveRounded, PersonAddRounded, ManageAccountsRounded, BorderColorRounded, ImageSearchRounded, AccountCircle, HttpsRounded } from '@mui/icons-material';
 import { actionUserPageSubscribing } from "../../redux/thunks";
@@ -12,6 +311,8 @@ import { actionUserPageSubscribing } from "../../redux/thunks";
 import ModalWindow from '../structure/modal';
 import ChangeData from "./change_data";
 import { ModalForCountsContext, UpdateProfile } from "../../App";
+import { UploadedFiles } from "../create_post/uploaded_files";
+import { actionFilesUpload } from "../../redux/thunks";
 
 import { EditProfile } from ".";
 
@@ -25,6 +326,24 @@ function UptadeProfileButton({ data }) {
     const { userId } = useParams()
     const dispatch = useDispatch()
 
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
     // отслеживание нажатия кнопки редактирования профиля
     const [isEditProfile, setIsEditProfile] = useContext(EditProfile)
 
@@ -67,76 +386,6 @@ function UptadeProfileButton({ data }) {
 
 
     return (
-        // <React.Fragment>
-        //     {userId === myId && <Box
-        //         onClick={upsertProfile}
-        //     >
-        //         <Button
-        //             size="large"
-        //             variant="elevated"
-        //             sx={{
-        //                 minWidth: '300px'
-        //             }}
-        //             startIcon={
-        //                 <ManageAccountsRounded />
-        //             }
-        //             disableRipple
-        //         >
-        //             <Typography
-        //                 variant='button'
-        //                 display='block'
-        //             >
-        //                 Редактировать аккаунт
-        //             </Typography>
-        //         </Button>
-        //     </Box>}
-        //     {myFollowingList?.includes(userId) && <Box
-        //         onClick={isSubscribing}
-        //     >
-        //         <Button
-        //             size="large"
-        //             variant="elevated"
-        //             sx={{
-        //                 minWidth: '300px'
-        //             }}
-        //             startIcon={
-        //                 <PersonRemoveRounded />
-        //             }
-        //             disableRipple
-        //         >
-        //             <Typography
-        //                 variant='button'
-        //                 display='block'
-        //             >
-        //                 Отписаться
-        //             </Typography>
-        //         </Button>
-        //     </Box>}
-        //     {(userId !== myId && !myFollowingList?.includes(userId)) && <Box
-        //         onClick={isSubscribing}
-        //     >
-        //         <Button
-        //             size="large"
-        //             variant="filledTonal"
-        //             sx={{
-        //                 minWidth: '300px'
-        //             }}
-        //             startIcon={
-        //                 <PersonAddRounded />
-        //             }
-        //             disableRipple
-        //         >
-        //             <Typography
-        //                 variant='button'
-        //                 display='block'
-        //             >
-        //                 Подписаться
-        //             </Typography>
-        //         </Button>
-        //     </Box>}
-        // </React.Fragment>
-
-
         <Box
             onClick={
                 (userId === myId && upsertProfile) ||
@@ -180,22 +429,89 @@ function UptadeProfileButton({ data }) {
 // блок пользовательских данных
 export default function BasicCard({ userData }) {
     // console.log('userData: ', userData)
+    const dispatch = useDispatch()
 
     // определяем количество постов пользоваеля
     const userPostsCount = useSelector(state => state?.promise?.UserPostsCount?.payload)
 
     // контекст обновления профиля
     const [updateProfile, setUpdateProfile] = useContext(UpdateProfile)
-    // console.log('updateProfile: ', updateProfile)
+    // console.log('updateProfile AVATAR: ', updateProfile)
 
     // отслеживание нажатия кнопки редактирования профиля
     const [isEditProfile, setIsEditProfile] = useContext(EditProfile)
+    console.log('isEditProfile: ', isEditProfile)
 
     // контекст модального окна
     const [modalName, setModalName, modalArray, setModalArray, openModal, setOpenModal, handleOpenModal, handleCloseModal] = useContext(ModalForCountsContext)
 
     // отслеживание статуса изменения пароля
     const [changePassword, setChangePassword] = useState(false)
+
+
+
+
+
+
+
+
+    // отслеживаем добавление файлов
+    const [selectedFile, setSelectedFile] = useState(null)
+    // console.log('selectedFile: ', selectedFile)
+
+    // установка урла аватара
+    const [userAvatarUrl, setUserAvatarUrl] = useState(url + userData?.avatar?.url);
+    // console.log('userAvatarUrl: ', userAvatarUrl)
+
+    // функция загрузки файлов с компа
+    const handleFileSelect = (event) => {
+        const file = event.target.files[0];
+        setSelectedFile(file);
+    };
+
+    // отправляем все на бек когда добавили с компа
+    useEffect(() => {
+        if (selectedFile) {
+            // const res = await dispatch(actionFilesUpload(selectedFile))
+            dispatch(actionFilesUpload(selectedFile)).then((res) => {
+
+                // console.log('res: ', res)
+
+                // ставим на аватар после загрузки
+                const newAvatarUrl = url + res?.url;
+                setUserAvatarUrl(newAvatarUrl)
+
+                setUpdateProfile({ ...updateProfile, avatar: { _id: res?._id } })
+
+            })
+        }
+    }, [selectedFile])
+
+
+    // меняем аватарку, если переходим между пользователями или отменяем изменения
+    useEffect(() => {
+        setUserAvatarUrl(url + userData?.avatar?.url)
+    }, [userData, isEditProfile])
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
 
     // открытие поля редактирвоания пароля
     function changePasswordButton() {
@@ -222,26 +538,6 @@ export default function BasicCard({ userData }) {
             alignItems: 'center'
         }}
         >
-            {/* <Avatar
-                alt={userData?.login}
-                src={url + userData?.avatar?.url}
-                sx={{
-                    width: 130,
-                    height: 130
-                }}
-            // children={
-            //     <BorderColorRounded />
-            // }
-            >
-                <BorderColorRounded sx={{
-                    color: 'black',
-                    zIndex: 999
-                }} />
-            </Avatar> */}
-
-
-
-
             <Box
                 sx={{
                     position: 'relative',
@@ -249,7 +545,8 @@ export default function BasicCard({ userData }) {
                 }}>
                 <Avatar
                     alt={userData?.login}
-                    src={url + userData?.avatar?.url}
+                    // src={url + userData?.avatar?.url}
+                    src={userAvatarUrl}
                     sx={{
                         width: 130,
                         height: 130
@@ -280,12 +577,46 @@ export default function BasicCard({ userData }) {
                             }
                         }}
                     >
-                        <ImageSearchRounded
-                            sx={{
-                                color: '#FFF',
-                                fontSize: '40px'
-                            }}
-                        />
+                        {/* <IconButton
+                            color="primary"
+                            aria-label="upload avatar"
+                            component="label"
+                        >
+                            <input
+                                hidden
+                                accept="image/*"
+                                type="file"
+                                className='getphoto'
+                                onFiles={files => dispatch(actionFilesUpload(files))}
+                            />
+                            <ImageSearchRounded
+                                sx={{
+                                    color: '#FFF',
+                                    fontSize: '40px'
+                                }}
+                            />
+                        </IconButton> */}
+                        <IconButton
+                            color="primary"
+                            aria-label="upload avatar"
+                            component="label"
+                        // onClick={handleFileUpload}
+                        >
+                            <input
+                                hidden
+                                accept="image/*"
+                                type="file"
+                                className='getphoto'
+                                onChange={handleFileSelect}
+                            />
+                            <ImageSearchRounded
+                                sx={{
+                                    color: '#FFF',
+                                    fontSize: '40px'
+                                }}
+                            />
+                        </IconButton>
+
                     </Box>}
             </Box>
 
@@ -364,126 +695,6 @@ export default function BasicCard({ userData }) {
                 </Box>}
 
             {isEditProfile && <ChangeData />
-                // <Box
-                //     sx={{
-                //         display: 'flex',
-                //         flexDirection: 'column',
-                //         marginLeft: '50px '
-                //     }}
-                // >
-                //     {/* <CardContent sx={{
-                //         flex: '1 0 auto'
-                //     }}
-                //     > */}
-                //     <Stack
-                //         sx={{
-                //             justifyContent: 'space-between',
-                //             marginBottom: '10px'
-                //         }}
-                //         direction="row"
-                //         spacing={2}
-                //     >
-                //         <Box
-                //             sx={{
-                //                 display: 'flex',
-                //                 alignItems: 'flex-end'
-                //             }}>
-                //             <AccountCircle
-                //                 sx={{
-                //                     color: 'action.active',
-                //                     mr: 1, my: 0.5
-                //                 }} />
-                //             <TextField
-                //                 id="input-new-login"
-                //                 label="Новый логин"
-                //                 variant="standard" />
-                //         </Box>
-
-                //         <Box
-                //             sx={{
-                //                 display: 'flex',
-                //                 alignItems: 'flex-end'
-                //             }}>
-                //             <AccountCircle
-                //                 sx={{
-                //                     color: 'action.active',
-                //                     mr: 1, my: 0.5
-                //                 }} />
-                //             <TextField
-                //                 id="input-new-nick"
-                //                 label="Новый ник-нейм"
-                //                 variant="standard" />
-                //         </Box>
-                //     </Stack>
-
-                //     <Stack
-                //         sx={{
-                //             justifyContent: 'space-between',
-                //             marginBottom: '10px'
-                //         }}
-                //         direction="row"
-                //         spacing={2}
-                //     >
-                //         <Box
-                //             onClick={changePasswordButton}
-                //         >
-                //             <Button
-                //                 sx={{
-                //                     padding: '5px 20px'
-                //                 }}
-                //                 size="small"
-                //                 variant="text"
-                //             >
-                //                 Редактировать пароль
-                //             </Button>
-                //         </Box>
-
-                //         {changePassword &&
-                //             <React.Fragment>
-                //                 <Box
-                //                     sx={{
-                //                         display: 'flex',
-                //                         alignItems: 'flex-end'
-                //                     }}>
-                //                     <HttpsRounded
-                //                         sx={{
-                //                             color: 'action.active',
-                //                             mr: 1, my: 0.5
-                //                         }} />
-                //                     <TextField
-                //                         id="input-new-login"
-                //                         label="Старый пароль"
-                //                         variant="standard" />
-                //                 </Box>
-
-                //                 <Box
-                //                     sx={{
-                //                         display: 'flex',
-                //                         alignItems: 'flex-end'
-                //                     }}>
-                //                     <HttpsRounded
-                //                         sx={{
-                //                             color: 'action.active',
-                //                             mr: 1, my: 0.5
-                //                         }} />
-                //                     <TextField
-                //                         id="input-new-nick"
-                //                         label="Новый пароль"
-                //                         variant="standard" />
-                //                 </Box>
-                //             </React.Fragment>}
-                //     </Stack>
-
-                //     <Button
-                //         size="medium"
-                //         variant="filledTonal"
-                //         sx={{
-                //             maxWidth: '300px'
-                //         }}
-                //     >
-                //         Сохранить изменения
-                //     </Button>
-                // </Box>
             }
 
             {modalArray && <ModalWindow />}

js/Project/project/src/redux/action.js

@@ -106,7 +106,7 @@ export const actionFindPostOne = _id => actionPromise('PROMISE', 'PostFindOne',
   PostFindOne (query: $postOne) {
     _id createdAt title text likesCount
     images {
-      url
+      _id url
     }
     comments {
       _id createdAt text likesCount
@@ -403,7 +403,7 @@ export const actionDeleteLike = params => actionPromise('PROMISE', 'DeleteLike',
 
 
 //обновление профил(установка аватара, ник-нейма, логина?, добавления/удаления подписчиков)
-export const actionUpdateProfile = params => actionPromise('PROMISE', 'UpdateProfile', gql(`mutation setAvatar($updateProfile: UserInput){
+export const actionUpdateProfile = params => actionPromise('PROMISE', 'UpdateProfile', gql(`mutation setUser($updateProfile: UserInput){
     UserUpsert(user: $updateProfile){
         _id
     }

js/Project/project/src/redux/thunks.js

@@ -239,7 +239,14 @@ function fileUpload(file) {
 }
 
 function filesUpload(files) {
-    return Promise.all(files?.map(fileUpload))
+    console.log('thunk_files', files)
+
+    if (files?.length > 1) {
+        return Promise.all(files?.map(fileUpload))
+    } else {
+        return fileUpload(files)
+    }
+
 }
 
 export const actionFilesUpload = files => actionPromise('PROMISE', 'FilesUpload',