From d6c651c1b3a98c9ca5a7464bff678605b5e77c04 Mon Sep 17 00:00:00 2001 From: Tim Wang Date: Fri, 23 Mar 2018 13:16:51 +0800 Subject: [PATCH 1/4] Add back params generic and remove remain action generic. Add support for stateless screen. --- types/react-navigation/index.d.ts | 65 ++++++++++--------- .../react-navigation-tests.tsx | 31 +++++++-- 2 files changed, 62 insertions(+), 34 deletions(-) diff --git a/types/react-navigation/index.d.ts b/types/react-navigation/index.d.ts index 0e6bb2d94c..47304a1856 100644 --- a/types/react-navigation/index.d.ts +++ b/types/react-navigation/index.d.ts @@ -1,4 +1,4 @@ -// Type definitions for react-navigation 1.2 +// Type definitions for react-navigation 1.5 // Project: https://github.com/react-navigation/react-navigation // Definitions by: Huhuanming // mhcgrq @@ -45,7 +45,6 @@ export interface HeaderProps extends NavigationSceneRendererProps { mode: HeaderMode; router: NavigationRouter< NavigationState, - NavigationAction, NavigationStackScreenOptions >; getScreenDetails: (navigationScene: NavigationScene) => NavigationScreenDetails< @@ -75,9 +74,9 @@ export interface NavigationState { routes: any[]; } -export type NavigationRoute = NavigationLeafRoute | NavigationStateRoute; +export type NavigationRoute = NavigationLeafRoute | NavigationStateRoute; -export interface NavigationLeafRoute { +export interface NavigationLeafRoute { /** * React's key used by some navigators. No need to specify these manually, * they will be defined by the router. @@ -96,23 +95,23 @@ export interface NavigationLeafRoute { * Params passed to this route when navigating to it, * e.g. `{ car_id: 123 }` in a route that displays a car. */ - params?: NavigationParams; + params?: Params; } -export type NavigationStateRoute = NavigationLeafRoute & NavigationState; +export type NavigationStateRoute = NavigationLeafRoute & NavigationState; export type NavigationScreenOptionsGetter = ( - navigation: NavigationScreenProp, + navigation: NavigationScreenProp>, screenProps?: { [key: string]: any } ) => Options; -export interface NavigationRouter { +export interface NavigationRouter { /** * The reducer that outputs the new navigation state for a given action, with * an optional previous state. When the action is considered handled but the * state is unchanged, the output state is null. */ - getStateForAction: (action: Action, lastState?: State) => (State | null); + getStateForAction: (action: NavigationAction, lastState?: State) => (State | null); /** * Maps a URI-like string to an action. This can be mapped to a state @@ -121,7 +120,7 @@ export interface NavigationRouter { getActionForPathAndParams: ( path: string, params?: NavigationParams - ) => (Action | null); + ) => (NavigationAction | null); getPathAndParamsForState: ( state: State @@ -175,16 +174,24 @@ export type NavigationScreenConfig = export type NavigationComponent = NavigationScreenComponent - | NavigationNavigator; + | NavigationNavigator + | any; -export interface NavigationScreenComponent extends React.ComponentClass { - navigationOptions?: NavigationScreenConfig; -} +export type NavigationScreenComponent< + Options = {}, + Props = {} +> = React.ComponentType & Props> & +({} | { navigationOptions: NavigationScreenConfig }); -export interface NavigationNavigator extends React.ComponentClass { - router?: NavigationRouter; - navigationOptions?: NavigationScreenConfig; -} + +export type NavigationNavigator< + State = NavigationState, + Options = {}, + Props = {} +> = React.ComponentType & Props> & { + router: NavigationRouter, + navigationOptions?: NavigationScreenConfig | any, +}; export interface NavigationParams { [key: string]: any; @@ -452,10 +459,10 @@ export interface NavigationScreenProp { popToTop: (params?: { immediate?: boolean }) => boolean; } -export interface NavigationNavigatorProps { +export interface NavigationNavigatorProps { navigation?: NavigationProp; screenProps?: { [key: string]: any }; - navigationOptions?: any; + navigationOptions?: O; } /** @@ -587,7 +594,7 @@ export interface NavigationContainerProps { export interface NavigationContainer extends React.ComponentClass< NavigationContainerProps & NavigationNavigatorProps > { - router: NavigationRouter; + router: NavigationRouter; screenProps: { [key: string]: any }; navigationOptions: any; state: { nav: NavigationState | null }; @@ -810,7 +817,7 @@ export class Transitioner extends React.Component< export function TabRouter( routeConfigs: NavigationRouteConfigMap, config: NavigationTabRouterConfig -): NavigationRouter; +): NavigationRouter; /** * Stack Router @@ -820,19 +827,19 @@ export function TabRouter( export function StackRouter( routeConfigs: NavigationRouteConfigMap, config: NavigationTabRouterConfig -): NavigationRouter; +): NavigationRouter; /** * Create Navigator * * @see https://github.com/react-navigation/react-navigation/blob/master/src/navigators/createNavigator.js */ -export function createNavigator( - router: NavigationRouter, +export function createNavigator( + router: NavigationRouter, routeConfigs?: NavigationRouteConfigMap, navigatorConfig?: {} | null, navigatorType?: NavigatorType -): (NavigationView: React.ComponentClass) => NavigationNavigator; +): (NavigationView: React.ComponentClass) => NavigationNavigator; /** * Create an HOC that injects the navigation and manages the navigation state @@ -843,7 +850,7 @@ export function createNavigator( * @see https://github.com/react-navigation/react-navigation/blob/master/src/createNavigationContainer.js */ export function createNavigationContainer( - Component: NavigationNavigator + Component: NavigationNavigator ): NavigationContainer; /** * END MANUAL DEFINITIONS OUTSIDE OF TYPEDEFINITION.JS @@ -853,8 +860,8 @@ export function createNavigationContainer( * BEGIN CUSTOM CONVENIENCE INTERFACES */ -export interface NavigationScreenProps { - navigation: NavigationScreenProp; +export interface NavigationScreenProps { + navigation: NavigationScreenProp>; screenProps?: { [key: string]: any }; navigationOptions?: NavigationScreenConfig; } diff --git a/types/react-navigation/react-navigation-tests.tsx b/types/react-navigation/react-navigation-tests.tsx index d0e65dfc8e..4c8ff5dd99 100644 --- a/types/react-navigation/react-navigation-tests.tsx +++ b/types/react-navigation/react-navigation-tests.tsx @@ -36,6 +36,7 @@ import { NavigationParams, NavigationPopAction, NavigationPopToTopAction, + NavigationScreenComponent, } from 'react-navigation'; // Constants @@ -48,14 +49,19 @@ const viewStyle: ViewStyle = { const ROUTE_NAME_START_SCREEN = "StartScreen"; +interface StartScreenNavigationParams { + id: number; + s: string; +} + /** * @desc Simple screen component class with typed component props that should * receive the navigation prop from the AppNavigator. */ -class StartScreen extends React.Component { +class StartScreen extends React.Component> { render() { // Implicit type checks. - const navigationStateParams = this.props.navigation.state.params; + const navigationStateParams: StartScreenNavigationParams | void = this.props.navigation.state.params; const id = this.props.navigation.state.params && this.props.navigation.state.params.id; const s = this.props.navigation.state.params && this.props.navigation.state.params.s; @@ -84,10 +90,15 @@ class StartScreen extends React.Component { const ROUTE_NAME_NEXT_SCREEN = "NextScreen"; -class NextScreen extends React.Component { +interface NextScreenNavigationParams { + id: number; + name: string; +} + +class NextScreen extends React.Component> { render() { // Implicit type checks. - const navigationStateParams = this.props.navigation.state.params; + const navigationStateParams: NextScreenNavigationParams | void = this.props.navigation.state.params; const id = this.props.navigation.state.params && this.props.navigation.state.params.id; const name = this.props.navigation.state.params && this.props.navigation.state.params.name; @@ -100,7 +111,7 @@ class NextScreen extends React.Component { const navigationOptions = { headerBackTitle: null, }; -const initialRouteParams: NavigationParams = { +const initialRouteParams: StartScreenNavigationParams = { id: 1, s: "Start", }; @@ -123,6 +134,16 @@ export const AppNavigator = StackNavigator( }, ); +const StatelessScreen: NavigationScreenComponent<{}, {}> = () => ; + +const SimpleStackNavigator = StackNavigator( + { + simple: { + screen: StatelessScreen, + }, + } +) + /** * Router. */ From 8731027ec5db8ba1465e0b82492ee55ed63beaa5 Mon Sep 17 00:00:00 2001 From: Tim Wang Date: Fri, 23 Mar 2018 13:29:00 +0800 Subject: [PATCH 2/4] Fix CI --- types/react-navigation/index.d.ts | 1 - types/react-navigation/react-navigation-tests.tsx | 8 ++++---- types/react-navigation/tslint.json | 7 ++++++- 3 files changed, 10 insertions(+), 6 deletions(-) diff --git a/types/react-navigation/index.d.ts b/types/react-navigation/index.d.ts index 47304a1856..3c6bffe130 100644 --- a/types/react-navigation/index.d.ts +++ b/types/react-navigation/index.d.ts @@ -183,7 +183,6 @@ export type NavigationScreenComponent< > = React.ComponentType & Props> & ({} | { navigationOptions: NavigationScreenConfig }); - export type NavigationNavigator< State = NavigationState, Options = {}, diff --git a/types/react-navigation/react-navigation-tests.tsx b/types/react-navigation/react-navigation-tests.tsx index 4c8ff5dd99..5c03253d35 100644 --- a/types/react-navigation/react-navigation-tests.tsx +++ b/types/react-navigation/react-navigation-tests.tsx @@ -61,7 +61,7 @@ interface StartScreenNavigationParams { class StartScreen extends React.Component> { render() { // Implicit type checks. - const navigationStateParams: StartScreenNavigationParams | void = this.props.navigation.state.params; + const navigationStateParams: StartScreenNavigationParams | undefined = this.props.navigation.state.params; const id = this.props.navigation.state.params && this.props.navigation.state.params.id; const s = this.props.navigation.state.params && this.props.navigation.state.params.s; @@ -98,7 +98,7 @@ interface NextScreenNavigationParams { class NextScreen extends React.Component> { render() { // Implicit type checks. - const navigationStateParams: NextScreenNavigationParams | void = this.props.navigation.state.params; + const navigationStateParams: NextScreenNavigationParams | undefined = this.props.navigation.state.params; const id = this.props.navigation.state.params && this.props.navigation.state.params.id; const name = this.props.navigation.state.params && this.props.navigation.state.params.name; @@ -134,7 +134,7 @@ export const AppNavigator = StackNavigator( }, ); -const StatelessScreen: NavigationScreenComponent<{}, {}> = () => ; +const StatelessScreen: NavigationScreenComponent = () => ; const SimpleStackNavigator = StackNavigator( { @@ -142,7 +142,7 @@ const SimpleStackNavigator = StackNavigator( screen: StatelessScreen, }, } -) +); /** * Router. diff --git a/types/react-navigation/tslint.json b/types/react-navigation/tslint.json index 3db14f85ea..d9d49e375e 100644 --- a/types/react-navigation/tslint.json +++ b/types/react-navigation/tslint.json @@ -1 +1,6 @@ -{ "extends": "dtslint/dt.json" } +{ + "extends": "dtslint/dt.json", + "rules": { + "no-any-union": false + } +} From ebf695c819b0126efb0f91c9197a85335d0bac1f Mon Sep 17 00:00:00 2001 From: Tim Wang Date: Mon, 26 Mar 2018 10:41:58 +0800 Subject: [PATCH 3/4] Remove any union type --- types/react-navigation/index.d.ts | 3 +-- types/react-navigation/tslint.json | 7 +------ 2 files changed, 2 insertions(+), 8 deletions(-) diff --git a/types/react-navigation/index.d.ts b/types/react-navigation/index.d.ts index 3c6bffe130..cb27a40d71 100644 --- a/types/react-navigation/index.d.ts +++ b/types/react-navigation/index.d.ts @@ -175,7 +175,6 @@ export type NavigationScreenConfig = export type NavigationComponent = NavigationScreenComponent | NavigationNavigator - | any; export type NavigationScreenComponent< Options = {}, @@ -189,7 +188,7 @@ export type NavigationNavigator< Props = {} > = React.ComponentType & Props> & { router: NavigationRouter, - navigationOptions?: NavigationScreenConfig | any, + navigationOptions?: NavigationScreenConfig, }; export interface NavigationParams { diff --git a/types/react-navigation/tslint.json b/types/react-navigation/tslint.json index d9d49e375e..3db14f85ea 100644 --- a/types/react-navigation/tslint.json +++ b/types/react-navigation/tslint.json @@ -1,6 +1 @@ -{ - "extends": "dtslint/dt.json", - "rules": { - "no-any-union": false - } -} +{ "extends": "dtslint/dt.json" } From 40f7502a236e5de5d0242e891f274a697bf37ad4 Mon Sep 17 00:00:00 2001 From: Tim Wang Date: Mon, 26 Mar 2018 10:50:07 +0800 Subject: [PATCH 4/4] Fix linter issues --- types/react-navigation/index.d.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/types/react-navigation/index.d.ts b/types/react-navigation/index.d.ts index cb27a40d71..9ec404a6fb 100644 --- a/types/react-navigation/index.d.ts +++ b/types/react-navigation/index.d.ts @@ -174,7 +174,7 @@ export type NavigationScreenConfig = export type NavigationComponent = NavigationScreenComponent - | NavigationNavigator + | NavigationNavigator; export type NavigationScreenComponent< Options = {},