Browse Source

Merge pull request #1 from makstravm/saga

переделано на сагу, фикс скрола, поле поиска
Maksym 2 years ago
parent
commit
85f887e74e

+ 0 - 1
package.json

@@ -15,7 +15,6 @@
         "react-scripts": "5.0.0",
         "react-scripts": "5.0.0",
         "redux": "^4.1.2",
         "redux": "^4.1.2",
         "redux-saga": "^1.1.3",
         "redux-saga": "^1.1.3",
-        "redux-thunk": "^2.4.1",
         "sass": "^1.45.0",
         "sass": "^1.45.0",
         "web-vitals": "^2.1.2"
         "web-vitals": "^2.1.2"
     },
     },

+ 137 - 95
src/actions/index.js

@@ -1,32 +1,29 @@
 import { gql } from "../helpers";
 import { gql } from "../helpers";
-import { actionPromise } from "../redux/redux-thunk";
 
 
 
 
+//*************** ACTIONS PROMISE ******************//
+
 
 
 export const actionPending = name => ({ type: 'PROMISE', status: 'PENDING', name })
 export const actionPending = name => ({ type: 'PROMISE', status: 'PENDING', name })
 export const actionResolved = (name, payload) => ({ type: 'PROMISE', status: 'RESOLVED', name, payload })
 export const actionResolved = (name, payload) => ({ type: 'PROMISE', status: 'RESOLVED', name, payload })
 export const actionRejected = (name, error) => ({ type: 'PROMISE', status: 'REJECTED', name, error })
 export const actionRejected = (name, error) => ({ type: 'PROMISE', status: 'REJECTED', name, error })
 
 
-export const actionAuthLogin = (token, remember) => ({ type: 'AUTH_LOGIN', token, remember })
-export const actionAuthLogout = () => ({ type: 'AUTH_LOGOUT' })
+export const actionPromise = (name, promise) => ({ type: 'PROMISE_START', name, promise })
 
 
-export const actionAboutMeAC = (data) => ({ type: 'ABOUTME-DATA-ADD', data })
-export const actionUpdateMyAvatart = (data) => ({ type: 'ABOUTME-UPDATE-AVATAR', data })
-export const actionAddPostsFeedAC = (count, newResult, userData) => ({ type: 'ADD-POSTS-FEED', newResult, userData, count })
-export const actionRemovePostsFeedAC = () => ({ type: 'REMOVE-POSTS-FEED' })
 
 
-export const actionAddLikePostAC = (postId, newResult) => ({ type: 'ADD-POST-LIKE', postId, newResult })
-export const actionRemoveLikePostAC = (postId, newResult) => ({ type: 'REMOVE-POST-LIKE', postId, newResult })
-export const actionAddCommentAC = (postId, newResult) => ({ type: 'ADD-COMMENT', postId, newResult })
+//*************** ACTIONS AUTHORIZATION ******************//
 
 
-export const actionUpdateFollowersAC = (newResult) => ({ type: 'UPDATE-FOLLOWERS', newResult })
 
 
-//****************---Action Authirization ---*************************//
+export const actionAuthLogin = (token, remember) => ({ type: 'AUTH-LOGIN', token, remember })
+export const actionAuthLogout = () => ({ type: 'AUTH-LOGOUT' })
 
 
-export const actionLogin = (login, password) =>
+export const actionLogIn = (login, password) =>
     actionPromise('login', gql(`query login($login:String!, $password:String!){
     actionPromise('login', gql(`query login($login:String!, $password:String!){
-            login(login:$login, password:$password)
-        }`, { login, password }))
+                login(login:$login, password:$password)
+            }`, { login, password }))
+
+export const actionFullLogIn = (login, password, remember) => ({ type: 'FULL_LOGIN', login, password, remember })
+export const actionFullRegister = (login, password, remember) => ({ type: 'FULL_REGISTER', login, password, remember })
 
 
 export const actionRegister = (login, password) =>
 export const actionRegister = (login, password) =>
     actionPromise('register', gql(`mutation rega ($login:String!, $password:String!){
     actionPromise('register', gql(`mutation rega ($login:String!, $password:String!){
@@ -35,6 +32,13 @@ export const actionRegister = (login, password) =>
                                     }
                                     }
                                 }`, { login, password }))
                                 }`, { login, password }))
 
 
+//*************** Action ABOUT ME ******************//
+
+
+export const actionAboutMeAC = (data) => ({ type: 'ABOUTME-DATA-ADD', data })
+
+export const actionFullAboutMe = () => ({ type: 'ABOUT_ME' })
+
 export const actionAboutMe = (id) =>
 export const actionAboutMe = (id) =>
     actionPromise('aboutMe', gql(`query userOned($myID:String!){
     actionPromise('aboutMe', gql(`query userOned($myID:String!){
                         UserFindOne(query: $myID){
                         UserFindOne(query: $myID){
@@ -45,21 +49,29 @@ export const actionAboutMe = (id) =>
                 }`, { myID: JSON.stringify([{ ___owner: id }]) }))
                 }`, { myID: JSON.stringify([{ ___owner: id }]) }))
 
 
 
 
+//*************** Action Posts Feed ******************//
+
+
+export const actionAddPostsFeedAC = (postsData, count) => ({ type: 'ADD-POSTS-FEED', newResult: postsData, count })
+export const actionRemovePostsFeedAC = () => ({ type: 'REMOVE-POSTS-FEED' })
 
 
+export const actionPostsFeed = () => ({ type: 'POSTS_FEED' })
 
 
-export const actionMyFolowingPosts = (skip, myFollowing) =>
+export const actionPostsMyFollowing = (skip, myFollowing) =>
     actionPromise('followingPosts',
     actionPromise('followingPosts',
         gql(`query allposts($query: String!){
         gql(`query allposts($query: String!){
-        PostFind(query:$query){
-            _id, text, title
-            owner{_id, nick, login, avatar {url}}
-            likes { _id owner {_id}}   
-            images{url _id}
-            comments{_id text owner{_id nick login} likes{_id}}
-            createdAt
+            PostFind(query:$query){
+                _id, text, title
+                owner{_id, nick, login, avatar {url}}
+                likes { _id owner {_id}}   
+                images{url _id}
+                comments{_id text owner{_id nick login} likes{_id}}
+                createdAt
         }
         }
     }`, {
     }`, {
-            query: JSON.stringify([{ ___owner: { $in: myFollowing } },
+            query: JSON.stringify([{
+                ___owner: { $in: myFollowing }
+            },
             {
             {
                 sort: [{ _id: -1 }],
                 sort: [{ _id: -1 }],
                 skip: [skip || 0],
                 skip: [skip || 0],
@@ -67,13 +79,52 @@ export const actionMyFolowingPosts = (skip, myFollowing) =>
             }])
             }])
         }))
         }))
 
 
+export const actionPostsCount = (_id) =>
+    actionPromise('userPostsCount', gql(` query userPostsCount($id:String!){
+                PostCount(query:$id)
+                }`, { id: JSON.stringify([{ ___owner: { $in: _id } }]) }))
+
+
+//*************** Action Posts Profile ******************//
+
+
+export const actionProfileDataAC = (postsData, count, userData) => ({ type: 'ADD-PROFILE-DATA', newResult: postsData, count, userData })
+
+export const actionProfilePageData = (id) => ({ type: 'DATA_PROFILE', id })
+
+export const actionProfileData = (_id) =>
+    actionPromise('userOneData', gql(` query userOned($id:String!){
+                        UserFindOne(query: $id){
+                            _id  login nick
+                            avatar { _id url }     
+                            createdAt
+                            followers {_id nick login}
+                            following {_id nick login}
+                }
+            } `, { id: JSON.stringify([{ _id }]) }))
 
 
-// 
+export const actionProfilePagePost = (_id, skip) => actionPromise('userOneDataPosts', gql(` query userOned($id:String!){
+                PostFind(query:$id){
+                    _id   images{url _id}
+                }
+                }`, {
+    id: JSON.stringify([{
+        ___owner: _id
+    },
+    {
+        sort: [{ _id: -1 }],
+        skip: [skip || 0],
+        limit: [24]
+    }])
+}))
 
 
 
 
 //****************---Action FindUsers ---*************************//
 //****************---Action FindUsers ---*************************//
 
 
-export const actionFindUsers = (value) =>
+
+export const actionSearchUsers = (value) => ({ type: 'SEARCH_USERS', value })
+
+export const actionLoadSearchUsers = (value) =>
     actionPromise('findUsersAll', gql(`query findUsersAll($query:String!) {
     actionPromise('findUsersAll', gql(`query findUsersAll($query:String!) {
                                 UserFind(query: $query) {
                                 UserFind(query: $query) {
                                     _id login nick 
                                     _id login nick 
@@ -89,14 +140,15 @@ export const actionFindUsers = (value) =>
         ])
         ])
     }))
     }))
 
 
+
 //****************---Action Like ---*************************//
 //****************---Action Like ---*************************//
 
 
-export const actionRemoveLikePost = (_id) =>
-    actionPromise('removelikePost', gql(`mutation LikeRemove($like:LikeInput){
-        LikeDelete(like:$like){
-            _id
-        }
-    }`, { like: { _id } }))
+
+export const actionAddLikePostAC = (postId, newResult) => ({ type: 'ADD-POST-LIKE', postId, newResult })
+export const actionRemoveLikePostAC = (postId, newResult) => ({ type: 'REMOVE-POST-LIKE', postId, newResult })
+
+
+export const actionLikePost = (postId) => ({ type: 'LIKE_POST', postId })
 
 
 export const actionAddLikePost = (_id) =>
 export const actionAddLikePost = (_id) =>
     actionPromise('likePost', gql(`mutation LikePost($like:LikeInput){
     actionPromise('likePost', gql(`mutation LikePost($like:LikeInput){
@@ -105,74 +157,52 @@ export const actionAddLikePost = (_id) =>
         }
         }
     }`, { like: { post: { _id } } }))
     }`, { like: { post: { _id } } }))
 
 
-export const actionMyLikePost = (postId) =>
-    actionPromise('myLikes', gql(`query likeFindPost ($id:String!){
-        PostFindOne(query:$id){
-        likes { _id owner {_id}} 
-        }
-    }`, { id: JSON.stringify([{ _id: postId }]) }))
 
 
+export const actionDelLikePost = (likeId, postId) => ({ type: 'DEL_LIKE_POST', likeId, postId })
 
 
-//****************---Action Comment ---*************************//
+export const actionRemoveLikePost = (_id) =>
+    actionPromise('removelikePost', gql(`mutation LikeRemove($like:LikeInput){
+            LikeDelete(like:$like){
+                _id
+            }
+        }`, { like: { _id } }))
 
 
-export const actionAddComment = (postId, text) =>
-    actionPromise('addcomment', gql(`mutation addcomment($comment: CommentInput ){
-        CommentUpsert(comment:$comment){
-            _id text
-        }
-    }`, { comment: { post: { _id: postId }, text } }))
 
 
-export const actionFindComment = (postId) =>
-    actionPromise('findCommentPost', gql(`query commentFindPost ($id:String!){
+export const actionMyLikePost = (postId) =>
+    actionPromise('myLikes', gql(`query likeFindPost ($id:String!){
         PostFindOne(query:$id){
         PostFindOne(query:$id){
-         comments{_id text owner{_id nick login} likes{_id}}
+        likes { _id owner {_id}}
         }
         }
     }`, { id: JSON.stringify([{ _id: postId }]) }))
     }`, { id: JSON.stringify([{ _id: postId }]) }))
 
 
-//****************---Action ProfileData ---*************************//
 
 
-export const actionProfilePageData = (_id) =>
-    actionPromise('userOneData', gql(` query userOned($id:String!){
-                        UserFindOne(query: $id){
-                            _id  login nick
-                            avatar { _id url }     
-                            createdAt
-                            followers {_id nick login}
-                            following {_id nick login}
-                }
-            } `, { id: JSON.stringify([{ _id }]) }))
+//****************---Action Subscribe ---*************************//
 
 
-export const actionProfilePagePost = (_id, skip) =>
-    actionPromise('userOneDataPosts', gql(` query userOned($id:String!){
-                PostFind(query:$id){
-                    _id   images{url _id}
-                }
-                }`, {
-        id: JSON.stringify([{
-            ___owner: _id
-        },
-        {
-            sort: [{ _id: -1 }],
-            skip: [skip || 0],
-            limit: [10]
-        }])
-    }))
 
 
-export const actionProfilePostCount = (_id) =>
-    actionPromise('userPostsCount', gql(` query userPostsCount($id:String!){
-                PostCount(query:$id)
-                }`, { id: JSON.stringify([{ ___owner: { $in: _id } }]) }))
+export const actionUpdateFollowersAC = (newResult) => ({ type: 'UPDATE-FOLLOWERS', newResult })
+
+export const actionSubscribe = (userId) => ({ type: 'SUBSCRIBE', userId })
+export const actionUnSubscribe = (userId) => ({ type: 'UN_SUBSCRIBE', userId })
+
+export const actionLoadSubscribe = (myID, myFollowing, userId) =>
+    actionPromise('subscribe', gql(`mutation following($user:UserInput){
+        UserUpsert( user:$user){
+            following{_id}
+        }
+      }`, { user: { _id: myID, following: [...myFollowing || [], { _id: userId }] } }))
+export const actionloadUnSubscribe = (myID, myFollowing) =>
+    actionPromise('unSubscribe', gql(`mutation followingUn($user:UserInput){
+        UserUpsert( user:$user){
+            following{_id}
+        }
+      }`, { user: { _id: myID, following: [...myFollowing] } }))
 
 
-//****************---Action ProfileData ---*************************//
-//  
 export const actionUpdateMyFollowing = (_id) =>
 export const actionUpdateMyFollowing = (_id) =>
     actionPromise('upDateFollowing', gql(` query followers($id:String!){
     actionPromise('upDateFollowing', gql(` query followers($id:String!){
         UserFindOne(query: $id){
         UserFindOne(query: $id){
                             following {_id nick login}
                             following {_id nick login}
         }
         }
     }`, { id: JSON.stringify([{ _id }]) }))
     }`, { id: JSON.stringify([{ _id }]) }))
-
-
 export const actionUpdateFollowers = (_id) =>
 export const actionUpdateFollowers = (_id) =>
     actionPromise('upDateFollowers', gql(` query followers($id:String!){
     actionPromise('upDateFollowers', gql(` query followers($id:String!){
         UserFindOne(query: $id){
         UserFindOne(query: $id){
@@ -180,23 +210,31 @@ export const actionUpdateFollowers = (_id) =>
         }
         }
     }`, { id: JSON.stringify([{ _id }]) }))
     }`, { id: JSON.stringify([{ _id }]) }))
 
 
-export const actionSubscribe = (myID, myFollowing, userId) =>
-    actionPromise('subscribe', gql(`mutation following($user:UserInput){
-        UserUpsert( user:$user){
-            following{_id}
-        }
-      }`, { user: { _id: myID, following: [...myFollowing || [], { _id: userId }] } }))
 
 
-export const actionUnSubscribe = (myID, myFollowing) =>
-    actionPromise('unSubscribe', gql(`mutation followingUn($user:UserInput){
-        UserUpsert( user:$user){
-            following{_id}
+//****************---Action Comments ---*************************//
+
+
+export const actionAddCommentAC = (postId, newResult) => ({ type: 'ADD-COMMENT', postId, newResult })
+export const actionFullAddComment = (postId, text) => ({ type: 'COMMENT_POST', postId, text })
+
+export const actionAddComment = (postId, text) =>
+    actionPromise('addcomment', gql(`mutation addcomment($comment: CommentInput ){
+        CommentUpsert(comment:$comment){
+            _id text
         }
         }
-      }`, { user: { _id: myID, following: [...myFollowing] } }))
+    }`, { comment: { post: { _id: postId }, text } }))
+export const actionFindComment = (postId) =>
+    actionPromise('findCommentPost', gql(`query commentFindPost ($id:String!){
+        PostFindOne(query:$id){
+            comments{_id text owner{_id nick login} likes{_id}}
+        }
+    }`, { id: JSON.stringify([{ _id: postId }]) }))
 
 
 
 
+//****************---Action Udate Avatar ---*************************//
 
 
-//****************---Action Upload Images ---*************************//
+export const actionUpdateAvatar = (file) => ({ type: 'UPDATE_AVATAR', file })
+export const actionUpdateMyAvatart = (data) => ({ type: 'ABOUTME-UPDATE-AVATAR', data })
 
 
 
 
 export const actionSetAvatar = (file, id) =>
 export const actionSetAvatar = (file, id) =>
@@ -204,7 +242,7 @@ export const actionSetAvatar = (file, id) =>
                 UserUpsert(user: $ava){
                 UserUpsert(user: $ava){
                     _id avatar {_id}
                     _id avatar {_id}
                 }
                 }
-              }`, { ava: { _id: id, avatar: { _id: file._id } } })
+            }`, { ava: { _id: id, avatar: { _id: file._id } } })
     )
     )
 export const actionGetAvatar = (id) =>
 export const actionGetAvatar = (id) =>
     actionPromise('uploadPhoto', gql(`query userOned($myID: String!){
     actionPromise('uploadPhoto', gql(`query userOned($myID: String!){
@@ -212,3 +250,7 @@ export const actionGetAvatar = (id) =>
                             avatar { _id url }
                             avatar { _id url }
         }
         }
     }`, { myID: JSON.stringify([{ ___owner: id }]) }))
     }`, { myID: JSON.stringify([{ ___owner: id }]) }))
+
+
+//****************---_____________ ---*************************//
+

+ 2 - 2
src/components/Authorization.jsx

@@ -5,7 +5,7 @@ import { NavLink} from 'react-router-dom'
 
 
 import { Form, Input, Button, Row, Col, Card, Divider, Checkbox } from 'antd';
 import { Form, Input, Button, Row, Col, Card, Divider, Checkbox } from 'antd';
 import { UserOutlined, LockOutlined } from '@ant-design/icons';
 import { UserOutlined, LockOutlined } from '@ant-design/icons';
-import { actionFullLogin, actionFullRegister } from '../redux/redux-thunk';
+import { actionFullLogIn, actionFullRegister } from '../actions';
 
 
 const FormInput = ({ buttonTitle, onSignIn }) => {
 const FormInput = ({ buttonTitle, onSignIn }) => {
     const onFinish = ({ login, password, remember }) => {
     const onFinish = ({ login, password, remember }) => {
@@ -65,7 +65,7 @@ const FormInput = ({ buttonTitle, onSignIn }) => {
         </Form>
         </Form>
     )
     )
 }
 }
-const CLoginForm = connect(null, { onSignIn: actionFullLogin})(FormInput)
+const CLoginForm = connect(null, { onSignIn: actionFullLogIn})(FormInput)
 const CRegisterForm = connect(null, { onSignIn: actionFullRegister})(FormInput)
 const CRegisterForm = connect(null, { onSignIn: actionFullRegister})(FormInput)
 
 
 export const Authorization = ({ match: { params: { _id } } }) => {
 export const Authorization = ({ match: { params: { _id } } }) => {

+ 6 - 6
src/components/header/Search.jsx

@@ -2,7 +2,7 @@ import { Empty, Input, Popover } from 'antd'
 import React from 'react'
 import React from 'react'
 import { connect } from 'react-redux';
 import { connect } from 'react-redux';
 import { Link } from 'react-router-dom';
 import { Link } from 'react-router-dom';
-import { actionFindUsers } from '../../actions';
+import { actionFindUsers, actionSearchUsers } from '../../actions';
 import { UserAvatar } from './Header';
 import { UserAvatar } from './Header';
 
 
 const { Search } = Input;
 const { Search } = Input;
@@ -25,6 +25,7 @@ const FindUsersResult = ({ usersRes }) => {
 }
 }
 
 
 export const FieldSearch = ({ usersRes, findUsers }) => {
 export const FieldSearch = ({ usersRes, findUsers }) => {
+
     return (
     return (
         <>
         <>
             <Popover placement="bottom"
             <Popover placement="bottom"
@@ -32,15 +33,14 @@ export const FieldSearch = ({ usersRes, findUsers }) => {
                 destroyTooltipOnHide={true}
                 destroyTooltipOnHide={true}
                 trigger="focus">
                 trigger="focus">
                 <></>
                 <></>
-                <Search className='Header__search'
-                    onSearch={value => findUsers(value)}
+                <Input
                     placeholder="Search users"
                     placeholder="Search users"
                     allowClear
                     allowClear
-                    enterButton="Search"
-                    enterButton />
+                    onChange={e => findUsers(e.currentTarget.value)}
+                />
             </Popover>
             </Popover>
         </>
         </>
     )
     )
 }
 }
 
 
-export const CFieldSearch = connect(state => ({ usersRes: state.promise?.findUsersAll?.payload || [] }), { findUsers: actionFindUsers })(FieldSearch) 
+export const CFieldSearch = connect(state => ({ usersRes: state.promise?.findUsersAll?.payload || [] }), { findUsers: actionSearchUsers })(FieldSearch) 

+ 2 - 3
src/components/main/Add.js

@@ -3,9 +3,8 @@ import { LoadingOutlined, PlusOutlined } from '@ant-design/icons';
 import { connect } from 'react-redux';
 import { connect } from 'react-redux';
 import { Upload, message } from 'antd';
 import { Upload, message } from 'antd';
 import { backURL, gql } from '../../helpers';
 import { backURL, gql } from '../../helpers';
-import { actionSetAvatar } from '../../actions';
-import { actionFullSetAvatar } from '../../redux/redux-thunk';
 import { Loo } from './Loo';
 import { Loo } from './Loo';
+import { actionUpdateAvatar } from '../../actions';
 
 
 const Add = ({ imageUrl, onUploadFile }) => {
 const Add = ({ imageUrl, onUploadFile }) => {
     const [loading, setLoading] = useState(false)
     const [loading, setLoading] = useState(false)
@@ -56,4 +55,4 @@ const Add = ({ imageUrl, onUploadFile }) => {
     )
     )
 }
 }
 
 
-export const CAdd = connect(state => ({ imageUrl: state?.myData?.avatar?.url }), { onUploadFile: actionFullSetAvatar })(Add)
+export const CAdd = connect(state => ({ imageUrl: state?.myData?.avatar?.url }), { onUploadFile: actionUpdateAvatar  })(Add)

+ 7 - 11
src/components/main/MainPostsFeed.js

@@ -9,8 +9,7 @@ import { HeartFilled, HeartOutlined, LeftCircleOutlined, RightCircleOutlined, Se
 import Paragraph from 'antd/lib/typography/Paragraph'
 import Paragraph from 'antd/lib/typography/Paragraph'
 import Text from 'antd/lib/typography/Text'
 import Text from 'antd/lib/typography/Text'
 import TextArea from 'antd/lib/input/TextArea'
 import TextArea from 'antd/lib/input/TextArea'
-import { actionAddPostsFeed, actionFullAddComment, actionFullAddLikePost, actionFullRemoveLikePost } from '../../redux/redux-thunk'
-import { actionRemovePostsFeedAC } from '../../actions'
+import { actionDelLikePost, actionFullAddComment, actionLikePost, actionPostsFeed, actionRemovePostsFeedAC } from '../../actions'
 
 
 const PostTitle = ({ owner }) =>
 const PostTitle = ({ owner }) =>
     <Link to={`/profile/${owner?._id}`} className='owner'>
     <Link to={`/profile/${owner?._id}`} className='owner'>
@@ -126,8 +125,8 @@ const CPostUserPanel = connect(state => ({
     myID: state.auth.payload.sub.id || '',
     myID: state.auth.payload.sub.id || '',
     myLikes: state?.promise?.myLikes?.payload || [],
     myLikes: state?.promise?.myLikes?.payload || [],
 }), {
 }), {
-    addLikePost: actionFullAddLikePost,
-    removeLikePost: actionFullRemoveLikePost,
+    addLikePost: actionLikePost,
+    removeLikePost: actionDelLikePost,
 })(PostUserPanel)
 })(PostUserPanel)
 
 
 const PostDescription = ({ title, description, date }) =>
 const PostDescription = ({ title, description, date }) =>
@@ -223,18 +222,16 @@ const Post = ({ postData: { _id, text, title, owner, images, createdAt = '', com
     )
     )
 }
 }
 
 
-const MainPostsFeed = ({ posts, countPosts, postsFollowing, postsFollowingRemove, following }) => {
+const MainPostsFeed = ({ posts, count, postsFollowing, postsFollowingRemove, following }) => {
     const [checkScroll, setCheckScroll] = useState(true)
     const [checkScroll, setCheckScroll] = useState(true)
 
 
-    useEffect(async () => {
+    useEffect(() => {
         if (checkScroll && following.length !== 0) {
         if (checkScroll && following.length !== 0) {
-            await postsFollowing(following)
+            postsFollowing(following)
             setCheckScroll(false)
             setCheckScroll(false)
         }
         }
     }, [checkScroll, following])
     }, [checkScroll, following])
 
 
-
-
     useEffect(() => {
     useEffect(() => {
         document.addEventListener('scroll', scrollHandler)
         document.addEventListener('scroll', scrollHandler)
         return () => {
         return () => {
@@ -257,10 +254,9 @@ const MainPostsFeed = ({ posts, countPosts, postsFollowing, postsFollowingRemove
 }
 }
 
 
 export const CMainPostsFeed = connect(state => ({
 export const CMainPostsFeed = connect(state => ({
-    countPosts: state?.postsFeed?.count || 1,
     posts: state?.postsFeed?.posts || [],
     posts: state?.postsFeed?.posts || [],
     following: state?.myData.following || []
     following: state?.myData.following || []
 }), {
 }), {
-    postsFollowing: actionAddPostsFeed,
+    postsFollowing: actionPostsFeed,
     postsFollowingRemove: actionRemovePostsFeedAC,
     postsFollowingRemove: actionRemovePostsFeedAC,
 })(MainPostsFeed)
 })(MainPostsFeed)

+ 11 - 11
src/components/main/Profile.js

@@ -3,9 +3,8 @@ import Modal from 'antd/lib/modal/Modal'
 import React, { useEffect, useState } from 'react'
 import React, { useEffect, useState } from 'react'
 import { connect } from 'react-redux'
 import { connect } from 'react-redux'
 import { Link } from 'react-router-dom'
 import { Link } from 'react-router-dom'
-import { actionRemovePostsFeedAC } from '../../actions'
+import { actionProfilePageData, actionRemovePostsFeedAC, actionSubscribe, actionUnSubscribe } from '../../actions'
 import { backURL } from '../../helpers'
 import { backURL } from '../../helpers'
-import { actionFullProfilePageData, actionFullSubscribe, actionFullUnSubscribe } from '../../redux/redux-thunk'
 import { UserAvatar } from '../header/Header'
 import { UserAvatar } from '../header/Header'
 
 
 const ModalFolower = ({ statusModal, data, title }) => {
 const ModalFolower = ({ statusModal, data, title }) => {
@@ -58,7 +57,7 @@ const ProfileSetting = ({ myID, userId, followers, onSubsuscribe, onUnSubsuscrib
 const CProfileSetting = connect(state => ({
 const CProfileSetting = connect(state => ({
     myID: state?.auth?.payload?.sub.id,
     myID: state?.auth?.payload?.sub.id,
     followers: state?.postsFeed?.userData?.followers || []
     followers: state?.postsFeed?.userData?.followers || []
-}), { onSubsuscribe: actionFullSubscribe, onUnSubsuscribe: actionFullUnSubscribe })(ProfileSetting)
+}), { onSubsuscribe: actionSubscribe, onUnSubsuscribe: actionUnSubscribe })(ProfileSetting)
 
 
 const ProfilePageData = ({ data: { _id, avatar, login, nick, followers, following }, count, setFollowing, setFollowers }) => {
 const ProfilePageData = ({ data: { _id, avatar, login, nick, followers, following }, count, setFollowing, setFollowers }) => {
 
 
@@ -118,23 +117,24 @@ const ProfilePagePosts = ({ posts }) => {
 
 
 export const CProfilePagePosts = connect(state => ({ posts: state.postsFeed?.posts || [] }))(ProfilePagePosts)
 export const CProfilePagePosts = connect(state => ({ posts: state.postsFeed?.posts || [] }))(ProfilePagePosts)
 
 
-const ProfilePage = ({ match: { params: { _id } }, posts, countPost, getProfileUser, clearDataProfile }) => {
+const ProfilePage = ({ match: { params: { _id } }, posts, count, getProfileUser, clearDataProfile }) => {
     const [followers, setFollowers] = useState(false)
     const [followers, setFollowers] = useState(false)
     const [following, setFollowing] = useState(false)
     const [following, setFollowing] = useState(false)
     const [checkScroll, setCheckScroll] = useState(true)
     const [checkScroll, setCheckScroll] = useState(true)
 
 
     useEffect(() => {
     useEffect(() => {
         document.addEventListener('scroll', scrollHandler)
         document.addEventListener('scroll', scrollHandler)
-        return async () => {
+        return () => {
             document.removeEventListener('scroll', scrollHandler)
             document.removeEventListener('scroll', scrollHandler)
             setCheckScroll(true)
             setCheckScroll(true)
-            await clearDataProfile()
-            console.log(posts.length);
+            clearDataProfile()
         }
         }
     }, [_id])
     }, [_id])
-    useEffect(async () => {
-        if (checkScroll) {
-            await getProfileUser(_id)
+
+    useEffect(() => {
+        if (checkScroll ) {
+         
+            getProfileUser(_id)
             setCheckScroll(false)
             setCheckScroll(false)
         }
         }
     }, [_id, checkScroll])
     }, [_id, checkScroll])
@@ -157,4 +157,4 @@ const ProfilePage = ({ match: { params: { _id } }, posts, countPost, getProfileU
 
 
 export const CProfilePage = connect(state => ({
 export const CProfilePage = connect(state => ({
     posts: state?.postsFeed?.posts || []
     posts: state?.postsFeed?.posts || []
-}), { getProfileUser: actionFullProfilePageData, clearDataProfile: actionRemovePostsFeedAC })(ProfilePage)
+}), { getProfileUser: actionProfilePageData, clearDataProfile: actionRemovePostsFeedAC })(ProfilePage)

+ 3 - 3
src/redux/auth-reducer.js

@@ -4,12 +4,12 @@ import { jwtDecode } from '../helpers'
 export const authReducer = (state, { type, token, remember }) => {
 export const authReducer = (state, { type, token, remember }) => {
     if (!state) {
     if (!state) {
         if (localStorage.authToken || sessionStorage.authToken) {
         if (localStorage.authToken || sessionStorage.authToken) {
-            type = 'AUTH_LOGIN'
+            type = 'AUTH-LOGIN'
             token = localStorage.authToken || sessionStorage.authToken
             token = localStorage.authToken || sessionStorage.authToken
         } else state = {}
         } else state = {}
     }
     }
 
 
-    if (type === 'AUTH_LOGIN') {
+    if (type === 'AUTH-LOGIN') {
         remember ?
         remember ?
             localStorage.setItem('authToken', token) :
             localStorage.setItem('authToken', token) :
             sessionStorage.setItem('authToken', token)
             sessionStorage.setItem('authToken', token)
@@ -22,7 +22,7 @@ export const authReducer = (state, { type, token, remember }) => {
             }
             }
         } else return state
         } else return state
     }
     }
-    if (type === 'AUTH_LOGOUT') {
+    if (type === 'AUTH-LOGOUT') {
         localStorage.removeItem('authToken')
         localStorage.removeItem('authToken')
         sessionStorage.removeItem('authToken')
         sessionStorage.removeItem('authToken')
         return {}
         return {}

+ 8 - 1
src/redux/postFeed-reducer.js

@@ -7,7 +7,14 @@ export const postsFeedReducer = (state = {}, { type, postId, newResult, userData
             return {
             return {
                 ...state,
                 ...state,
                 posts: !!posts ? [...posts, ...newResult] : [...newResult],
                 posts: !!posts ? [...posts, ...newResult] : [...newResult],
-                userData: { ...userData },
+                count
+            }
+        },
+        'ADD-PROFILE-DATA': () => {
+            return {
+                ...state,
+                posts: !!posts ? [...posts, ...newResult] : [...newResult],
+                userData,
                 count
                 count
             }
             }
         },
         },

+ 7 - 4
src/redux/redux-store.js

@@ -1,12 +1,13 @@
 import { createStore, combineReducers, applyMiddleware } from 'redux';
 import { createStore, combineReducers, applyMiddleware } from 'redux';
-import thunk from 'redux-thunk';
 import { authReducer } from './auth-reducer';
 import { authReducer } from './auth-reducer';
 import { myProfileReducer } from './myProfile-reducer';
 import { myProfileReducer } from './myProfile-reducer';
 import { postsFeedReducer } from './postFeed-reducer';
 import { postsFeedReducer } from './postFeed-reducer';
 import { promiseReducer } from './promise-reducer';
 import { promiseReducer } from './promise-reducer';
-import { actionFullAboutMe } from './redux-thunk';
-
+import createSagaMiddleware from 'redux-saga'
+import { rootSaga } from './saga';
+import { actionFullAboutMe } from '../actions'
 
 
+const sagaMiddleware = createSagaMiddleware()
 
 
 const store = createStore(combineReducers({
 const store = createStore(combineReducers({
     auth: authReducer,
     auth: authReducer,
@@ -14,7 +15,9 @@ const store = createStore(combineReducers({
     myData: myProfileReducer,
     myData: myProfileReducer,
     postsFeed: postsFeedReducer,
     postsFeed: postsFeedReducer,
 }),
 }),
-    applyMiddleware(thunk))
+    applyMiddleware(sagaMiddleware))
+
+sagaMiddleware.run(rootSaga)
 
 
 store.dispatch(actionFullAboutMe())
 store.dispatch(actionFullAboutMe())
 
 

File diff suppressed because it is too large
+ 0 - 133
src/redux/redux-thunk.js


File diff suppressed because it is too large
+ 251 - 0
src/redux/saga/index.js


+ 0 - 5
yarn.lock

@@ -7722,11 +7722,6 @@ redux-saga@^1.1.3:
   dependencies:
   dependencies:
     "@redux-saga/core" "^1.1.3"
     "@redux-saga/core" "^1.1.3"
 
 
-redux-thunk@^2.4.1:
-  version "2.4.1"
-  resolved "https://registry.yarnpkg.com/redux-thunk/-/redux-thunk-2.4.1.tgz#0dd8042cf47868f4b29699941de03c9301a75714"
-  integrity sha512-OOYGNY5Jy2TWvTL1KgAlVy6dcx3siPJ1wTq741EPyUKfn6W6nChdICjZwCd0p8AZBs5kWpZlbkXW2nE/zjUa+Q==
-
 redux@^4.0.0, redux@^4.0.4, redux@^4.1.2:
 redux@^4.0.0, redux@^4.0.4, redux@^4.1.2:
   version "4.1.2"
   version "4.1.2"
   resolved "https://registry.yarnpkg.com/redux/-/redux-4.1.2.tgz#140f35426d99bb4729af760afcf79eaaac407104"
   resolved "https://registry.yarnpkg.com/redux/-/redux-4.1.2.tgz#140f35426d99bb4729af760afcf79eaaac407104"