chore: publish

- @react-navigation/bottom-tabs@5.7.2
 - @react-navigation/compat@5.2.1
 - @react-navigation/core@5.12.1
 - @react-navigation/devtools@5.1.3
 - @react-navigation/drawer@5.8.6
 - @react-navigation/material-bottom-tabs@5.2.14
 - @react-navigation/material-top-tabs@5.2.14
 - @react-navigation/native@5.7.1
 - @react-navigation/stack@5.7.1

.github/workflows/expo-preview.yml

@@ -47,9 +47,21 @@ jobs:
         with:
           github-token: ${{secrets.GITHUB_TOKEN}}
           script: |
+            const body = 'The Expo app for the example from this branch is ready!\n\n[expo.io/${{ steps.expo.outputs.path }}](https://expo.io/${{ steps.expo.outputs.path }})\n\n<a href="https://exp.host/${{ steps.expo.outputs.path }}"><img src="https://api.qrserver.com/v1/create-qr-code/?size=400x400&data=exp://exp.host/${{ steps.expo.outputs.path }}" height="200px" width="200px"></a>';
+
+            const comments = await github.issues.listComments({
+              issue_number: context.issue.number,
+              owner: context.repo.owner,
+              repo: context.repo.repo,
+            });
+
+            if (comments.some(comment => comment.body === body)) {
+              return;
+            }
+
             github.issues.createComment({
               issue_number: context.issue.number,
               owner: context.repo.owner,
               repo: context.repo.repo,
-              body: 'The Expo app for the example from this branch is ready!\n\n[expo.io/${{ steps.expo.outputs.path }}](https://expo.io/${{ steps.expo.outputs.path }})\n\n<a href="https://exp.host/${{ steps.expo.outputs.path }}"><img src="https://api.qrserver.com/v1/create-qr-code/?size=400x400&data=exp://exp.host/${{ steps.expo.outputs.path }}" height="200px" width="200px"></a>'
+              body
             })

.github/workflows/versions.yml

@@ -1,7 +1,7 @@
 name: Check versions
 on:
   issues:
-    types: [opened]
+    types: [opened, edited]
 
 jobs:
   check-versions:

example/src/Screens/AuthFlow.tsx

@@ -147,6 +147,10 @@ export default function SimpleStackScreen({
     []
   );
 
+  if (state.isLoading) {
+    return <SplashScreen />;
+  }
+
   return (
     <AuthContext.Provider value={authContext}>
       <SimpleStack.Navigator
@@ -156,13 +160,7 @@ export default function SimpleStackScreen({
           ),
         }}
       >
-        {state.isLoading ? (
+        {state.userToken === undefined ? (
-          <SimpleStack.Screen
-            name="Splash"
-            component={SplashScreen}
-            options={{ title: 'Auth Flow' }}
-          />
-        ) : state.userToken === undefined ? (
           <SimpleStack.Screen
             name="SignIn"
             options={{

packages/bottom-tabs/CHANGELOG.md

@@ -3,6 +3,25 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [5.7.2](https://github.com/react-navigation/react-navigation/compare/@react-navigation/bottom-tabs@5.7.1...@react-navigation/bottom-tabs@5.7.2) (2020-07-19)
+
+**Note:** Version bump only for package @react-navigation/bottom-tabs
+
+
+
+
+
+## [5.7.1](https://github.com/react-navigation/react-navigation/compare/@react-navigation/bottom-tabs@5.7.0...@react-navigation/bottom-tabs@5.7.1) (2020-07-14)
+
+
+### Bug Fixes
+
+* don't render badge on bottom tabs if not visible. closes [#8577](https://github.com/react-navigation/react-navigation/issues/8577) ([2f74541](https://github.com/react-navigation/react-navigation/commit/2f74541811bac4d36e89c159cd1f4b267063e7f9))
+
+
+
+
+
 # [5.7.0](https://github.com/react-navigation/react-navigation/compare/@react-navigation/bottom-tabs@5.6.1...@react-navigation/bottom-tabs@5.7.0) (2020-07-10)
 
 

packages/bottom-tabs/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/bottom-tabs",
   "description": "Bottom tab navigator following iOS design guidelines",
-  "version": "5.7.0",
+  "version": "5.7.2",
   "keywords": [
     "react-native-component",
     "react-component",
@@ -41,7 +41,7 @@
   },
   "devDependencies": {
     "@react-native-community/bob": "^0.15.1",
-    "@react-navigation/native": "^5.7.0",
+    "@react-navigation/native": "^5.7.1",
     "@types/color": "^3.0.1",
     "@types/react": "^16.9.36",
     "@types/react-native": "^0.62.7",

packages/bottom-tabs/src/views/Badge.tsx

@@ -30,16 +30,33 @@ export default function Badge({
   ...rest
 }: Props) {
   const [opacity] = React.useState(() => new Animated.Value(visible ? 1 : 0));
+  const [rendered, setRendered] = React.useState(visible ? true : false);
 
   const theme = useTheme();
 
   React.useEffect(() => {
+    if (!rendered) {
+      return;
+    }
+
     Animated.timing(opacity, {
       toValue: visible ? 1 : 0,
       duration: 150,
       useNativeDriver: true,
-    }).start();
+    }).start(({ finished }) => {
-  }, [opacity, visible]);
+      if (finished && !visible) {
+        setRendered(false);
+      }
+    });
+  }, [opacity, rendered, visible]);
+
+  if (visible && !rendered) {
+    setRendered(true);
+  }
+
+  if (!visible && !rendered) {
+    return null;
+  }
 
   // @ts-expect-error: backgroundColor definitely exists
   const { backgroundColor = theme.colors.notification, ...restStyle } =
@@ -55,6 +72,14 @@ export default function Badge({
       style={[
         {
           opacity,
+          transform: [
+            {
+              scale: opacity.interpolate({
+                inputRange: [0, 1],
+                outputRange: [0.5, 1],
+              }),
+            },
+          ],
           backgroundColor,
           color: textColor,
           fontSize,

packages/compat/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [5.2.1](https://github.com/react-navigation/react-navigation/compare/@react-navigation/compat@5.2.0...@react-navigation/compat@5.2.1) (2020-07-19)
+
+**Note:** Version bump only for package @react-navigation/compat
+
+
+
+
+
 # [5.2.0](https://github.com/react-navigation/react-navigation/compare/@react-navigation/compat@5.1.28...@react-navigation/compat@5.2.0) (2020-07-10)
 
 

packages/compat/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/compat",
   "description": "Compatibility layer to write navigator definitions in static configuration format",
-  "version": "5.2.0",
+  "version": "5.2.1",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -32,7 +32,7 @@
   },
   "devDependencies": {
     "@react-native-community/bob": "^0.15.1",
-    "@react-navigation/native": "^5.7.0",
+    "@react-navigation/native": "^5.7.1",
     "@types/react": "^16.9.36",
     "react": "~16.9.0",
     "typescript": "^3.9.5"

packages/core/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [5.12.1](https://github.com/react-navigation/react-navigation/compare/@react-navigation/core@5.12.0...@react-navigation/core@5.12.1) (2020-07-19)
+
+
+### Bug Fixes
+
+* make sure new state events are emitted when new navigators mount ([af8b274](https://github.com/react-navigation/react-navigation/commit/af8b27414c8628570d946003f4fdff3341cb8954))
+
+
+
+
+
 # [5.12.0](https://github.com/react-navigation/react-navigation/compare/@react-navigation/core@5.11.1...@react-navigation/core@5.12.0) (2020-07-10)
 
 

packages/core/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/core",
   "description": "Core utilities for building navigators",
-  "version": "5.12.0",
+  "version": "5.12.1",
   "keywords": [
     "react",
     "react-native",

packages/core/src/BaseNavigationContainer.tsx

@@ -247,6 +247,10 @@ const BaseNavigationContainer = React.forwardRef(
       [scheduleUpdate, flushUpdates]
     );
 
+    const isInitialRef = React.useRef(true);
+
+    const getIsInitial = React.useCallback(() => isInitialRef.current, []);
+
     const context = React.useMemo(
       () => ({
         state,
@@ -254,14 +258,24 @@ const BaseNavigationContainer = React.forwardRef(
         setState,
         getKey,
         setKey,
+        getIsInitial,
         addOptionsGetter,
       }),
-      [getKey, getState, setKey, setState, state, addOptionsGetter]
+      [
+        state,
+        getState,
+        setState,
+        getKey,
+        setKey,
+        getIsInitial,
+        addOptionsGetter,
+      ]
     );
 
     const onStateChangeRef = React.useRef(onStateChange);
 
     React.useEffect(() => {
+      isInitialRef.current = false;
       onStateChangeRef.current = onStateChange;
     });
 

packages/core/src/NavigationStateContext.tsx

@@ -13,6 +13,7 @@ export default React.createContext<{
   setState: (
     state: NavigationState | PartialState<NavigationState> | undefined
   ) => void;
+  getIsInitial: () => boolean;
   addOptionsGetter?: (
     key: string,
     getter: () => object | undefined | null
@@ -32,4 +33,7 @@ export default React.createContext<{
   get setState(): any {
     throw new Error(MISSING_CONTEXT_ERROR);
   },
+  get getIsInitial(): any {
+    throw new Error(MISSING_CONTEXT_ERROR);
+  },
 });

packages/core/src/SceneView.tsx

@@ -76,6 +76,14 @@ export default function SceneView<
     [getState, route.key, setState]
   );
 
+  const isInitialRef = React.useRef(true);
+
+  React.useEffect(() => {
+    isInitialRef.current = false;
+  });
+
+  const getIsInitial = React.useCallback(() => isInitialRef.current, []);
+
   const context = React.useMemo(
     () => ({
       state: route.state,
@@ -83,14 +91,16 @@ export default function SceneView<
       setState: setCurrentState,
       getKey,
       setKey,
+      getIsInitial,
       addOptionsGetter,
     }),
     [
-      getCurrentState,
-      getKey,
       route.state,
+      getCurrentState,
       setCurrentState,
+      getKey,
       setKey,
+      getIsInitial,
       addOptionsGetter,
     ]
   );

packages/core/src/__tests__/BaseNavigationContainer.test.tsx

@@ -366,6 +366,7 @@ it('handles getRootState', () => {
     type: 'test',
   });
 });
+
 it('emits state events when the state changes', () => {
   const TestNavigator = (props: any) => {
     const { state, descriptors } = useNavigationBuilder(MockRouter, props);
@@ -401,6 +402,7 @@ it('emits state events when the state changes', () => {
     ref.current?.navigate('bar');
   });
 
+  expect(listener).toBeCalledTimes(1);
   expect(listener.mock.calls[0][0].data.state).toEqual({
     type: 'test',
     stale: false,
@@ -418,6 +420,7 @@ it('emits state events when the state changes', () => {
     ref.current?.navigate('baz', { answer: 42 });
   });
 
+  expect(listener).toBeCalledTimes(2);
   expect(listener.mock.calls[1][0].data.state).toEqual({
     type: 'test',
     stale: false,
@@ -432,6 +435,97 @@ it('emits state events when the state changes', () => {
   });
 });
 
+it('emits state events when new navigator mounts', () => {
+  jest.useFakeTimers();
+
+  const TestNavigator = (props: any) => {
+    const { state, descriptors } = useNavigationBuilder(MockRouter, props);
+
+    return (
+      <React.Fragment>
+        {state.routes.map((route) => descriptors[route.key].render())}
+      </React.Fragment>
+    );
+  };
+
+  const ref = React.createRef<NavigationContainerRef>();
+
+  const NestedNavigator = () => {
+    const [isRendered, setIsRendered] = React.useState(false);
+
+    React.useEffect(() => {
+      setTimeout(() => setIsRendered(true), 100);
+    }, []);
+
+    if (!isRendered) {
+      return null;
+    }
+
+    return (
+      <TestNavigator>
+        <Screen name="baz">{() => null}</Screen>
+        <Screen name="bax">{() => null}</Screen>
+      </TestNavigator>
+    );
+  };
+
+  const onStateChange = jest.fn();
+
+  const element = (
+    <BaseNavigationContainer ref={ref} onStateChange={onStateChange}>
+      <TestNavigator>
+        <Screen name="foo">{() => null}</Screen>
+        <Screen name="bar" component={NestedNavigator} />
+      </TestNavigator>
+    </BaseNavigationContainer>
+  );
+
+  render(element).update(element);
+
+  const listener = jest.fn();
+
+  ref.current?.addListener('state', listener);
+
+  expect(listener).not.toHaveBeenCalled();
+  expect(onStateChange).not.toHaveBeenCalled();
+
+  act(() => {
+    jest.runAllTimers();
+  });
+
+  const resultState = {
+    stale: false,
+    type: 'test',
+    index: 0,
+    key: '10',
+    routeNames: ['foo', 'bar'],
+    routes: [
+      { key: 'foo', name: 'foo' },
+      {
+        key: 'bar',
+        name: 'bar',
+        state: {
+          stale: false,
+          type: 'test',
+          index: 0,
+          key: '11',
+          routeNames: ['baz', 'bax'],
+          routes: [
+            { key: 'baz', name: 'baz' },
+            { key: 'bax', name: 'bax' },
+          ],
+        },
+      },
+    ],
+  };
+
+  expect(listener).toBeCalledTimes(1);
+  expect(listener.mock.calls[0][0].data.state).toEqual(resultState);
+
+  expect(onStateChange).toBeCalledTimes(1);
+  expect(onStateChange).lastCalledWith(resultState);
+});
+
 it('emits option events when options change with tab router', () => {
   const TestNavigator = (props: any) => {
     const { state, descriptors } = useNavigationBuilder(TabRouter, props);

packages/core/src/useNavigationBuilder.tsx

@@ -279,6 +279,7 @@ export default function useNavigationBuilder<
     setState,
     setKey,
     getKey,
+    getIsInitial,
   } = React.useContext(NavigationStateContext);
 
   const [initializedState, isFirstStateInitialization] = React.useMemo(() => {
@@ -372,6 +373,13 @@ export default function useNavigationBuilder<
   React.useEffect(() => {
     setKey(navigatorKey);
 
+    if (!getIsInitial()) {
+      // If it's not initial render, we need to update the state
+      // This will make sure that our container gets notifier of state changes due to new mounts
+      // This is necessary for proper screen tracking, URL updates etc.
+      setState(nextState);
+    }
+
     return () => {
       // We need to clean up state for this navigator on unmount
       // We do it in a timeout because we need to detect if another navigator mounted in the meantime

packages/devtools/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [5.1.3](https://github.com/react-navigation/react-navigation/compare/@react-navigation/devtools@5.1.2...@react-navigation/devtools@5.1.3) (2020-07-19)
+
+**Note:** Version bump only for package @react-navigation/devtools
+
+
+
+
+
 ## [5.1.2](https://github.com/react-navigation/react-navigation/compare/@react-navigation/devtools@5.1.1...@react-navigation/devtools@5.1.2) (2020-07-10)
 
 **Note:** Version bump only for package @react-navigation/devtools

packages/devtools/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/devtools",
   "description": "Developer tools for React Navigation",
-  "version": "5.1.2",
+  "version": "5.1.3",
   "keywords": [
     "react",
     "react-native",
@@ -36,7 +36,7 @@
     "clean": "del lib"
   },
   "dependencies": {
-    "@react-navigation/core": "^5.12.0",
+    "@react-navigation/core": "^5.12.1",
     "deep-equal": "^2.0.3"
   },
   "devDependencies": {

packages/drawer/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [5.8.6](https://github.com/react-navigation/react-navigation/compare/@react-navigation/drawer@5.8.5...@react-navigation/drawer@5.8.6) (2020-07-19)
+
+**Note:** Version bump only for package @react-navigation/drawer
+
+
+
+
+
 ## [5.8.5](https://github.com/react-navigation/react-navigation/compare/@react-navigation/drawer@5.8.4...@react-navigation/drawer@5.8.5) (2020-07-10)
 
 **Note:** Version bump only for package @react-navigation/drawer

packages/drawer/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/drawer",
   "description": "Drawer navigator component with animated transitions and gesturess",
-  "version": "5.8.5",
+  "version": "5.8.6",
   "keywords": [
     "react-native-component",
     "react-component",
@@ -46,7 +46,7 @@
   },
   "devDependencies": {
     "@react-native-community/bob": "^0.15.1",
-    "@react-navigation/native": "^5.7.0",
+    "@react-navigation/native": "^5.7.1",
     "@types/react": "^16.9.36",
     "@types/react-native": "^0.62.7",
     "del-cli": "^3.0.1",

packages/material-bottom-tabs/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [5.2.14](https://github.com/react-navigation/react-navigation/compare/@react-navigation/material-bottom-tabs@5.2.13...@react-navigation/material-bottom-tabs@5.2.14) (2020-07-19)
+
+**Note:** Version bump only for package @react-navigation/material-bottom-tabs
+
+
+
+
+
 ## [5.2.13](https://github.com/react-navigation/react-navigation/compare/@react-navigation/material-bottom-tabs@5.2.12...@react-navigation/material-bottom-tabs@5.2.13) (2020-07-10)
 
 **Note:** Version bump only for package @react-navigation/material-bottom-tabs

packages/material-bottom-tabs/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/material-bottom-tabs",
   "description": "Integration for bottom navigation component from react-native-paper",
-  "version": "5.2.13",
+  "version": "5.2.14",
   "keywords": [
     "react-native-component",
     "react-component",
@@ -42,7 +42,7 @@
   },
   "devDependencies": {
     "@react-native-community/bob": "^0.15.1",
-    "@react-navigation/native": "^5.7.0",
+    "@react-navigation/native": "^5.7.1",
     "@types/react": "^16.9.36",
     "@types/react-native": "^0.62.7",
     "@types/react-native-vector-icons": "^6.4.5",

packages/material-top-tabs/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [5.2.14](https://github.com/react-navigation/react-navigation/compare/@react-navigation/material-top-tabs@5.2.13...@react-navigation/material-top-tabs@5.2.14) (2020-07-19)
+
+**Note:** Version bump only for package @react-navigation/material-top-tabs
+
+
+
+
+
 ## [5.2.13](https://github.com/react-navigation/react-navigation/compare/@react-navigation/material-top-tabs@5.2.12...@react-navigation/material-top-tabs@5.2.13) (2020-07-10)
 
 **Note:** Version bump only for package @react-navigation/material-top-tabs

packages/material-top-tabs/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/material-top-tabs",
   "description": "Integration for the animated tab view component from react-native-tab-view",
-  "version": "5.2.13",
+  "version": "5.2.14",
   "keywords": [
     "react-native-component",
     "react-component",
@@ -45,7 +45,7 @@
   },
   "devDependencies": {
     "@react-native-community/bob": "^0.15.1",
-    "@react-navigation/native": "^5.7.0",
+    "@react-navigation/native": "^5.7.1",
     "@types/react": "^16.9.36",
     "@types/react-native": "^0.62.7",
     "del-cli": "^3.0.1",

packages/native/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [5.7.1](https://github.com/react-navigation/react-navigation/compare/@react-navigation/native@5.7.0...@react-navigation/native@5.7.1) (2020-07-19)
+
+**Note:** Version bump only for package @react-navigation/native
+
+
+
+
+
 # [5.7.0](https://github.com/react-navigation/react-navigation/compare/@react-navigation/native@5.6.1...@react-navigation/native@5.7.0) (2020-07-10)
 
 

packages/native/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/native",
   "description": "React Native integration for React Navigation",
-  "version": "5.7.0",
+  "version": "5.7.1",
   "keywords": [
     "react-native",
     "react-navigation",
@@ -37,7 +37,7 @@
     "clean": "del lib"
   },
   "dependencies": {
-    "@react-navigation/core": "^5.12.0",
+    "@react-navigation/core": "^5.12.1",
     "nanoid": "^3.1.9"
   },
   "devDependencies": {

packages/stack/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [5.7.1](https://github.com/react-navigation/react-navigation/compare/@react-navigation/stack@5.7.0...@react-navigation/stack@5.7.1) (2020-07-19)
+
+**Note:** Version bump only for package @react-navigation/stack
+
+
+
+
+
 # [5.7.0](https://github.com/react-navigation/react-navigation/compare/@react-navigation/stack@5.6.2...@react-navigation/stack@5.7.0) (2020-07-10)
 
 

packages/stack/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/stack",
   "description": "Stack navigator component for iOS and Android with animated transitions and gestures",
-  "version": "5.7.0",
+  "version": "5.7.1",
   "keywords": [
     "react-native-component",
     "react-component",
@@ -46,7 +46,7 @@
   "devDependencies": {
     "@react-native-community/bob": "^0.15.1",
     "@react-native-community/masked-view": "^0.1.10",
-    "@react-navigation/native": "^5.7.0",
+    "@react-navigation/native": "^5.7.1",
     "@types/color": "^3.0.1",
     "@types/react": "^16.9.36",
     "@types/react-native": "^0.62.7",