maintaining feedposts cache separate to avoid data inconsistencies

I have also placed a basic structure to cache each feedScreen tab, will enable in next iteration after fixing the upvote updater issue
This commit is contained in:
Nouman Tahir 2021-03-03 14:34:26 +05:00
parent 63f1c04633
commit 88b40d7d20
8 changed files with 60 additions and 6 deletions

View File

@ -18,7 +18,7 @@ import { getPromotePosts } from '../../../providers/ecency/ecency';
import PostsView from '../view/postsView';
// Actions
import { setFeedPosts } from '../../../redux/actions/postsAction';
import { setFeedPosts, filterSelected, setOtherPosts } from '../../../redux/actions/postsAction';
import { hidePostsThumbnails } from '../../../redux/actions/uiAction';
import { fetchLeaderboard, followUser, unfollowUser } from '../../../redux/actions/userAction';
import {
@ -42,6 +42,7 @@ const PostsContainer = ({
feedUsername,
feedSubfilterOptions,
feedSubfilterOptionsValue,
isFeedScreen = false,
}) => {
const dispatch = useDispatch();
const intl = useIntl();
@ -81,9 +82,21 @@ const PostsContainer = ({
const elem = useRef(null);
const isMountedRef = useIsMountedRef();
useEffect(() => {
if(isFeedScreen){
dispatch(filterSelected(selectedFilterValue !== 'feed'
? selectedFilterValue
: selectedFeedSubfilterValue))
}else{
_setFeedPosts([])
}
}, [])
useEffect(() => {
if (isConnected) {
_loadPosts();
_getPromotePosts();
}
@ -206,7 +219,12 @@ const PostsContainer = ({
const _setFeedPosts = (_posts) => {
setPosts(_posts);
dispatch(setFeedPosts(_posts));
if(isFeedScreen){
dispatch(setFeedPosts(_posts));
}else{
dispatch(setOtherPosts(_posts));
}
};
const _handleImagesHide = () => {
@ -382,6 +400,16 @@ const PostsContainer = ({
setIsNoPost(false);
};
const _setSelectedFilterValue = (val) => {
dispatch(filterSelected(val))
setSelectedFilterValue(val)
}
const _setSelectedFeedSubfilterValue = (val) => {
dispatch(filterSelected(val))
setSelectedFeedSubfilterValue(val)
}
const _getRecommendedUsers = () => dispatch(fetchLeaderboard());
const _formatRecommendedUsers = (usersArray) => {
@ -488,7 +516,7 @@ const PostsContainer = ({
isNoPost={isNoPost}
promotedPosts={promotedPosts}
selectedFilterValue={selectedFilterValue}
setSelectedFilterValue={setSelectedFilterValue}
setSelectedFilterValue={_setSelectedFilterValue}
handleFilterOnDropdownSelect={_handleFilterOnDropdownSelect}
loadPosts={_loadPosts}
handleOnRefreshPosts={_handleOnRefreshPosts}
@ -496,7 +524,7 @@ const PostsContainer = ({
selectedFeedSubfilterIndex={selectedFeedSubfilterIndex}
feedSubfilterOptionsValue={feedSubfilterOptionsValue}
handleFeedSubfilterOnDropdownSelect={_handleFeedSubfilterOnDropdownSelect}
setSelectedFeedSubfilterValue={setSelectedFeedSubfilterValue}
setSelectedFeedSubfilterValue={_setSelectedFeedSubfilterValue}
selectedFeedSubfilterValue={selectedFeedSubfilterValue}
getRecommendedUsers={_getRecommendedUsers}
getRecommendedCommunities={_getRecommendedCommunities}
@ -506,6 +534,7 @@ const PostsContainer = ({
handleSubscribeCommunityButtonPress={_handleSubscribeCommunityButtonPress}
followingUsers={followingUsers}
subscribingCommunities={subscribingCommunities}
isFeedScreen={isFeedScreen}
/>
);
};

View File

@ -59,6 +59,7 @@ const PostsView = ({
handleSubscribeCommunityButtonPress,
followingUsers,
subscribingCommunities,
isFeedScreen,
}) => {
const intl = useIntl();
const postsList = useRef(null);
@ -340,6 +341,7 @@ const PostsView = ({
colors={['#fff']}
/>
}
isFeedScreen={isFeedScreen}
/>
{/* <FlatList

View File

@ -1,4 +1,4 @@
import React, {forwardRef, memo, useRef, useImperativeHandle} from 'react'
import React, {forwardRef, memo, useRef, useImperativeHandle, useState, useEffect} from 'react'
import PostCard from '../../postCard';
import { get } from 'lodash';
import { FlatListProps, FlatList } from 'react-native';
@ -7,16 +7,22 @@ import { useSelector } from 'react-redux';
interface postsListContainerProps extends FlatListProps<any> {
promotedPosts:Array<any>;
isFeedScreen:boolean;
}
const postsListContainer = ({
promotedPosts,
isFeedScreen,
...props
}:postsListContainerProps, ref) => {
const flatListRef = useRef(null);
const isHideImages = useSelector((state) => state.ui.hidePostsThumbnails);
const posts = useSelector((state) => state.posts.feedPosts);
const posts = useSelector((state) => {
return isFeedScreen
? state.posts.feedPosts
: state.posts.otherPosts
});
useImperativeHandle(ref, () => ({
scrollToTop() {

View File

@ -202,6 +202,7 @@ class ProfileView extends PureComponent {
handleOnScroll={isSummaryOpen ? this._handleOnScroll : null}
forceLoadPost={forceLoadPost}
changeForceLoadPostState={changeForceLoadPostState}
isFeedScreen={false}
/>
</View>

View File

@ -1,5 +1,6 @@
import {
SET_FEED_POSTS,
SET_OTHER_POSTS,
FETCH_POSTS,
FETCH_POSTS_SUCCESS,
RESET,
@ -10,6 +11,10 @@ export const setFeedPosts = (payload) => ({
payload,
type: SET_FEED_POSTS,
});
export const setOtherPosts = (payload) => ({
payload,
type: SET_OTHER_POSTS,
});
export const fetchPosts = (payload) => ({
payload,
type: FETCH_POSTS,

View File

@ -55,6 +55,7 @@ export const TOGGLE_ACCOUNTS_BOTTOM_SHEET = 'TOGGLE_ACCOUNTS_BOTTOM_SHEET';
// POSTS
export const SET_FEED_POSTS = 'SET_FEED_POSTS';
export const SET_OTHER_POSTS = 'SET_OTHER_POSTS';
export const FILTER_SELECTED = 'FILTER_SELECTED';
export const FETCH_POSTS = 'FETCH_POSTS';
export const FETCH_POSTS_SUCCESS = 'FETCH_POSTS_SUCCESS';

View File

@ -1,5 +1,6 @@
import {
SET_FEED_POSTS,
SET_OTHER_POSTS,
FILTER_SELECTED,
FETCH_POSTS,
FETCH_POSTS_SUCCESS,
@ -8,6 +9,7 @@ import {
const initialState = {
feedPosts: [],
otherPosts: [],
posts: [],
loading: false,
selectedFilterValue: '',
@ -21,6 +23,12 @@ export default function (state = initialState, action) {
feedPosts: action.payload,
posts: action.payload,
};
case SET_OTHER_POSTS:
return {
...state,
otherPosts: action.payload,
posts: action.payload,
};
case FILTER_SELECTED: {
return {
...state,

View File

@ -19,6 +19,7 @@ import {
} from '../../../constants/options/filters';
const FeedScreen = () => {
return (
<AccountContainer>
{({ currentAccount }) => (
@ -33,6 +34,7 @@ const FeedScreen = () => {
getFor={get(currentAccount, 'name', null) ? 'feed' : 'hot'}
selectedOptionIndex={get(currentAccount, 'name', null) ? 0 : 2}
feedUsername={get(currentAccount, 'name', null)}
isFeedScreen={true}
/>
</SafeAreaView>
</Fragment>