From aa5ba74640cbf935fc995f900291f38c5896c152 Mon Sep 17 00:00:00 2001 From: Peter Jihoon Kim Date: Mon, 26 Jun 2017 22:35:09 -0700 Subject: [PATCH] [react-navigation] Fixed type definitions for NavigationActions.* --- types/react-navigation/index.d.ts | 66 ++++++++++++------- .../react-navigation-tests.tsx | 50 ++++++++++++-- 2 files changed, 86 insertions(+), 30 deletions(-) diff --git a/types/react-navigation/index.d.ts b/types/react-navigation/index.d.ts index 5286540963..1d07494104 100644 --- a/types/react-navigation/index.d.ts +++ b/types/react-navigation/index.d.ts @@ -4,6 +4,7 @@ // mhcgrq // fangpenlin // abrahambotros +// petejkim // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped // TypeScript Version: 2.3 @@ -188,46 +189,63 @@ export interface NavigationParams { [key: string]: any, } -export type NavigationNavigateAction = { - type: 'Navigation/NAVIGATE', +export interface NavigationNavigateActionPayload { routeName: string, params?: NavigationParams, // The action to run inside the sub-router action?: NavigationNavigateAction, -}; +} -export type NavigationBackAction = { - type: 'Navigation/BACK', +export interface NavigationNavigateAction extends NavigationNavigateActionPayload { + type: 'Navigation/NAVIGATE', +} + +export interface NavigationBackActionPayload { key?: string | null, -}; +} -export type NavigationSetParamsAction = { - type: 'Navigation/SET_PARAMS', +export interface NavigationBackAction extends NavigationBackActionPayload { + type: 'Navigation/BACK', +} +export interface NavigationSetParamsActionPayload { // The key of the route where the params should be set key: string, // The new params to merge into the existing route params params?: NavigationParams, -}; +} -export type NavigationInitAction = { - type: 'Navigation/INIT', +export interface NavigationSetParamsAction extends NavigationSetParamsActionPayload { + type: 'Navigation/SET_PARAMS', +} + +export interface NavigationInitActionPayload { params?: NavigationParams, -}; +} -export type NavigationResetAction = { - type: 'Navigation/RESET', +export interface NavigationInitAction extends NavigationInitActionPayload { + type: 'Navigation/INIT', +} + +export interface NavigationResetActionPayload { index: number, key?: string | null, actions: Array, -}; +} -export type NavigationUriAction = { - type: 'Navigation/URI', +export interface NavigationResetAction extends NavigationResetActionPayload { + type: 'Navigation/RESET', +} + +export interface NavigationUriActionPayload { uri: string, -}; +} + +export interface NavigationUriAction extends NavigationUriActionPayload { + type: 'Navigation/URI', +} export interface NavigationStackViewConfig { mode?: 'card' | 'modal', @@ -575,15 +593,13 @@ export const TabBarBottom: React.ComponentClass; /** * NavigationActions - * @todo Is this necessary, or can we remove? Not referenced anywhere else here, but it seems a - * recent commit or two touches these. Can anyone provide a strong use case for keeping this in? */ export namespace NavigationActions { - function init(options?: NavigationInitAction): NavigationInitAction; - function navigate(options: NavigationNavigateAction): NavigationNavigateAction; - function reset(options: NavigationResetAction): NavigationResetAction; - function back(options?: NavigationBackAction): NavigationBackAction; - function setParams(options: NavigationSetParamsAction): NavigationSetParamsAction; + export function init(options?: NavigationInitActionPayload): NavigationInitAction; + export function navigate(options: NavigationNavigateActionPayload): NavigationNavigateAction; + export function reset(options: NavigationResetActionPayload): NavigationResetAction; + export function back(options?: NavigationBackActionPayload): NavigationBackAction; + export function setParams(options: NavigationSetParamsActionPayload): NavigationSetParamsAction; } /** diff --git a/types/react-navigation/react-navigation-tests.tsx b/types/react-navigation/react-navigation-tests.tsx index 835e63d756..1840fd7ccf 100644 --- a/types/react-navigation/react-navigation-tests.tsx +++ b/types/react-navigation/react-navigation-tests.tsx @@ -5,22 +5,28 @@ import { ViewStyle, } from 'react-native'; import { - addNavigationHelpers, + NavigationAction, + NavigationActions, + NavigationBackAction, + NavigationInitAction, + NavigationNavigateAction, + NavigationProp, + NavigationResetAction, NavigationRouteConfigMap, NavigationScreenProp, NavigationScreenProps, + NavigationSetParamsAction, NavigationStackAction, NavigationStackScreenOptions, NavigationTabScreenOptions, + NavigationTransitionProps, StackNavigator, StackNavigatorConfig, + TabBarTop, TabNavigator, TabNavigatorConfig, - TabBarTop, Transitioner, - NavigationProp, - NavigationAction, - NavigationTransitionProps, + addNavigationHelpers, } from 'react-navigation'; // Constants @@ -42,6 +48,7 @@ interface StartScreenNavigationParams { id: number, s: string, } + interface StartScreenProps extends NavigationScreenProps { } class StartScreen extends React.Component { render() { @@ -219,3 +226,36 @@ class CustomTransitioner extends React.Component return {} } } + +const initAction: NavigationInitAction = NavigationActions.init({ + params: { + foo: "bar" + } +}) + +const navigateAction: NavigationNavigateAction = NavigationActions.navigate({ + routeName: "FooScreen", + params: { + foo: "bar" + }, + action: NavigationActions.navigate({ routeName: "BarScreen" }) +}) + +const resetAction: NavigationResetAction = NavigationActions.reset({ + index: 0, + key: "foo", + actions: [ + NavigationActions.navigate({ routeName: "FooScreen" }) + ] +}) + +const backAction: NavigationBackAction = NavigationActions.back({ + key: "foo" +}) + +const setParamsAction: NavigationSetParamsAction = NavigationActions.setParams({ + key: "foo", + params: { + foo: "bar" + } +})