Fixed #442

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

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

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

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>

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