fix: wrap reset and resetRoot inside transaction

packages/core/src/NavigationContainer.tsx

@@ -112,11 +112,53 @@ const Container = React.forwardRef(function NavigationContainer(
   const isFirstMountRef = React.useRef<boolean>(true);
   const skipTrackingRef = React.useRef<boolean>(false);
 
-  const reset = React.useCallback((state: NavigationState) => {
-    skipTrackingRef.current = true;
-    setNavigationState(state);
+  const performTransaction = React.useCallback((callback: () => void) => {
+    if (isTransactionActiveRef.current) {
+      throw new Error(
+        "Only one transaction can be active at a time. Did you accidentally nest 'performTransaction'?"
+      );
+    }
+
+    setNavigationState((navigationState: State) => {
+      isTransactionActiveRef.current = true;
+      transactionStateRef.current = navigationState;
+
+      callback();
+
+      isTransactionActiveRef.current = false;
+
+      return transactionStateRef.current;
+    });
+  }, []);
+
+  const getState = React.useCallback(
+    () =>
+      transactionStateRef.current !== null
+        ? transactionStateRef.current
+        : navigationStateRef.current,
+    []
+  );
+
+  const setState = React.useCallback((navigationState: State) => {
+    if (transactionStateRef.current === null) {
+      throw new Error(
+        "Any 'setState' calls need to be done inside 'performTransaction'"
+      );
+    }
+
+    transactionStateRef.current = navigationState;
   }, []);
 
+  const reset = React.useCallback(
+    (state: NavigationState) => {
+      performTransaction(() => {
+        skipTrackingRef.current = true;
+        setState(state);
+      });
+    },
+    [performTransaction, setState]
+  );
+
   const { trackState, trackAction } = useDevTools({
     name: '@react-navigation',
     reset,
@@ -147,10 +189,12 @@ const Container = React.forwardRef(function NavigationContainer(
 
   const resetRoot = React.useCallback(
     (state?: PartialState<NavigationState> | NavigationState) => {
-      trackAction('@@RESET_ROOT');
-      setNavigationState(state);
+      performTransaction(() => {
+        trackAction('@@RESET_ROOT');
+        setState(state);
+      });
     },
-    [trackAction]
+    [performTransaction, setState, trackAction]
   );
 
   const getRootState = React.useCallback(() => {
@@ -185,43 +229,6 @@ const Container = React.forwardRef(function NavigationContainer(
     [addFocusedListener, trackAction, addStateGetter]
   );
 
-  const performTransaction = React.useCallback((callback: () => void) => {
-    if (isTransactionActiveRef.current) {
-      throw new Error(
-        "Only one transaction can be active at a time. Did you accidentally nest 'performTransaction'?"
-      );
-    }
-
-    setNavigationState((navigationState: State) => {
-      isTransactionActiveRef.current = true;
-      transactionStateRef.current = navigationState;
-
-      callback();
-
-      isTransactionActiveRef.current = false;
-
-      return transactionStateRef.current;
-    });
-  }, []);
-
-  const getState = React.useCallback(
-    () =>
-      transactionStateRef.current !== null
-        ? transactionStateRef.current
-        : navigationStateRef.current,
-    []
-  );
-
-  const setState = React.useCallback((navigationState: State) => {
-    if (transactionStateRef.current === null) {
-      throw new Error(
-        "Any 'setState' calls need to be done inside 'performTransaction'"
-      );
-    }
-
-    transactionStateRef.current = navigationState;
-  }, []);
-
   const context = React.useMemo(
     () => ({
       state,