Browse Source

Update posts feed with scroll

LenDoc 2 years ago
parent
commit
0cd1807df7
4 changed files with 61 additions and 27 deletions
  1. 15 11
      src/actionReducers/index.js
  2. 38 10
      src/actions/index.js
  3. 4 3
      src/components/PostFeed.js
  4. 4 3
      src/reducers/index.js

+ 15 - 11
src/actionReducers/index.js

@@ -10,6 +10,7 @@ import {
   actionDeleteLike,
   actionPostsCount,
   actionAuthLogout,
+  actionClearPromiseForName
 } from '../actions'
 import { history } from '../App'
 //user
@@ -64,8 +65,8 @@ export const actionRemoveDataUser = () =>
 
 //feed
 //type
-export const actionFeedType = (newPosts) => 
-  ({ type: 'ADD-POSTS', newPosts })
+export const actionFeedType = (newPosts,newPostsFeedCount) => 
+  ({ type: 'ADD-POSTS', newPosts,newPostsFeedCount })
   export const actionFeedTypeCount = (postsFeedCount) => 
   ({ type: 'COUNT', postsFeedCount })
 
@@ -73,16 +74,19 @@ export const actionFeedType = (newPosts) =>
 // ({ type: 'POSTS', postsFeed })
 
 
-export const actionFullFeed = () => async (dispatch, getState) => {
-  const postsFeed = await dispatch(actionPostsFeed(getState))
-  const skip = postsFeed.length
-  const postsFeedCount = await dispatch(actionPostsFeedCount(getState))
-  if (skip < postsFeedCount) {
-    const newPosts = await dispatch(actionPostsFeed(getState, skip))
-    if (newPosts) {
-      await dispatch(actionFeedType(newPosts))
+export const actionFullFeed = (myFollowing, myId,skip=0) => async (dispatch) => {
+
+
+  // const postsFeed = await dispatch(actionPostsFeed([...myFollowing, myId], skip))
+  const postsFeedCount = await dispatch(actionPostsFeedCount([...myFollowing || [], myId]))
+
+    const newPosts = await dispatch(actionPostsFeed([...myFollowing || [], myId], skip))
+    if (newPosts&&postsFeedCount) {
+      await dispatch(actionFeedType(...newPosts))
+      await dispatch(actionFeedTypeCount(postsFeedCount))
+      // await dispatch(actionClearPromiseForName('postsFeed'))
     }
-  }
+  
 }
 
 // export const actionFullFeed = (myFollowing) => async (dispatch) => {

+ 38 - 10
src/actions/index.js

@@ -617,12 +617,13 @@ export const actionPostsFeed = (myFollowing, skip) =>
 
 export const actionFullAllGetPosts = () => async (dispatch, getState) => {
   const {
-    feed: { postsFeed = [],
+    feed: {postsFeed,
       postsFeedCount
     },
     profileData: {
       aboutMe
-    }
+    },
+    promise
   } = getState()
   const myFollowing =aboutMe?.following&& aboutMe?.following?.map(
     ({ _id }) => _id,
@@ -632,20 +633,47 @@ export const actionFullAllGetPosts = () => async (dispatch, getState) => {
   console.log('myId ', myId)
   
   const skip = postsFeed?.length
-  console.log('skip ', skip)
-  console.log('postsFeedCount ', postsFeedCount)
+  // console.log('skip ', skip)
+  console.log('postsFeed', postsFeed)
+  // if(postsFeed?.status=='PENDING')
+  // await dispatch(actionClearPromiseForName('postsFeed'))
   
-  console.log('result ', skip !==postsFeedCount && skip<postsFeedCount)
   if (skip !==(postsFeedCount ? postsFeedCount:1)) {
       
+    // const newPostsFeedCount = await dispatch(actionPostsFeedCount([...myFollowing || [], myId]))
+   
+    // if(postsFeed) 
+    const newPosts = await dispatch(actionPostsFeed([...myFollowing || [], myId],skip))
+  console.log('newPosts', newPosts)
+   
     const newPostsFeedCount = await dispatch(actionPostsFeedCount([...myFollowing || [], myId]))
-    const newPostsFeed = await dispatch(actionPostsFeed([...myFollowing || [], myId], skip))
-    if (newPostsFeedCount && newPostsFeed) {
-      await dispatch(actionFeedTypeCount(newPostsFeedCount))
-      await dispatch(actionFeedType(newPostsFeed))
-    }
+ 
+   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))
   }
+
+  console.log('newPosts', newPosts)
+
+    // if (newPosts) {
+    //   // await dispatch(actionFeedTypeCount(newPostsFeedCount))
+    //   await dispatch(actionFeedType(newPosts))
+     
+    
+    }
 }
+  // }
+// }
 
 // export const actionFullAllGetPosts = () => async (dispatch, getState) => {
    

+ 4 - 3
src/components/PostFeed.js

@@ -39,17 +39,17 @@ const MyPostFeed = ({
   onClearFeed
 }) => {
   const [checkScroll, setScroll] = useState(true)
-  console.log('my_Id?.following?.length ',profileData.following?.length)
   useEffect(() => {
-    if (checkScroll && profileData.following?.length!=0 ) {
+    if (checkScroll && profileData.following?.length ) {
       onPostsFeed()
       setScroll(false)
     }
-  }, [checkScroll,profileData.following])
+  }, [checkScroll])
 
   useEffect(() => {
     
     document.addEventListener('scroll', scrollHandler)
+
     return () => {
       document.removeEventListener('scroll', scrollHandler)
     onClearFeed()
@@ -59,6 +59,7 @@ const MyPostFeed = ({
   const scrollHandler = (e) => {
     if (e.target.documentElement.scrollHeight - (e.target.documentElement.scrollTop + window.innerHeight) < 200) {
       setScroll(true)
+      
     }
   }
 

+ 4 - 3
src/reducers/index.js

@@ -61,14 +61,15 @@ export const profileUserReducer = (
 
 export const feedReducer = (
   state = {},
-  { skip, type, newPosts = [], postId, postsFeed, postsFeedCount, newResult },
+  { skip, type, newPosts = [], postId, postsFeed, postsFeedCount,newPostsFeedCount, newResult },
 ) => {
   const types = {
     'ADD-POSTS': () => {
       return {
         ...state,
-        postsFeed: [...postsFeed || [], ...newPosts],
-        postsFeedCount: postsFeedCount ? postsFeedCount : state.postsFeedCount
+        postsFeed: state?.postsFeed ? [...state.postsFeed, ...newPosts] : [...newPosts],
+        // postsFeed: [...postsFeed || [], ...newPosts],
+        postsFeedCount: postsFeedCount ? postsFeedCount : newPostsFeedCount
             
        // postsFeed: postsFeed ? [...postsFeed, ...newPosts] : [...newPosts],
       }