From f97c1c34b7aaf808cc53edbe067332634eca708e Mon Sep 17 00:00:00 2001 From: osdnk Date: Wed, 27 Nov 2019 15:07:36 +0100 Subject: [PATCH 1/2] fix: wrap reset adn resetRoot inside transaction --- packages/core/src/NavigationContainer.tsx | 93 ++++++++++++----------- 1 file changed, 50 insertions(+), 43 deletions(-) diff --git a/packages/core/src/NavigationContainer.tsx b/packages/core/src/NavigationContainer.tsx index cfe63e53..f0499f8f 100644 --- a/packages/core/src/NavigationContainer.tsx +++ b/packages/core/src/NavigationContainer.tsx @@ -112,11 +112,53 @@ const Container = React.forwardRef(function NavigationContainer( const isFirstMountRef = React.useRef(true); const skipTrackingRef = React.useRef(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; + setNavigationState(state); + }); + }, + [performTransaction] + ); + 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) => { - 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, From 4a379e5f389b1ed122a4bb614d3b6e05ba838fbf Mon Sep 17 00:00:00 2001 From: osdnk Date: Wed, 27 Nov 2019 15:24:24 +0100 Subject: [PATCH 2/2] fix: setState --- packages/core/src/NavigationContainer.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/core/src/NavigationContainer.tsx b/packages/core/src/NavigationContainer.tsx index f0499f8f..c2ae074d 100644 --- a/packages/core/src/NavigationContainer.tsx +++ b/packages/core/src/NavigationContainer.tsx @@ -153,10 +153,10 @@ const Container = React.forwardRef(function NavigationContainer( (state: NavigationState) => { performTransaction(() => { skipTrackingRef.current = true; - setNavigationState(state); + setState(state); }); }, - [performTransaction] + [performTransaction, setState] ); const { trackState, trackAction } = useDevTools({