Desktop: save home tab nav state when navigating to another tab

packages/app/navigation/desktop/TopLevelDrawer.tsx

@@ -2,6 +2,7 @@ import {
   DrawerContentComponentProps,
   createDrawerNavigator,
 } from '@react-navigation/drawer';
+import { DrawerNavigationState } from '@react-navigation/native';
 import * as store from '@tloncorp/shared/store';
 import {
   AvatarNavIcon,
@@ -11,6 +12,7 @@ import {
   YStack,
   useWebAppUpdate,
 } from '@tloncorp/ui';
+import { useCallback, useRef } from 'react';
 import { getVariableValue, useTheme } from 'tamagui';
 
 import { ActivityScreen } from '../../features/top/ActivityScreen';
@@ -26,12 +28,40 @@ const DrawerContent = (props: DrawerContentComponentProps) => {
   const userId = useCurrentUserId();
   const haveUnreadUnseenActivity = store.useHaveUnreadUnseenActivity();
   const { webAppNeedsUpdate, triggerWebAppUpdate } = useWebAppUpdate();
-  const isRouteActive = (routeName: string) => {
-    return (
-      props.state.index ===
-      props.state.routes.findIndex((r) => r.name === routeName)
-    );
-  };
+  const lastHomeStateRef =
+    useRef<DrawerNavigationState<RootDrawerParamList> | null>(null);
+
+  const isRouteActive = useCallback(
+    (routeName: keyof RootDrawerParamList) => {
+      return (
+        props.state.index ===
+        props.state.routes.findIndex((r) => r.name === routeName)
+      );
+    },
+    [props.state]
+  );
+
+  const saveHomeState = useCallback(() => {
+    if (isRouteActive('Home')) {
+      lastHomeStateRef.current =
+        props.state as DrawerNavigationState<RootDrawerParamList>;
+    }
+  }, [props.state, isRouteActive]);
+
+  const restoreHomeState = useCallback(() => {
+    try {
+      if (lastHomeStateRef.current) {
+        props.navigation.reset(lastHomeStateRef.current);
+      } else {
+        // Default state if no saved state exists
+        props.navigation.reset({ index: 0, routes: [{ name: 'Home' }] });
+      }
+    } catch (error) {
+      console.error('Error restoring Home navigation state:', error);
+      // Fallback to default state if restoration fails
+      props.navigation.reset({ index: 0, routes: [{ name: 'Home' }] });
+    }
+  }, [props.navigation]);
 
   return (
     <YStack gap="$l">
@@ -42,25 +72,25 @@ const DrawerContent = (props: DrawerContentComponentProps) => {
         // hasUnreads={(unreadCount?.channels ?? 0) > 0}
         // intentionally leave undotted for now
         hasUnreads={false}
-        onPress={() =>
-          props.navigation.reset({ index: 0, routes: [{ name: 'Home' }] })
-        }
+        onPress={restoreHomeState}
       />
       <NavIcon
         type="Notifications"
         activeType="NotificationsFilled"
         hasUnreads={haveUnreadUnseenActivity}
         isActive={isRouteActive('Activity')}
-        onPress={() =>
-          props.navigation.reset({ index: 0, routes: [{ name: 'Activity' }] })
-        }
+        onPress={() => {
+          saveHomeState();
+          props.navigation.reset({ index: 0, routes: [{ name: 'Activity' }] });
+        }}
       />
       <AvatarNavIcon
         id={userId}
         focused={isRouteActive('Contacts')}
-        onPress={() =>
-          props.navigation.reset({ index: 0, routes: [{ name: 'Contacts' }] })
-        }
+        onPress={() => {
+          saveHomeState();
+          props.navigation.reset({ index: 0, routes: [{ name: 'Contacts' }] });
+        }}
       />
       {webAppNeedsUpdate && (
         <NavIcon