diff --git a/src/components/views/All.jsx b/src/components/views/All.jsx index 26dc6d5d..4e72f2ae 100755 --- a/src/components/views/All.jsx +++ b/src/components/views/All.jsx @@ -48,6 +48,8 @@ const All = () => { const { defaultSubplebbits, editedComment, + feedCacheStates, + setFeedCacheState, isSettingsOpen, setIsSettingsOpen, setModeratingCommentCid, selectedAddress, @@ -108,20 +110,26 @@ const All = () => { const [isThumbnailClicked, setIsThumbnailClicked] = useState({}); const [isMobileThumbnailClicked, setIsMobileThumbnailClicked] = useState({}); - const setSelectedThreadCid = (cid) => { - selectedThreadCidRef.current = cid; - } + const setSelectedThreadCid = (cid) => { selectedThreadCidRef.current = cid }; + const isFeedCached = feedCacheStates['all']; useAnonModeRef(selectedThreadCidRef, anonymousMode && executeAnonMode); const addresses = defaultSubplebbits.map(subplebbit => subplebbit.address); - const { feed, hasMore, loadMore } = useFeed({subplebbitAddresses: addresses, sortType: 'active'}); + const { feed, loadMore } = useFeed({subplebbitAddresses: addresses, sortType: 'active'}); const {subplebbits} = useSubplebbits({subplebbitAddresses: addresses, sortType: 'active'}); const [selectedFeed, setSelectedFeed] = useState(feed.sort((a, b) => b.timestamp - a.timestamp)); const stateString = useFeedStateString(subplebbits); + useEffect(() => { + if (feed.length) { + setFeedCacheState('all', true); + } + }, [feed.length, setFeedCacheState]); + + const handleThumbnailClick = (index, isMobile=false) => { if (isMobile) { setIsMobileThumbnailClicked(prevState => ({ @@ -489,7 +497,7 @@ const All = () => { useEffect(() => { const setLastVirtuosoState = () => { virtuosoRef.current?.getState((snapshot) => { - if (snapshot?.ranges?.length) { + if (snapshot?.scrollTop === 0 || snapshot?.ranges?.length) { lastVirtuosoStates['all'] = snapshot; } }); @@ -2225,8 +2233,8 @@ const All = () => { initialScrollTop={lastVirtuosoState?.scrollTop} endReached={tryLoadMore} useWindowScroll={true} - components={{ Footer: hasMore && feed.length > 0 ? () => : null }} - /> + components={{Footer: () => {return isFeedCached ? null : }}} + /> ) : ( )} diff --git a/src/components/views/Board.jsx b/src/components/views/Board.jsx index 57f49116..f839bc5e 100755 --- a/src/components/views/Board.jsx +++ b/src/components/views/Board.jsx @@ -52,6 +52,8 @@ const Board = () => { setChallengesArray, defaultSubplebbits, editedComment, + feedCacheStates, + setFeedCacheState, setIsAuthorDelete, setIsAuthorEdit, setIsCaptchaOpen, @@ -106,7 +108,7 @@ const Board = () => { const selectedThreadCidRef = useRef(null); const virtuosoRef = useRef(); - const { feed, hasMore, loadMore } = useFeed({subplebbitAddresses: [`${selectedAddress}`], sortType: 'active'}); + const { feed, loadMore } = useFeed({subplebbitAddresses: [`${selectedAddress}`], sortType: 'active'}); const subplebbit = useSubplebbit({subplebbitAddress: selectedAddress}); const { subscribed, subscribe, unsubscribe } = useSubscribe({subplebbitAddress: selectedAddress}); const stateString = useStateString(subplebbit); @@ -134,11 +136,19 @@ const Board = () => { const [isThumbnailClicked, setIsThumbnailClicked] = useState({}); const [isMobileThumbnailClicked, setIsMobileThumbnailClicked] = useState({}); - const setSelectedThreadCid = (cid) => { selectedThreadCidRef.current = cid;} + const setSelectedThreadCid = (cid) => { selectedThreadCidRef.current = cid }; + const isFeedCached = feedCacheStates[selectedAddress]; useAnonModeRef(selectedThreadCidRef, anonymousMode && executeAnonMode); + useEffect(() => { + if (feed.length) { + setFeedCacheState(selectedAddress, true); + } + }, [selectedAddress, setFeedCacheState, feed.length]); + + useEffect(() => { if (subplebbit.roles !== undefined) { const role = subplebbit.roles[account?.author.address]?.role; @@ -653,7 +663,7 @@ const Board = () => { useEffect(() => { const setLastVirtuosoState = () => { virtuosoRef.current?.getState((snapshot) => { - if (snapshot?.ranges?.length) { + if (snapshot?.scrollTop === 0 || snapshot?.ranges?.length) { lastVirtuosoStates[selectedAddress] = snapshot; } }); @@ -662,6 +672,7 @@ const Board = () => { return () => window.removeEventListener('scroll', setLastVirtuosoState); }, [selectedAddress]); + const lastVirtuosoState = lastVirtuosoStates[selectedAddress]; @@ -2846,7 +2857,7 @@ const Board = () => { initialScrollTop={lastVirtuosoState?.scrollTop} endReached={tryLoadMore} useWindowScroll={true} - components={{ Footer: hasMore && feed.length > 0 ? () => : null }} + components={{Footer: () => {return isFeedCached ? null : }}} /> ) : () diff --git a/src/components/views/Subscriptions.jsx b/src/components/views/Subscriptions.jsx index f7cb8dea..1e705890 100755 --- a/src/components/views/Subscriptions.jsx +++ b/src/components/views/Subscriptions.jsx @@ -48,6 +48,8 @@ const Subscriptions = () => { const { defaultSubplebbits, editedComment, + feedCacheStates, + setFeedCacheState, isSettingsOpen, setIsSettingsOpen, setModeratingCommentCid, selectedAddress, @@ -108,19 +110,24 @@ const Subscriptions = () => { const [isThumbnailClicked, setIsThumbnailClicked] = useState({}); const [isMobileThumbnailClicked, setIsMobileThumbnailClicked] = useState({}); - const setSelectedThreadCid = (cid) => { - selectedThreadCidRef.current = cid; - } + const setSelectedThreadCid = (cid) => { selectedThreadCidRef.current = cid }; + const isFeedCached = feedCacheStates['subscriptions']; useAnonModeRef(selectedThreadCidRef, anonymousMode && executeAnonMode); - const { feed, hasMore, loadMore } = useFeed({subplebbitAddresses: account?.subscriptions, sortType: 'active'}); + const { feed, loadMore } = useFeed({subplebbitAddresses: account?.subscriptions, sortType: 'active'}); const [selectedFeed, setSelectedFeed] = useState(feed.sort((a, b) => b.timestamp - a.timestamp)); const {subplebbits} = useSubplebbits({subplebbitAddresses: account?.subscriptions, sortType: 'active'}); const stateString = useFeedStateString(subplebbits); + useEffect(() => { + if (feed.length) { + setFeedCacheState('subscriptions', true); + } + }, [feed.length, setFeedCacheState]); + const handleThumbnailClick = (index, isMobile=false) => { if (isMobile) { setIsMobileThumbnailClicked(prevState => ({ @@ -492,7 +499,7 @@ const Subscriptions = () => { useEffect(() => { const setLastVirtuosoState = () => { virtuosoRef.current?.getState((snapshot) => { - if (snapshot?.ranges?.length) { + if (snapshot?.scrollTop === 0 || snapshot?.ranges?.length) { lastVirtuosoStates['subscriptions'] = snapshot; } }); @@ -2236,7 +2243,7 @@ const Subscriptions = () => { initialScrollTop={lastVirtuosoState?.scrollTop} endReached={tryLoadMore} useWindowScroll={true} - components={{ Footer: hasMore && feed.length > 0 ? () => : null }} + components={{Footer: () => {return isFeedCached ? null : }}} /> )} diff --git a/src/hooks/stores/useGeneralStore.js b/src/hooks/stores/useGeneralStore.js index 42796fe6..789a112a 100644 --- a/src/hooks/stores/useGeneralStore.js +++ b/src/hooks/stores/useGeneralStore.js @@ -23,6 +23,14 @@ const useGeneralStore = create((set) => ({ editedComment: '', setEditedComment: (comment) => set({ editedComment: comment }), + feedCacheStates: {}, + setFeedCacheState: (address, isCached) => set((prev) => ({ + feedCacheStates: { + ...prev.feedCacheStates, + [address]: isCached, + } + })), + isAuthorDelete: false, setIsAuthorDelete: (isAuthorDelete) => set({ isAuthorDelete }),