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

src/components/posts/container/postsContainer.js

@@ -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();
@@ -82,8 +83,20 @@ 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}
     />
   );
 };

src/components/posts/view/postsView.js

@@ -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

src/components/postsList/container/postsListContainer.tsx

@@ -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() {

src/components/profile/profileView.js

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

src/redux/actions/postsAction.js

@@ -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,

src/redux/constants/constants.js

@@ -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';

src/redux/reducers/postsReducer.js

@@ -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,

src/screens/feed/screen/feedScreen.js

@@ -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>