|
@@ -1,355 +1,58 @@
|
|
-// 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,
|
|
|
|
+ useEffect
|
|
|
|
+} from 'react';
|
|
|
|
|
|
-import { url } from "../../App"
|
|
|
|
|
|
+import { useDispatch, useSelector } from 'react-redux';
|
|
|
|
|
|
-import React, { useContext, useState, useEffect } from 'react';
|
|
|
|
import { useHistory, useParams } from 'react-router-dom';
|
|
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 {
|
|
|
|
+ CardContent,
|
|
|
|
+ Typography,
|
|
|
|
+ Stack,
|
|
|
|
+ Avatar,
|
|
|
|
+ Box,
|
|
|
|
+ Container,
|
|
|
|
+ IconButton
|
|
|
|
+} from '@mui/material';
|
|
import Button from '@mui/material-next/Button';
|
|
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 {
|
|
|
|
+ PersonRemoveRounded,
|
|
|
|
+ PersonAddRounded,
|
|
|
|
+ ManageAccountsRounded,
|
|
|
|
+ ImageSearchRounded
|
|
|
|
+} from '@mui/icons-material';
|
|
|
|
+
|
|
|
|
+import {
|
|
|
|
+ actionUserPageSubscribing,
|
|
|
|
+ actionFilesUpload
|
|
|
|
+} from "../../redux/thunks";
|
|
|
|
+
|
|
import { ModalForCountsContext, UpdateProfile } from "../../App";
|
|
import { ModalForCountsContext, UpdateProfile } from "../../App";
|
|
-import { UploadedFiles } from "../create_post/uploaded_files";
|
|
|
|
-import { actionFilesUpload } from "../../redux/thunks";
|
|
|
|
|
|
|
|
import { EditProfile } from ".";
|
|
import { EditProfile } from ".";
|
|
|
|
|
|
|
|
+import ModalWindow from '../structure/modal';
|
|
|
|
|
|
|
|
+import ChangeData from "./change_data";
|
|
|
|
|
|
// Функция отображения кнопки редактирования своего профиля/отписки или подписки на другого юзера
|
|
// Функция отображения кнопки редактирования своего профиля/отписки или подписки на другого юзера
|
|
function UptadeProfileButton({ data }) {
|
|
function UptadeProfileButton({ data }) {
|
|
- // console.log('UserData: ', data)
|
|
|
|
-
|
|
|
|
const history = useHistory()
|
|
const history = useHistory()
|
|
const { userId } = useParams()
|
|
const { userId } = useParams()
|
|
const dispatch = useDispatch()
|
|
const dispatch = useDispatch()
|
|
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
|
|
+ // контекст обновления профиля
|
|
|
|
+ const [updateProfile, setUpdateProfile] = useContext(UpdateProfile)
|
|
|
|
|
|
// отслеживание нажатия кнопки редактирования профиля
|
|
// отслеживание нажатия кнопки редактирования профиля
|
|
const [isEditProfile, setIsEditProfile] = useContext(EditProfile)
|
|
const [isEditProfile, setIsEditProfile] = useContext(EditProfile)
|
|
|
|
|
|
- // контекст обновления профиля
|
|
|
|
- const [updateProfile, setUpdateProfile] = useContext(UpdateProfile)
|
|
|
|
- // console.log('updateProfile: ', updateProfile)
|
|
|
|
|
|
|
|
// определяем мой id
|
|
// определяем мой id
|
|
const myId = updateProfile?._id
|
|
const myId = updateProfile?._id
|
|
@@ -360,17 +63,14 @@ function UptadeProfileButton({ data }) {
|
|
// проверка, является ли пользователь моим подписчиком
|
|
// проверка, является ли пользователь моим подписчиком
|
|
const isFollowing = myFollowingList && (myFollowingList)?.some(item => item === (data?.owner?._id || data?._id))
|
|
const isFollowing = myFollowingList && (myFollowingList)?.some(item => item === (data?.owner?._id || data?._id))
|
|
|
|
|
|
-
|
|
|
|
// функция подписки/отписки - это чисто кнопка
|
|
// функция подписки/отписки - это чисто кнопка
|
|
function isSubscribing() {
|
|
function isSubscribing() {
|
|
-
|
|
|
|
// при клике на посте
|
|
// при клике на посте
|
|
const newData = {
|
|
const newData = {
|
|
...updateProfile, following: (isFollowing
|
|
...updateProfile, following: (isFollowing
|
|
? updateProfile?.following?.filter(item => item?._id !== (data?.owner?._id || data?._id)) // отписка
|
|
? updateProfile?.following?.filter(item => item?._id !== (data?.owner?._id || data?._id)) // отписка
|
|
- // : [...updateProfile?.following, { _id: (data?.owner?._id || data?._id) }] // подписка
|
|
|
|
: updateProfile?.following
|
|
: updateProfile?.following
|
|
- ? [...updateProfile?.following, { _id: (data?.owner?._id || data?._id) }] // подписка если уже есть кто-то в подписках
|
|
|
|
|
|
+ ? [...updateProfile?.following, { _id: (data?.owner?._id || data?._id) }] // подписка, если уже есть кто-то в подписках
|
|
: [{ _id: (data?.owner?._id || data?._id) }] // подписка, если это первая подписка
|
|
: [{ _id: (data?.owner?._id || data?._id) }] // подписка, если это первая подписка
|
|
)
|
|
)
|
|
}
|
|
}
|
|
@@ -380,7 +80,6 @@ function UptadeProfileButton({ data }) {
|
|
|
|
|
|
// функция перехода на редактирование профиля
|
|
// функция перехода на редактирование профиля
|
|
function upsertProfile() {
|
|
function upsertProfile() {
|
|
- // history.push('/updateprofile')
|
|
|
|
setIsEditProfile(true)
|
|
setIsEditProfile(true)
|
|
}
|
|
}
|
|
|
|
|
|
@@ -393,22 +92,21 @@ function UptadeProfileButton({ data }) {
|
|
((userId !== myId && !myFollowingList?.includes(userId)) && isSubscribing)}
|
|
((userId !== myId && !myFollowingList?.includes(userId)) && isSubscribing)}
|
|
>
|
|
>
|
|
<Button
|
|
<Button
|
|
- size="large"
|
|
|
|
- // variant="elevated"
|
|
|
|
|
|
+ size="small"
|
|
variant={
|
|
variant={
|
|
((userId === myId) && 'elevated') ||
|
|
((userId === myId) && 'elevated') ||
|
|
((myFollowingList?.includes(userId)) && 'elevated') ||
|
|
((myFollowingList?.includes(userId)) && 'elevated') ||
|
|
((userId !== myId && !myFollowingList?.includes(userId)) && 'filledTonal')
|
|
((userId !== myId && !myFollowingList?.includes(userId)) && 'filledTonal')
|
|
}
|
|
}
|
|
- sx={{
|
|
|
|
- minWidth: '300px'
|
|
|
|
- }}
|
|
|
|
startIcon={
|
|
startIcon={
|
|
((userId === myId) && <ManageAccountsRounded />) ||
|
|
((userId === myId) && <ManageAccountsRounded />) ||
|
|
((myFollowingList?.includes(userId)) && <PersonRemoveRounded />) ||
|
|
((myFollowingList?.includes(userId)) && <PersonRemoveRounded />) ||
|
|
((userId !== myId && !myFollowingList?.includes(userId)) && <PersonAddRounded />)
|
|
((userId !== myId && !myFollowingList?.includes(userId)) && <PersonAddRounded />)
|
|
}
|
|
}
|
|
disableRipple
|
|
disableRipple
|
|
|
|
+ sx={{
|
|
|
|
+ minWidth: '250px'
|
|
|
|
+ }}
|
|
>
|
|
>
|
|
<Typography
|
|
<Typography
|
|
variant='button'
|
|
variant='button'
|
|
@@ -424,11 +122,8 @@ function UptadeProfileButton({ data }) {
|
|
)
|
|
)
|
|
}
|
|
}
|
|
|
|
|
|
-
|
|
|
|
-
|
|
|
|
// блок пользовательских данных
|
|
// блок пользовательских данных
|
|
export default function BasicCard({ userData }) {
|
|
export default function BasicCard({ userData }) {
|
|
- // console.log('userData: ', userData)
|
|
|
|
const dispatch = useDispatch()
|
|
const dispatch = useDispatch()
|
|
|
|
|
|
// определяем количество постов пользоваеля
|
|
// определяем количество постов пользоваеля
|
|
@@ -436,11 +131,9 @@ export default function BasicCard({ userData }) {
|
|
|
|
|
|
// контекст обновления профиля
|
|
// контекст обновления профиля
|
|
const [updateProfile, setUpdateProfile] = useContext(UpdateProfile)
|
|
const [updateProfile, setUpdateProfile] = useContext(UpdateProfile)
|
|
- // console.log('updateProfile AVATAR: ', updateProfile)
|
|
|
|
|
|
|
|
// отслеживание нажатия кнопки редактирования профиля
|
|
// отслеживание нажатия кнопки редактирования профиля
|
|
const [isEditProfile, setIsEditProfile] = useContext(EditProfile)
|
|
const [isEditProfile, setIsEditProfile] = useContext(EditProfile)
|
|
- console.log('isEditProfile: ', isEditProfile)
|
|
|
|
|
|
|
|
// контекст модального окна
|
|
// контекст модального окна
|
|
const [modalName, setModalName, modalArray, setModalArray, openModal, setOpenModal, handleOpenModal, handleCloseModal] = useContext(ModalForCountsContext)
|
|
const [modalName, setModalName, modalArray, setModalArray, openModal, setOpenModal, handleOpenModal, handleCloseModal] = useContext(ModalForCountsContext)
|
|
@@ -448,83 +141,49 @@ export default function BasicCard({ userData }) {
|
|
// отслеживание статуса изменения пароля
|
|
// отслеживание статуса изменения пароля
|
|
const [changePassword, setChangePassword] = useState(false)
|
|
const [changePassword, setChangePassword] = useState(false)
|
|
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
// отслеживаем добавление файлов
|
|
// отслеживаем добавление файлов
|
|
const [selectedFile, setSelectedFile] = useState(null)
|
|
const [selectedFile, setSelectedFile] = useState(null)
|
|
- // console.log('selectedFile: ', selectedFile)
|
|
|
|
|
|
|
|
// установка урла аватара
|
|
// установка урла аватара
|
|
const [userAvatarUrl, setUserAvatarUrl] = useState(url + userData?.avatar?.url);
|
|
const [userAvatarUrl, setUserAvatarUrl] = useState(url + userData?.avatar?.url);
|
|
- // console.log('userAvatarUrl: ', userAvatarUrl)
|
|
|
|
|
|
|
|
// функция загрузки файлов с компа
|
|
// функция загрузки файлов с компа
|
|
const handleFileSelect = (event) => {
|
|
const handleFileSelect = (event) => {
|
|
const file = event.target.files[0];
|
|
const file = event.target.files[0];
|
|
setSelectedFile(file);
|
|
setSelectedFile(file);
|
|
- };
|
|
|
|
|
|
+ }
|
|
|
|
|
|
- // отправляем все на бек когда добавили с компа
|
|
|
|
|
|
+ // отправляем все на бек когда добавили картинки с компа
|
|
useEffect(() => {
|
|
useEffect(() => {
|
|
if (selectedFile) {
|
|
if (selectedFile) {
|
|
- // const res = await dispatch(actionFilesUpload(selectedFile))
|
|
|
|
dispatch(actionFilesUpload(selectedFile)).then((res) => {
|
|
dispatch(actionFilesUpload(selectedFile)).then((res) => {
|
|
-
|
|
|
|
- // console.log('res: ', res)
|
|
|
|
-
|
|
|
|
// ставим на аватар после загрузки
|
|
// ставим на аватар после загрузки
|
|
const newAvatarUrl = url + res?.url;
|
|
const newAvatarUrl = url + res?.url;
|
|
setUserAvatarUrl(newAvatarUrl)
|
|
setUserAvatarUrl(newAvatarUrl)
|
|
|
|
|
|
setUpdateProfile({ ...updateProfile, avatar: { _id: res?._id } })
|
|
setUpdateProfile({ ...updateProfile, avatar: { _id: res?._id } })
|
|
-
|
|
|
|
})
|
|
})
|
|
}
|
|
}
|
|
}, [selectedFile])
|
|
}, [selectedFile])
|
|
|
|
|
|
-
|
|
|
|
// меняем аватарку, если переходим между пользователями или отменяем изменения
|
|
// меняем аватарку, если переходим между пользователями или отменяем изменения
|
|
useEffect(() => {
|
|
useEffect(() => {
|
|
setUserAvatarUrl(url + userData?.avatar?.url)
|
|
setUserAvatarUrl(url + userData?.avatar?.url)
|
|
}, [userData, isEditProfile])
|
|
}, [userData, isEditProfile])
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
|
|
|
|
// открытие поля редактирвоания пароля
|
|
// открытие поля редактирвоания пароля
|
|
- function changePasswordButton() {
|
|
|
|
- setChangePassword(true)
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
|
|
+ // function changePasswordButton() {
|
|
|
|
+ // setChangePassword(true)
|
|
|
|
+ // }
|
|
|
|
|
|
|
|
+ // открытие модального окна с подписчиками
|
|
function userFollowers() {
|
|
function userFollowers() {
|
|
handleOpenModal({
|
|
handleOpenModal({
|
|
arr: userData?.followers, name: `Подписчики ${userData?.login}`
|
|
arr: userData?.followers, name: `Подписчики ${userData?.login}`
|
|
})
|
|
})
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+ // открытие модального окна с подписками
|
|
function userFollowing() {
|
|
function userFollowing() {
|
|
handleOpenModal({
|
|
handleOpenModal({
|
|
arr: userData?.following, name: `Подписки ${userData?.login}`
|
|
arr: userData?.following, name: `Подписки ${userData?.login}`
|
|
@@ -533,19 +192,20 @@ export default function BasicCard({ userData }) {
|
|
|
|
|
|
|
|
|
|
return (
|
|
return (
|
|
- <Container sx={{
|
|
|
|
- display: 'flex',
|
|
|
|
- alignItems: 'center'
|
|
|
|
- }}
|
|
|
|
|
|
+ <Container
|
|
|
|
+ sx={{
|
|
|
|
+ display: 'flex',
|
|
|
|
+ alignItems: 'center'
|
|
|
|
+ }}
|
|
>
|
|
>
|
|
<Box
|
|
<Box
|
|
sx={{
|
|
sx={{
|
|
position: 'relative',
|
|
position: 'relative',
|
|
display: 'inline-block'
|
|
display: 'inline-block'
|
|
- }}>
|
|
|
|
|
|
+ }}
|
|
|
|
+ >
|
|
<Avatar
|
|
<Avatar
|
|
alt={userData?.login}
|
|
alt={userData?.login}
|
|
- // src={url + userData?.avatar?.url}
|
|
|
|
src={userAvatarUrl}
|
|
src={userAvatarUrl}
|
|
sx={{
|
|
sx={{
|
|
width: 130,
|
|
width: 130,
|
|
@@ -577,30 +237,10 @@ export default function BasicCard({ userData }) {
|
|
}
|
|
}
|
|
}}
|
|
}}
|
|
>
|
|
>
|
|
- {/* <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
|
|
<IconButton
|
|
color="primary"
|
|
color="primary"
|
|
aria-label="upload avatar"
|
|
aria-label="upload avatar"
|
|
component="label"
|
|
component="label"
|
|
- // onClick={handleFileUpload}
|
|
|
|
>
|
|
>
|
|
<input
|
|
<input
|
|
hidden
|
|
hidden
|
|
@@ -609,6 +249,7 @@ export default function BasicCard({ userData }) {
|
|
className='getphoto'
|
|
className='getphoto'
|
|
onChange={handleFileSelect}
|
|
onChange={handleFileSelect}
|
|
/>
|
|
/>
|
|
|
|
+
|
|
<ImageSearchRounded
|
|
<ImageSearchRounded
|
|
sx={{
|
|
sx={{
|
|
color: '#FFF',
|
|
color: '#FFF',
|
|
@@ -616,12 +257,9 @@ export default function BasicCard({ userData }) {
|
|
}}
|
|
}}
|
|
/>
|
|
/>
|
|
</IconButton>
|
|
</IconButton>
|
|
-
|
|
|
|
</Box>}
|
|
</Box>}
|
|
</Box>
|
|
</Box>
|
|
|
|
|
|
-
|
|
|
|
-
|
|
|
|
{!isEditProfile &&
|
|
{!isEditProfile &&
|
|
<Box
|
|
<Box
|
|
sx={{
|
|
sx={{
|
|
@@ -630,16 +268,17 @@ export default function BasicCard({ userData }) {
|
|
marginLeft: '50px '
|
|
marginLeft: '50px '
|
|
}}
|
|
}}
|
|
>
|
|
>
|
|
- <CardContent sx={{
|
|
|
|
- flex: '1 0 auto'
|
|
|
|
- }}
|
|
|
|
|
|
+ <CardContent
|
|
|
|
+ sx={{
|
|
|
|
+ flex: '1 0 auto'
|
|
|
|
+ }}
|
|
>
|
|
>
|
|
<Stack
|
|
<Stack
|
|
|
|
+ direction="row"
|
|
|
|
+ spacing={2}
|
|
sx={{
|
|
sx={{
|
|
justifyContent: 'space-between'
|
|
justifyContent: 'space-between'
|
|
}}
|
|
}}
|
|
- direction="row"
|
|
|
|
- spacing={2}
|
|
|
|
>
|
|
>
|
|
<Typography
|
|
<Typography
|
|
component="div"
|
|
component="div"
|
|
@@ -648,7 +287,9 @@ export default function BasicCard({ userData }) {
|
|
{userData?.login}
|
|
{userData?.login}
|
|
</Typography>
|
|
</Typography>
|
|
|
|
|
|
- <UptadeProfileButton data={userData} />
|
|
|
|
|
|
+ <UptadeProfileButton
|
|
|
|
+ data={userData}
|
|
|
|
+ />
|
|
</Stack>
|
|
</Stack>
|
|
|
|
|
|
<Typography
|
|
<Typography
|
|
@@ -673,9 +314,7 @@ export default function BasicCard({ userData }) {
|
|
</Typography>
|
|
</Typography>
|
|
|
|
|
|
<Typography
|
|
<Typography
|
|
- sx={{
|
|
|
|
- cursor: 'pointer'
|
|
|
|
- }}
|
|
|
|
|
|
+ className="cursor-pointer"
|
|
variant="subtitle1"
|
|
variant="subtitle1"
|
|
onClick={userFollowers}
|
|
onClick={userFollowers}
|
|
>
|
|
>
|
|
@@ -683,9 +322,7 @@ export default function BasicCard({ userData }) {
|
|
</Typography>
|
|
</Typography>
|
|
|
|
|
|
<Typography
|
|
<Typography
|
|
- sx={{
|
|
|
|
- cursor: 'pointer'
|
|
|
|
- }}
|
|
|
|
|
|
+ className="cursor-pointer"
|
|
variant="subtitle1"
|
|
variant="subtitle1"
|
|
onClick={userFollowing}
|
|
onClick={userFollowing}
|
|
>
|
|
>
|
|
@@ -694,8 +331,7 @@ export default function BasicCard({ userData }) {
|
|
</Stack>
|
|
</Stack>
|
|
</Box>}
|
|
</Box>}
|
|
|
|
|
|
- {isEditProfile && <ChangeData />
|
|
|
|
- }
|
|
|
|
|
|
+ {isEditProfile && <ChangeData />}
|
|
|
|
|
|
{modalArray && <ModalWindow />}
|
|
{modalArray && <ModalWindow />}
|
|
</Container>
|
|
</Container>
|