From b14191604f610d04aafe34315410e790e305bec1 Mon Sep 17 00:00:00 2001
From: Nouman Tahir <nouman.hawkdev@gmail.com>
Date: Sat, 10 Apr 2021 00:34:06 +0500
Subject: [PATCH] implemented filter tap to scroll top

---
 .../tabbedPosts/container/tabbedPosts.tsx     | 19 +++++++++-----
 .../tabbedPosts/services/tabbedPostsModels.ts |  3 ++-
 .../tabbedPosts/view/tabContent.tsx           | 25 +++++++++++--------
 3 files changed, 29 insertions(+), 18 deletions(-)

diff --git a/src/components/tabbedPosts/container/tabbedPosts.tsx b/src/components/tabbedPosts/container/tabbedPosts.tsx
index ea55258b0..abacbb566 100644
--- a/src/components/tabbedPosts/container/tabbedPosts.tsx
+++ b/src/components/tabbedPosts/container/tabbedPosts.tsx
@@ -51,7 +51,7 @@ export const TabbedPosts = ({
   const [combinedFilters] = useState([...mainFilters, ...subFilters]);
   // const [sessionUser, setSessionUser] = useState(username);
   const [selectedFilter, setSelectedFilter] = useState(combinedFilters[initialTabIndex].filterKey)
-
+  const [filterScrollRequest, setFilterScrollRequest] = useState<string|null>(null)
 
   // //sideEffects
   // useEffect(() => {
@@ -68,18 +68,23 @@ export const TabbedPosts = ({
 
     //components actions
     const _onFilterSelect = (filter:string) => {
-      if(filter !== selectedFilter){
-        // _getPromotedPosts()
-      } else {
-        //scroll tab to top
+      if(filter === selectedFilter){
+        //scroll filter to top
+        setFilterScrollRequest(selectedFilter) 
+      }else{
+        setSelectedFilter(filter)
       }
-      setSelectedFilter(filter)
+     
     }
 
     const _toggleHideImagesFlag = () => {
       dispatch(hidePostsThumbnails(!isHideImages));
     }
 
+    const _onScrollRequestProcessed = () => {
+      setFilterScrollRequest(null);
+    }
+
     // const _getPromotedPosts = async () => {
     //   if(pageType === 'profiles'){
     //     return;
@@ -101,6 +106,8 @@ export const TabbedPosts = ({
       isFeedScreen={isFeedScreen}
       feedUsername={feedUsername}
       pageType={pageType}
+      filterScrollRequest={filterScrollRequest}
+      onScrollRequestProcessed={_onScrollRequestProcessed}
       {...props}
     />
   ))
diff --git a/src/components/tabbedPosts/services/tabbedPostsModels.ts b/src/components/tabbedPosts/services/tabbedPostsModels.ts
index 51abd0173..992226993 100644
--- a/src/components/tabbedPosts/services/tabbedPostsModels.ts
+++ b/src/components/tabbedPosts/services/tabbedPostsModels.ts
@@ -50,5 +50,6 @@ export interface TabMeta {
     feedUsername:string,
     tag:string,
     forceLoadPosts:boolean,
-    // promotedPosts:any[],
+    filterScrollRequest:string,
+    onScrollRequestProcessed:()=>void
   }
\ No newline at end of file
diff --git a/src/components/tabbedPosts/view/tabContent.tsx b/src/components/tabbedPosts/view/tabContent.tsx
index 1adfbe745..3d853d1a5 100644
--- a/src/components/tabbedPosts/view/tabContent.tsx
+++ b/src/components/tabbedPosts/view/tabContent.tsx
@@ -1,4 +1,4 @@
-import React, {useState, useEffect, useRef, useImperativeHandle, forwardRef} from 'react';
+import React, {useState, useEffect, useRef} from 'react';
 import PostsList from '../../postsList';
 import { getPromotedPosts, loadPosts } from '../services/tabbedPostsFetch';
 import { LoadPostsOptions, TabContentProps, TabMeta } from '../services/tabbedPostsModels';
@@ -8,7 +8,6 @@ import { setInitPosts } from '../../../redux/actions/postsAction';
 import NewPostsPopup from './newPostsPopup';
 import { calculateTimeLeftForPostCheck } from '../services/tabbedPostsReducer';
 import { AppState } from 'react-native';
-import { filter } from 'core-js/core/array';
 
 
 const TabContent = ({
@@ -16,9 +15,10 @@ const TabContent = ({
   isFeedScreen,
   pageType,
   forceLoadPosts,
-
+  filterScrollRequest,
+  onScrollRequestProcessed,
   ...props
-}: TabContentProps, ref) => {
+}: TabContentProps) => {
   let _postFetchTimer = null;
   let _isMounted = true;
 
@@ -55,12 +55,6 @@ const TabContent = ({
   const postsRef = useRef(posts);
   postsRef.current = posts;
 
-  useImperativeHandle(ref ,() => ({
-      scrollToTop:()=>{
-        _scrollToTop();
-      }
-    }));
-
   //side effects
   useEffect(() => {
     
@@ -83,6 +77,15 @@ const TabContent = ({
     }
   }, [username, forceLoadPosts])
 
+  useEffect(() => {
+    if(filterScrollRequest && filterScrollRequest === filterKey){
+      _scrollToTop();
+      if(onScrollRequestProcessed){
+        onScrollRequestProcessed();
+      }
+    }
+  }, [filterScrollRequest])
+
 
   const _cleanup = () => {
     _isMounted = false;
@@ -260,6 +263,6 @@ const TabContent = ({
   );
 };
 
-export default forwardRef(TabContent);
+export default TabContent;