Skip to content

Commit d1c434b

Browse files
Ashoatspencercarli
Ashoat
authored and
spencercarli
committed
Update to react-native@0.49 and flow-bin@0.53 (react-navigation#2845)
* Update root package to react-native@0.49 and flow-bin@0.53 * Update NavigationPlayground package to react-native@0.49 and flow-bin@0.53 * Update ReduxExample package to react-native@0.49 and flow-bin@0.53 * flow-typed update (code-gen) * Find-and-replace old types with new types - `React.Element<*>` as the result of a render function is now `React.Node` - `ReactClass<T>` as the type of a Component is now `React.ComponentType<typeof T>` - `extends React.Component<DP, P, S>` is now `extends React.Component<P, S>` - `React.Children<*>` as the type of a children prop is now `React.ChildrenArray<*>` - Refs are now typed with `React.Ref` There are also several tiny typo fixes in here. * Avoid assuming state is NavigationRoute in addNavigationHelpers For the root, top-level Navigator, the state is a simple `NavigationState` (with no route info) and we still use `addNavigationHelpers` for it. We can't assume `navigation.state.key` is accessible for this type, so we need to do runtime checks here. * Fix type of NavigationScreenConfig `navigationOptions` was incorrectly typed * Give createNavigationContainer's State a type parameter We want to be able to specifically type this guy so we can use specific NavigationState for things like the Drawer views without having to do runtime assertions about the state type * Fix typing of NavigationAction First of all, `NavigationAction` was being used as two different types, so I had to create the new `PossiblyDeprecatedNavigationAction` and add it as a type parameter everywhere. Second of all, generics and implied types were being used far more than they need to be, and they're hard to work with because Flow doesn't really explain things well when they go wrong. * Make sure children scenes of CardStack have NavigationProp typed with NavigationRoute CardStack's `NavigationScreenProp` is typed with `NavigationState`, but the children need `NavigationRoute`. Flow gets confused by the spread operator, even if the individual property is replaced later, so we need to explicitly list each property individually (just `dispatch`, actually). * Allow prevTransitionProps parameter to be nullable * Allow prevTransitionProps parameter to be nullable * Narrow down a couple type parameters * Move NavigationStateRoute cast to within Component.router check in createConfigGetter * Update withCachedChildNavigation so it's typed correctly with React.ComponentType * Add a $FlowFixMe for displayName `React.StatelessFunctionalComponent` is missing `displayName` before Flow 0.54.0 See facebook/flow@de37062 * Make TouchableItem's onPress prop optional `HeaderBackButton` can pass in an undefined onPress, and the React Native `Touchable*` components allow it too * Simplify withCachedChildNavigation and get rid of generics The generics don't help us here and they make the types more confusing * Redefine NavigationComponent as direct intersection The new type is technically identical to the old type, but Flow is confused by the old type... * Save router to local var before checking createConfigGetter Flow seems to think Component.router can change after the check * Fix DrawerSidebar's navigation prop's type In order for us to be able to generate a childNavigationProp, the original navigation prop has to have a NavigationState state. * Colocate action.key check with action.type check in getStateForAction For some reason, Flow thinks `action` can change sometime after `action.type` is checked. As a result, it's not properly concluding that `action.key` should exist. To avoid this, we pull `action.key` out immediately after doing the `action.type` check. * Use bounded polymorphism to pass down all props in withCachedChildNavigation Also makes sure the injected props are specified first in the union Also removes an unused `eslint-disable-line` in `getScreenForRouteName` * Make TabRouter's getComponentForState return NavigationComponent `NavigationScreenComponent` is a subtype of `NavigationComponent`, but it's not clear that `getComponentForState` always returns a `NavigationScreenComponent`, as `getScreenForRouteName` returns `NavigationComponent` * Define NavigationComponent's props using NavigationNavigatorProps Right now the types ask Flow to infer the types of `NavigationComponent`'s props. (`NavigationComponent` is the union of `NavigationNavigator` and NavigationScreenComponent.) Instead, we type the props as subtypes of `NavigationNavigatorProps`, so we can properly access those props without type errors. We used bounded polymorphism in `createNavigationContainer` and `createNavigator` to pass down these props. We also explicitly type the action in `createNavigationContainer` so we can properly pass in a `NavigationInitAction` to the dispatch function. * Parameterize NavigationTabRouterConfig `NavigationTabRouterConfig` doesn't always take `NavigationTabScreenOptions`; sometimes, it takes `NavigationDrawerScreenOptions`. * Make all NavigationOptions Exact types We're seeing weird behavior when these are merged together. By making them Exact types, we make types don't get mangled when they're unioned. https://flow.org/en/docs/types/unions/#toc-disjoint-unions-with-exact-types * Silence errors in tests These errors are unavoidable since we can't type the precise shape of a particular `NavigationState`. * Include NavigationSetParamsAction in NavigationTabAction `TabNavigator`'s `getStateForAction` definitely takes `NavigationSetParamsAction`. * Explicitly list router as void in NavigationScreenComponent This is so Flow knows that if a `NavigationComponent` has a `router` property, then it is definitely a `NavigationNavigator`. * Fix website app navigator's type * Fix createDocPage type in App In an earlier commit I attempted to fix the types here, but I incorrectly read it as returning a navigator when it just returns a screen. For some reason the error didn't immediately show up. * Fix NavigationComponent types Five changes: 1. No longer parameterizing the props of `NavigationComponent`; directly specifying as `NavigationNavigatorProps` 2. Specify the two distinct kinds of route types (leaf and state) directly in `NavigationComponent` 3. Have `SceneView` directly take `NavigationComponent` and allow inferring of `NavigationSceneProp` type 4. Have `CardStack` directly take `NavigationComponent` as well * Allow Flow to infer `NavigationAction` type in `createNavigator` * Silence Flow in router code that handles navigator sub-routes There's no way for us to tell Flow that routes that correspond to navigators should be `NavigationStateRoute`s * Allow DrawerSidebar to take a null contentComponent The way `DrawerNavigator` is set up, it's possible to pass in a null `contentComponent` in the config. If somebody want to do this, we'll just make the `DrawerSidebar` not appear altogether. This is simpler than splitting the types so there's a possibly-unspecified one for the user input, but a definitely-specified one in `DrawerSidebar`. * Specify missing screenProps prop in DrawerView * Thread full NavigationStateRoute in to DrawerSidebar This requiring making `withCachedChildNavigation` use bounded polymorphism to thread the `NavigationStateRoute` through instead of downgrading it to a `NavigationState` * Make NavigationStateProp's state prop covariant This means that `NavigationStateProp<NavigationStateRoute>` will be a subtype of `NavigationStateProp<NavigationRoute>` and `NavigationStateProp<NavigationState>` * Silence Flow's complaints about a route not being a NavigationStateRoute As mentioned in previous commits and in the comment, there is no way to type a specific navigation state shape, so we have to cast it and silence Flow's complaints. * Get rid of style prop in CardStack It looks like at some point, it was possible to specify a `style` prop that got passed all the way down to `Header`, the `TransitionConfig`'s `screenInterpolator`, and `Transitioner`. Doesn't look like we're using it anywhere, and there's a todo saying to remove it, and it's causing a type error. * Infer type of options instead of using a subtype of {} I think this has to do with {} allowing for unsealed objects. I'm not 100% sure, but this fixes 4/6 of the remaining errors! * Fix two type errors in NavigationPlayground One was just requiring an outdated type (`React.Children` instead of `React.ChildrenArray`), and the other was getting confused regarding types because of a spread operator. * Use a covariant property to simplify withCachedChildNavigation's InputProps This doesn't reduce any errors, but it's a bit simpler and cleaner. * Silence last two Flow errors regarding withCachedChildNavigation injecting childNavigationProps These are the only two errors I haven't been able to figure out at all. If I had more time I'd try and figure out the simplest case and report it to the Flow team, but I've been working on this for a week already and have to move on. The issue at hand is that `withCachedChildNavigation` injects `childNavigationProps`, but Flow doesn't see this and thinks it needs to be specified by the view component. We're using the HOC pattern suggested by the Flow docs, and I've tried several other patterns to no avail. * Use stock react-native instead of Expo's in NavigationPlayground Expo's causes Flow errors, and apparently this is normal practice because the person who switched us to Expo did this too. * Silence react-native-gesture-handler Flow errors in NavigationPlayground Expo requires this package, but it causes Flow errors. * Fix index check in DrawerSidebar Silly me, falling for the typical "0 is falsey" problem... * Rework deprecated action tests In an earlier commit I moved the `NavigationActions.mapDeprecatedActionAndWarn` out from `getStateForAction` and into `createNavigationContainer`'s `dispatch` function. The tests need to be reworked to support this, as they were previously calling `getStateForAction` directly. I don't imagine any users are calling `getStateForAction` directly. * Re-record two snapshots The changes in these snapshots are by design and don't affect anything. * Infer type of options in NavigationScreenConfig The issue is that sometimes we include options for different navigators in a single blob. * Infer types of action and options in createNavigationContainer Particulary helps with Options. Makes the types more specific and gets rid of an error that only shows up when using the library * Don't use generics for NavigationState in createNavigationContainer There's no particular reason for having those generics there, since there's no way we'd be able to get Flow to understand the exact shape of particular navigation states anyways. This fixes a bug when integrating this version of the project into my repo. * Move ReduxExample to react-native@0.49.3 instead of custom Expo version
1 parent 7013370 commit d1c434b

File tree

98 files changed

+3735
-3433
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

98 files changed

+3735
-3433
lines changed

‎.eslintrc

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -17,9 +17,6 @@
1717
"env": {
1818
"jasmine": true
1919
},
20-
"globals": {
21-
"ReactClass": true
22-
},
2320
"rules": {
2421
"prettier/prettier": ["error", {
2522
"trailingComma": "es5",

‎.flowconfig

Lines changed: 19 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -2,15 +2,20 @@
22
; We fork some components by platform
33
.*/*[.]android.js
44

5-
; Ignore templates for 'react-native init'
6-
.*/local-cli/templates/.*
7-
85
; Ignore "BUCK" generated dirs
96
.*/node_modules/react-native/\.buckd/
107

118
; Ignore unexpected extra "@providesModule"
129
.*/node_modules/.*/node_modules/fbjs/.*
1310

11+
; Ignore duplicate module providers
12+
; For RN Apps installed via npm, "Libraries" folder is inside
13+
; "node_modules/react-native" but in the source repo it is in the root
14+
.*/Libraries/react-native/React.js
15+
16+
; Ignore polyfills
17+
.*/Libraries/polyfills/.*
18+
1419
; Ignore website node_modules react and react-native
1520
<PROJECT_ROOT>/website/node_modules/react/.*
1621
<PROJECT_ROOT>/website/node_modules/react-native/.*
@@ -25,28 +30,34 @@
2530

2631
[libs]
2732
node_modules/react-native/Libraries/react-native/react-native-interface.js
28-
node_modules/react-native/flow
33+
node_modules/react-native/flow/
2934

3035
[options]
3136
module.system=haste
3237

33-
experimental.strict_type_args=true
38+
emoji=true
3439

3540
munge_underscores=true
3641

37-
module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> '<PROJECT_ROOT>/stubs/RelativeImageStub.js.flow'
42+
module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> 'RelativeImageStub'
43+
3844
module.file_ext=.js
3945
module.file_ext=.jsx
4046
module.file_ext=.json
4147
module.file_ext=.native.js
4248

4349
suppress_type=$FlowIssue
4450
suppress_type=$FlowFixMe
51+
suppress_type=$FlowFixMeProps
52+
suppress_type=$FlowFixMeState
4553
suppress_type=$FixMe
4654

47-
suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(4[0-2]\\|[1-3][0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native_oss[a-z,_]*\\)?)\\)
48-
suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(4[0-2]\\|[1-3][0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native_oss[a-z,_]*\\)?)\\)?:? #[0-9]+
55+
suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(5[0-3]\\|[1-4][0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)
56+
suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(5[0-3]\\|[1-4][0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)?:? #[0-9]+
4957
suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy
5058
suppress_comment=\\(.\\|\n\\)*\\$FlowExpectedError
5159

5260
unsafe.enable_getters_and_setters=true
61+
62+
[version]
63+
0.53.0

‎docs/api/navigators/DrawerNavigator.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -172,11 +172,11 @@ Generic title that can be used as a fallback for `headerTitle` and `drawerLabel`
172172

173173
#### `drawerLabel`
174174

175-
String, React Element or a function that given `{ focused: boolean, tintColor: string }` returns a React.Element, to display in drawer sidebar. When undefined, scene `title` is used
175+
String, React Element or a function that given `{ focused: boolean, tintColor: string }` returns a React.Node, to display in drawer sidebar. When undefined, scene `title` is used
176176

177177
#### `drawerIcon`
178178

179-
React Element or a function, that given `{ focused: boolean, tintColor: string }` returns a React.Element, to display in drawer sidebar
179+
React Element or a function, that given `{ focused: boolean, tintColor: string }` returns a React.Node, to display in drawer sidebar
180180

181181
#### `drawerLockMode`
182182

‎docs/api/navigators/TabNavigator.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -169,11 +169,11 @@ True or false to show or hide the tab bar, if not set then defaults to true.
169169

170170
#### `tabBarIcon`
171171

172-
React Element or a function that given `{ focused: boolean, tintColor: string }` returns a React.Element, to display in tab bar.
172+
React Element or a function that given `{ focused: boolean, tintColor: string }` returns a React.Node, to display in tab bar.
173173

174174
#### `tabBarLabel`
175175

176-
Title string of a tab displayed in the tab bar or React Element or a function that given `{ focused: boolean, tintColor: string }` returns a React.Element, to display in tab bar. When undefined, scene `title` is used. To hide, see `tabBarOptions.showLabel` in the previous section.
176+
Title string of a tab displayed in the tab bar or React Element or a function that given `{ focused: boolean, tintColor: string }` returns a React.Node, to display in tab bar. When undefined, scene `title` is used. To hide, see `tabBarOptions.showLabel` in the previous section.
177177

178178
#### `tabBarOnPress`
179179

‎docs/api/views/Transitioner.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -153,7 +153,7 @@ For a comprehensive tutorial on how to create custom transitions, see this [blog
153153
154154
#### Flow definition
155155
```js
156-
render: (transitionProps: NavigationTransitionProps, prevTransitionProps: ?NavigationTransitionProps) => React.Element<*>,
156+
render: (transitionProps: NavigationTransitionProps, prevTransitionProps: ?NavigationTransitionProps) => React.Node,
157157
```
158158
159159
#### Parameters

‎examples/NavigationPlayground/.flowconfig

Lines changed: 14 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,9 @@
1212
; For RN Apps installed via npm, "Libraries" folder is inside
1313
; "node_modules/react-native" but in the source repo it is in the root
1414
.*/Libraries/react-native/React.js
15-
.*/Libraries/react-native/ReactNative.js
15+
16+
; Ignore polyfills
17+
.*/Libraries/polyfills/.*
1618

1719
.*/react-navigation/node_modules/.*
1820

@@ -38,11 +40,14 @@
3840
.*/react-navigation/examples/ReduxExample/.*
3941
.*/react-navigation/website/.*
4042

43+
; This package is required by Expo and causes Flow errors
44+
.*/node_modules/react-native-gesture-handler/.*
45+
4146
[include]
4247

4348
[libs]
4449
node_modules/react-native/Libraries/react-native/react-native-interface.js
45-
node_modules/react-native/flow
50+
node_modules/react-native/flow/
4651

4752
[options]
4853
module.system=haste
@@ -61,11 +66,16 @@ module.file_ext=.native.js
6166

6267
suppress_type=$FlowIssue
6368
suppress_type=$FlowFixMe
69+
suppress_type=$FlowFixMeProps
70+
suppress_type=$FlowFixMeState
6471
suppress_type=$FixMe
6572

66-
suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(4[0-5]\\|[1-3][0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native_oss[a-z,_]*\\)?)\\)
67-
suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(4[0-5]\\|[1-3][0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native_oss[a-z,_]*\\)?)\\)?:? #[0-9]+
73+
suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(5[0-3]\\|[1-4][0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)
74+
suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(5[0-3]\\|[1-4][0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)?:? #[0-9]+
6875
suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy
6976
suppress_comment=\\(.\\|\n\\)*\\$FlowExpectedError
7077

7178
unsafe.enable_getters_and_setters=true
79+
80+
[version]
81+
0.53.0

‎examples/NavigationPlayground/app.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@
1212
"icon": "./assets/icons/react-navigation.png",
1313
"hideExponentText": false
1414
},
15-
"sdkVersion": "21.0.0",
15+
"sdkVersion": "22.0.0",
1616
"entryPoint": "./node_modules/react-native-scripts/build/bin/crna-entry.js",
1717
"packagerOpts": {
1818
"assetExts": [

‎examples/NavigationPlayground/flow-typed/npm/babel-jest_vx.x.x.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
// flow-typed signature: e14baf3e1691e7c886f1f41fac30e58e
2-
// flow-typed version: <<STUB>>/babel-jest_v^21.0.0/flow_v0.51.0
1+
// flow-typed signature: 5964a245d3129ecd50da1f74a2f86454
2+
// flow-typed version: <<STUB>>/babel-jest_v^21.0.0/flow_v0.53.0
33

44
/**
55
* This is an autogenerated libdef stub for:

0 commit comments

Comments
 (0)