Kaynağa Gözat

Add feedWatcher and clearFeedWatcher

LenDoc 1 yıl önce
ebeveyn
işleme
3816a92ce6

+ 3 - 42
src/actions/index.js

@@ -650,48 +650,9 @@ export const actionPostsFeed = (myFollowing, skip) =>
     ),
   )
 
-export const actionFullAllGetPosts = () => async (dispatch, getState) => {
-  const {
-    feed: { postsFeed, postsFeedCount },
-    profileData: { aboutMe },
-    promise,
-  } = getState()
-  let myFollowing =
-    aboutMe?.following && aboutMe?.following?.map(({ _id }) => _id)
-  const myId = getState().auth.payload?.sub?.id
-  console.log('myId', myId)
-  if (!myFollowing)
-    await dispatch(actionFullProfilePage(myId))
-  myFollowing =
-    getState().profileData.aboutMe?.following &&
-    getState().profileData.aboutMe?.following?.map(({ _id }) => _id)
-  console.log('myFollowing ', myFollowing)
-
-  const skip = postsFeed?.length
-  // console.log('skip ', skip)
-  console.log('postsFeed', postsFeed)
-  if (skip !== (postsFeedCount ? postsFeedCount : 1)) {
-    const newPosts = await dispatch(
-      actionPostsFeed([...(myFollowing || []), myId], skip),
-    )
-    console.log('newPosts', newPosts)
-    const newPostsFeedCount = await dispatch(
-      actionPostsFeedCount([...(myFollowing || []), myId]),
-    )
-    if (newPosts && newPostsFeedCount) {
-      console.log('newPosts', newPosts)
-      await dispatch(actionFeedType(newPosts, newPostsFeedCount))
-      // if(promise?.postsFeed?.status=='PENDING')
-      // await dispatch(actionClearFeedPosts())
-      // await dispatch(actionClearPromiseForName('postsFeed'))
-
-      // await dispatch(actionFeedTypeCount(postsFeedCount))
-      // await dispatch(actionClearPromiseForName('postsFeed'))
-
-      // await dispatch(actionFeedType(newPosts))
-    }
-  }
-}
+export const actionFullAllGetPosts = () => ({
+  type:"FEED_POSTS"
+})
 
 export const actionFullExplorePosts = () => async (dispatch, getState) => {
   const {

+ 6 - 6
src/components/Header.js

@@ -40,12 +40,12 @@ export const Explore = () => (
   </Link>
 )
 const User = ({ my_Id, aboutMe: { _id, login, avatar } = {}, onMyPage }) => {
-  console.log('_id in user', _id)
+  // console.log('_id in user', _id)
   
-  // useEffect(() => {
-  //   if (my_Id)
-  //     onMyPage(my_Id)
-  // }, [my_Id])
+  useEffect(() => {
+    if (my_Id)
+      onMyPage(my_Id)
+  }, [my_Id])
   return (
     <Link to={`/profile/${_id}`}>
       {avatar?.url ? (
@@ -62,5 +62,5 @@ export const CUser = connect(
     my_Id: state.auth?.payload?.sub?.id,
     aboutMe: state.profileData.aboutMe,
   }),
-  // { onMyPage: actionFullProfilePageUser },
+  { onMyPage: actionFullProfilePageUser },
 )(User)

+ 11 - 11
src/pages/feedPosts/index.js

@@ -14,13 +14,13 @@ import {
 } from '../../actions'
 import {
   actionFullFeed,
-  actionClearFeedPosts,
+
   actionAddFullCommentFeed,
   actionAddFullLikeFeed,
   actionDeleteFullLikeFeed,
  
 } from '../../redux/saga'
-import {actionFullClearFeedPosts} from '../../redux/reducers/feed/feedReducer'
+import {actionClearFeedPosts} from '../../redux/reducers/feed/feedReducer'
 import { Link } from 'react-router-dom'
 import { Provider, connect } from 'react-redux'
 import { Upload, Button, DatePicker, Space } from 'antd'
@@ -98,16 +98,16 @@ const MyPostFeed = ({
                     <h1  className='Title'> Text: {text || ''}</h1>
                     <Divider>Comments</Divider>
                     <div className="ScrollForFeed">
-                      <CCommentsForFeed
+                      {/* <CCommentsForFeed
                         postId={_id}
                         comments={comments || []}
-                      />
+                      /> */}
                       </div>
                       <center>
                       <div style={{ display: 'flex', padding: '20px', marginLeft:'100px' }}>
-                        <CLikeForFeed likes={likes} postId={_id} />
+                        {/* <CLikeForFeed likes={likes} postId={_id} />
 
-                        <AddComment addComment={addComment} postId={_id} />
+                        <AddComment addComment={addComment} postId={_id} /> */}
                       </div>
                        </center>
                     </div>
@@ -142,16 +142,16 @@ const CCommentsForFeed = connect(
 export const CPostForFeed = connect(
   (state) => ({
     profileData:  state?.profileData.aboutMe || '',
-    postsFeed: state.feed?.postsFeed,
+    postsFeed: state.feed?.postsFeed || [],
     addComment: state.promise?.addComment?.payload,
     postsFeedPromise :state.promise?.postsFeed
   }),
   {
     onPostsFeed: actionFullAllGetPosts,
-    onClearFeed: actionFullClearFeedPosts,
-    addComment: actionAddFullCommentFeed,
-    addCommentReply: actionAddSubFullComment,
-    addLike: actionAddFullLikeForFeed,
+    onClearFeed: actionClearFeedPosts,
+    // addComment: actionAddFullCommentFeed,
+    // addCommentReply: actionAddSubFullComment,
+    // addLike: actionAddFullLikeForFeed,
 
   },
 )(MyPostFeed)

+ 4 - 10
src/redux/reducers/feed/feedReducer.js

@@ -59,17 +59,11 @@ export const feedReducer = (
     }
     return state
 }
-export const actionFullClearFeedPosts = () => (dispatch) => {
-  return dispatch(actionClearFeedPosts())
-}
-export const actionAllClearFeed = () => async (dispatch) => {
-  Promise.all([
-    await dispatch(actionClearPromiseForName('postsFeed')),
-    await dispatch(actionClearPromiseForName('postsFeedCount')),
-      await dispatch(actionClearFeedPosts())
-  ])
 
-}
+// export const actionFullClearFeedPosts = () => (dispatch) => {
+//   return dispatch(actionClearFeedPosts())
+// }
+
 export const actionClearFeedPosts = () =>
   ({ type: 'CLEAR-POSTS' })
 

+ 26 - 19
src/redux/reducers/index.js

@@ -1,4 +1,3 @@
-
 import { createStore, combineReducers, applyMiddleware } from 'redux'
 import thunk from 'redux-thunk'
 import { promiseReducer } from './promise/promiseReducer'
@@ -9,13 +8,23 @@ import { feedReducer } from './feed/feedReducer'
 import { postReducer } from './post/postReducer'
 import { exploreReducer } from './explore/exploreReducer'
 import {
-  promiseWatcher, fullProfilePageWatcher,
-  loginWatcher, fullPageAboutUserWatcher,
-  feedWatcher
+  promiseWatcher,
+  fullProfilePageWatcher,
+  loginWatcher,
+  fullPageAboutUserWatcher,
+  feedWatcher,
+  clearFeedWatcher,
 } from '../saga'
-import createSagaMiddleware from 'redux-saga'; //функция по созданию middleware
-import { all, put, takeEvery, takeLatest, takeLeading, select } from 'redux-saga/effects'; //
-const sagaMiddleware = createSagaMiddleware() 
+import createSagaMiddleware from 'redux-saga' //функция по созданию middleware
+import {
+  all,
+  put,
+  takeEvery,
+  takeLatest,
+  takeLeading,
+  select,
+} from 'redux-saga/effects' //
+const sagaMiddleware = createSagaMiddleware()
 
 export const store = createStore(
   combineReducers({
@@ -25,20 +34,18 @@ export const store = createStore(
     profilePage: profileUserReducer,
     feed: feedReducer,
     post: postReducer,
-    explore: exploreReducer
+    explore: exploreReducer,
   }),
-  applyMiddleware(sagaMiddleware)
+  applyMiddleware(sagaMiddleware),
 )
-function* rootSaga(){ 
-  yield all([ 
-      //тут обычно прописываются саги, описывающие виды экшонов, которые требуют обработки
-      promiseWatcher(), //для пустого старта саги закомментируйте эти строки.
-                        //таким образом вы проверите правильность подключения redux-saga
-      fullProfilePageWatcher(),
-      loginWatcher(),
+function* rootSaga() {
+  yield all([
+    promiseWatcher(), 
+    fullProfilePageWatcher(),
+    loginWatcher(),
     fullPageAboutUserWatcher(),
-    
-    // feedWatcher()
+    clearFeedWatcher(),
+    feedWatcher(),
   ])
 }
-sagaMiddleware.run(rootSaga)
+sagaMiddleware.run(rootSaga)

+ 23 - 22
src/redux/saga/index.js

@@ -29,7 +29,7 @@ import {
 } from '../reducers/feed/feedReducer'
 import { actionProfilePageDataTypeUser } from '../reducers/profileUserPage/profileUserReducer'
 import { actionRemoveDataAboutMe } from '../reducers/profileData/profileReducer'
-import { all, put, takeEvery, takeLatest, takeLeading, select,call } from 'redux-saga/effects'; //
+import { all, put,take, fork, takeEvery, takeLatest, takeLeading, select,call } from 'redux-saga/effects'; //
 import {actionPending,actionFulfilled,actionRejected} from '../../actions'
 
 
@@ -59,7 +59,7 @@ function* loginWorker({login, password}){ //обработчик экшона FU
   }
 }
 export function* loginWatcher() {
-yield takeEvery("'FULL_LOGIN'", loginWorker)
+yield takeEvery("FULL_LOGIN", loginWorker)
 
 }
 //profile page about me
@@ -70,17 +70,18 @@ export const actionFullProfilePage = () =>
 
 function* fullProfilePageWorker() {
   const { auth } = yield select()
+  console.log('auth', auth)
   if (auth?.payload?.sub?.id) {
     const aboutMe = yield call(promiseWorker, actionAboutMe(auth?.payload?.sub.id))
+  console.log('aboutMe in worker', aboutMe)
+   
     if (aboutMe) {
       yield put(actionProfilePageDataType(aboutMe))
-      console.log('about me _id',aboutMe?._id)
-      yield put(actionFullProfilePageUser(aboutMe?._id))
+    
     }
   }
 }
 
-
 export function* fullProfilePageWatcher() {
   yield takeEvery("FULLPROFILE_PAGE", fullProfilePageWorker)
 }
@@ -106,21 +107,21 @@ function* fullPageAboutUserWorker({ _id }) {
 export function* fullPageAboutUserWatcher() {
   yield takeLeading("USER_PAGE", fullPageAboutUserWorker)
 }
-
 function* feedWorker() {
   const {
     feed: { postsFeed, postsFeedCount },
-    profileData: { aboutMe },
+    profileData: { aboutMe},
     
-  } = yield select()
-  let myFollowing =
-    aboutMe?.following && aboutMe?.following?.map(({ _id }) => _id)
-  const myId = yield select().auth.payload?.sub?.id
-  if (!myFollowing)
-  yield put(actionFullProfilePage(myId))
-  // await dispatch(actionFullProfilePage(myId))
-myFollowing = yield select().profileData.aboutMe?.following?.map(({ _id }) => _id)
-  console.log('myFollowing ', myFollowing)
+  }  = yield select()
+  let myFollowing = aboutMe?.following && aboutMe?.following?.map(({ _id }) => _id)
+  const myId = (yield select()).auth?.payload?.sub?.id
+
+  if (!aboutMe) {
+    yield call(fullProfilePageWorker, actionFullProfilePage())
+  }
+  myFollowing = (yield select()).profileData.aboutMe?.following &&
+    (yield select()).profileData.aboutMe?.following?.map(({ _id }) => _id)
+  // console.log('myFollowing after if', myFollowing)
   if (postsFeed.length !== (postsFeedCount ? postsFeedCount : 1)) {
     const newPosts = yield call(promiseWorker, 
       actionPostsFeed([...(myFollowing || []), myId], postsFeed.length),
@@ -128,21 +129,21 @@ myFollowing = yield select().profileData.aboutMe?.following?.map(({ _id }) => _i
     console.log('newPosts', newPosts)
     const newPostsFeedCount = yield call(promiseWorker, (
       actionPostsFeedCount([...(myFollowing || []), myId])))
-    
     if (newPosts && newPostsFeedCount) {
       console.log('newPosts', newPosts)
       yield put(actionFeedType(newPosts, newPostsFeedCount))
     }
   }
-  // const aboutMe = yield call(promiseWorker, actionAboutMe(_id))
-  // if (aboutMe)
-  // yield put(actionProfilePageDataType(aboutMe))
 }
 
-
 export function* feedWatcher() {
-  yield takeEvery("FEED_POSTS", feedWorker)
+  yield takeLeading("FEED_POSTS", feedWorker)
 }
+export function* clearFeedWatcher() {
+  yield takeLeading("CLEAR-POSTS",
+  yield put(actionClearFeedPosts()))
+}
+
 
 //feed