[help wanted] Fix missing/incorrect flow types for 1.x branch (#4108)

* add missing method ‘getParam’ to navigation screen prop

* add usage of `getParam` method

* correct return type for ‘withNavigation’

* snapshot updates

examples/NavigationPlayground/js/SimpleStack.js

@@ -17,7 +17,11 @@ type MyNavScreenProps = {
   banner: React.Node,
 };
 
-class MyBackButton extends React.Component<any, any> {
+type MyBackButtonProps = {
+  navigation: NavigationScreenProp<*>,
+};
+
+class MyBackButton extends React.Component<MyBackButtonProps, any> {
   render() {
     return <Button onPress={this._navigateBack} title="Custom Back" />;
   }
@@ -142,7 +146,7 @@ class MyPhotosScreen extends React.Component<MyPhotosScreenProps> {
     const { navigation } = this.props;
     return (
       <MyNavScreen
-        banner={`${navigation.state.params.name}'s Photos`}
+        banner={`${navigation.getParam('name')}'s Photos`}
         navigation={navigation}
       />
     );
@@ -151,9 +155,9 @@ class MyPhotosScreen extends React.Component<MyPhotosScreenProps> {
 
 const MyProfileScreen = ({ navigation }) => (
   <MyNavScreen
-    banner={`${navigation.state.params.mode === 'edit' ? 'Now Editing ' : ''}${
-      navigation.state.params.name
-    }'s Profile`}
+    banner={`${
+      navigation.getParam('mode') === 'edit' ? 'Now Editing ' : ''
+    }${navigation.getParam('name')}'s Profile`}
     navigation={navigation}
   />
 );

flow/react-navigation.js

@@ -491,6 +491,7 @@ declare module 'react-navigation' {
       action?: NavigationNavigateAction
     ) => boolean,
     setParams: (newParams: NavigationParams) => boolean,
+    getParam: (paramName: string, fallback?: any) => any,
     addListener: (
       eventName: string,
       callback: NavigationEventCallback
@@ -1078,13 +1079,17 @@ declare module 'react-navigation' {
   };
   declare export var TabBarBottom: React$ComponentType<_TabBarBottomProps>;
 
-  declare type _NavigationInjectedProps = {
-    navigation: NavigationScreenProp<NavigationStateRoute>,
-  };
-  declare export function withNavigation<T: {}>(
-    Component: React$ComponentType<T & _NavigationInjectedProps>
-  ): React$ComponentType<T>;
-  declare export function withNavigationFocus<T: {}>(
-    Component: React$ComponentType<T & _NavigationInjectedProps>
-  ): React$ComponentType<T>;
+  declare export function withNavigation<Props: {}>(
+    Component: React$ComponentType<Props>
+  ): React$ComponentType<
+    $Diff<
+      Props,
+      {
+        navigation: NavigationScreenProp<NavigationStateRoute> | void,
+      }
+    >
+  >;
+  declare export function withNavigationFocus<Props: {}>(
+    Component: React$ComponentType<Props>
+  ): React$ComponentType<$Diff<Props, { isFocused: boolean | void }>>;
 }

src/navigators/__tests__/__snapshots__/TabNavigator-test.js.snap

@@ -143,7 +143,7 @@ exports[`TabNavigator renders successfully 1`] = `
                 },
                 false,
                 Object {
-                  "flexGrow": 1,
+                  "flex": 1,
                 },
               ]
             }
@@ -156,6 +156,7 @@ exports[`TabNavigator renders successfully 1`] = `
                   "alignSelf": "center",
                   "height": "100%",
                   "justifyContent": "center",
+                  "minWidth": 30,
                   "opacity": 1,
                   "position": "absolute",
                   "width": "100%",
@@ -170,6 +171,7 @@ exports[`TabNavigator renders successfully 1`] = `
                   "alignSelf": "center",
                   "height": "100%",
                   "justifyContent": "center",
+                  "minWidth": 30,
                   "opacity": 0,
                   "position": "absolute",
                   "width": "100%",

src/views/__tests__/__snapshots__/TabView-test.js.snap

@@ -89,7 +89,7 @@ exports[`TabBarBottom renders successfully 1`] = `
                 },
                 false,
                 Object {
-                  "flexGrow": 1,
+                  "flex": 1,
                 },
               ]
             }
@@ -102,6 +102,7 @@ exports[`TabBarBottom renders successfully 1`] = `
                   "alignSelf": "center",
                   "height": "100%",
                   "justifyContent": "center",
+                  "minWidth": 30,
                   "opacity": 1,
                   "position": "absolute",
                   "width": "100%",
@@ -116,6 +117,7 @@ exports[`TabBarBottom renders successfully 1`] = `
                   "alignSelf": "center",
                   "height": "100%",
                   "justifyContent": "center",
+                  "minWidth": 30,
                   "opacity": 0,
                   "position": "absolute",
                   "width": "100%",