From b196d87cb1a1087b28acebe8d3bbdfcaa6e71976 Mon Sep 17 00:00:00 2001
From: xmflsct <me@xmflsct.com>
Date: Mon, 14 Nov 2022 15:54:51 +0100
Subject: [PATCH] Fixed #442

---
 src/screens/Tabs/Local.tsx          |  3 +++
 src/screens/Tabs/Notifications.tsx  |  7 ++++---
 src/screens/Tabs/Public.tsx         | 32 ++++++++---------------------
 src/utils/navigation/navigators.ts  |  1 -
 src/utils/navigation/usePopToTop.ts | 17 +++++++++++++++
 5 files changed, 33 insertions(+), 27 deletions(-)
 create mode 100644 src/utils/navigation/usePopToTop.ts

diff --git a/src/screens/Tabs/Local.tsx b/src/screens/Tabs/Local.tsx
index c20e9270..acc03b1a 100644
--- a/src/screens/Tabs/Local.tsx
+++ b/src/screens/Tabs/Local.tsx
@@ -4,6 +4,7 @@ import Timeline from '@components/Timeline'
 import TimelineDefault from '@components/Timeline/Default'
 import { createNativeStackNavigator } from '@react-navigation/native-stack'
 import { ScreenTabsScreenProps, TabLocalStackParamList } from '@utils/navigation/navigators'
+import usePopToTop from '@utils/navigation/usePopToTop'
 import { useListsQuery } from '@utils/queryHooks/lists'
 import { QueryKeyTimeline } from '@utils/queryHooks/timeline'
 import layoutAnimation from '@utils/styles/layoutAnimation'
@@ -26,6 +27,8 @@ const TabLocal = React.memo(
 
     const [queryKey, setQueryKey] = useState<QueryKeyTimeline>(['Timeline', { page: 'Following' }])
 
+    usePopToTop()
+
     return (
       <Stack.Navigator screenOptions={{ headerShadowVisible: false }}>
         <Stack.Screen
diff --git a/src/screens/Tabs/Notifications.tsx b/src/screens/Tabs/Notifications.tsx
index 32b8f0c2..da04b603 100644
--- a/src/screens/Tabs/Notifications.tsx
+++ b/src/screens/Tabs/Notifications.tsx
@@ -5,6 +5,7 @@ import TimelineNotifications from '@components/Timeline/Notifications'
 import navigationRef from '@helpers/navigationRef'
 import { createNativeStackNavigator } from '@react-navigation/native-stack'
 import { TabNotificationsStackParamList } from '@utils/navigation/navigators'
+import usePopToTop from '@utils/navigation/usePopToTop'
 import { QueryKeyTimeline } from '@utils/queryHooks/timeline'
 import React, { useCallback, useMemo } from 'react'
 import { useTranslation } from 'react-i18next'
@@ -21,9 +22,7 @@ const TabNotifications = React.memo(
       () => ({
         title: t('tabs.notifications.name'),
         ...(Platform.OS === 'android' && {
-          headerCenter: () => (
-            <HeaderCenter content={t('tabs.notifications.name')} />
-          )
+          headerCenter: () => <HeaderCenter content={t('tabs.notifications.name')} />
         }),
         headerRight: () => (
           <HeaderRight
@@ -57,6 +56,8 @@ const TabNotifications = React.memo(
       []
     )
 
+    usePopToTop()
+
     return (
       <Stack.Navigator screenOptions={{ headerShadowVisible: false }}>
         <Stack.Screen
diff --git a/src/screens/Tabs/Public.tsx b/src/screens/Tabs/Public.tsx
index c8b77940..8c4a7bf7 100644
--- a/src/screens/Tabs/Public.tsx
+++ b/src/screens/Tabs/Public.tsx
@@ -4,15 +4,13 @@ import Timeline from '@components/Timeline'
 import TimelineDefault from '@components/Timeline/Default'
 import SegmentedControl from '@react-native-community/segmented-control'
 import { createNativeStackNavigator } from '@react-navigation/native-stack'
-import {
-  ScreenTabsScreenProps,
-  TabPublicStackParamList
-} from '@utils/navigation/navigators'
+import { ScreenTabsScreenProps, TabPublicStackParamList } from '@utils/navigation/navigators'
+import usePopToTop from '@utils/navigation/usePopToTop'
 import { QueryKeyTimeline } from '@utils/queryHooks/timeline'
 import { useTheme } from '@utils/styles/ThemeManager'
 import React, { useCallback, useMemo, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import { Dimensions, StyleSheet, View } from 'react-native'
+import { Dimensions } from 'react-native'
 import { TabView } from 'react-native-tab-view'
 import TabSharedRoot from './Shared/Root'
 
@@ -44,10 +42,8 @@ const TabPublic = React.memo(
             appearance={mode}
             values={pages.map(p => p.title)}
             selectedIndex={segment}
-            onChange={({ nativeEvent }) =>
-              setSegment(nativeEvent.selectedSegmentIndex)
-            }
-            style={styles.segmentsContainer}
+            onChange={({ nativeEvent }) => setSegment(nativeEvent.selectedSegmentIndex)}
+            style={{ flexBasis: '65%' }}
           />
         ),
         headerRight: () => (
@@ -84,9 +80,7 @@ const TabPublic = React.memo(
             queryKey={queryKey}
             lookback={page}
             customProps={{
-              renderItem: ({ item }: any) => (
-                <TimelineDefault item={item} queryKey={queryKey} />
-              )
+              renderItem: ({ item }: any) => <TimelineDefault item={item} queryKey={queryKey} />
             }}
           />
         )
@@ -108,13 +102,11 @@ const TabPublic = React.memo(
       [segment]
     )
 
+    usePopToTop()
+
     return (
       <Stack.Navigator screenOptions={{ headerShadowVisible: false }}>
-        <Stack.Screen
-          name='Tab-Public-Root'
-          options={screenOptionsRoot}
-          children={children}
-        />
+        <Stack.Screen name='Tab-Public-Root' options={screenOptionsRoot} children={children} />
         {TabSharedRoot({ Stack })}
       </Stack.Navigator>
     )
@@ -122,10 +114,4 @@ const TabPublic = React.memo(
   () => true
 )
 
-const styles = StyleSheet.create({
-  segmentsContainer: {
-    flexBasis: '65%'
-  }
-})
-
 export default TabPublic
diff --git a/src/utils/navigation/navigators.ts b/src/utils/navigation/navigators.ts
index a6a28d9f..ba77c50e 100644
--- a/src/utils/navigation/navigators.ts
+++ b/src/utils/navigation/navigators.ts
@@ -3,7 +3,6 @@ import { NavigatorScreenParams } from '@react-navigation/native'
 import { NativeStackScreenProps } from '@react-navigation/native-stack'
 import { StackNavigationProp } from '@react-navigation/stack'
 import { QueryKeyTimeline } from '@utils/queryHooks/timeline'
-import React from 'react'
 
 export type RootStackParamList = {
   'Screen-Tabs': NavigatorScreenParams<ScreenTabsStackParamList>
diff --git a/src/utils/navigation/usePopToTop.ts b/src/utils/navigation/usePopToTop.ts
new file mode 100644
index 00000000..71d8c74e
--- /dev/null
+++ b/src/utils/navigation/usePopToTop.ts
@@ -0,0 +1,17 @@
+import { StackActions, useNavigation } from '@react-navigation/native'
+import { getInstanceActive } from '@utils/slices/instancesSlice'
+import { useEffect } from 'react'
+import { useSelector } from 'react-redux'
+
+// Mostly used when switching account and sub pages were still querying the old instance
+
+const usePopToTop = () => {
+  const navigation = useNavigation()
+  const instanceActive = useSelector(getInstanceActive)
+
+  return useEffect(() => {
+    navigation.dispatch(StackActions.popToTop())
+  }, [instanceActive])
+}
+
+export default usePopToTop