From 294118edad7a385f019da21925e7cf51147049c9 Mon Sep 17 00:00:00 2001 From: Huy Nguyen Date: Tue, 28 Mar 2017 16:17:05 -0400 Subject: [PATCH 1/6] Add type definition for react-router-redux v5 For the latest version (v5) of react-router-redux, the package was moved from [an external repo](https://github.com/reactjs/react-router-redux) to [live alongside](https://github.com/ReactTraining/react-router/tree/master/packages/react-router-redux) the react-router code base. The API has also changed significantly and merits a freshly written type definition. The current version (v4) was moved into its own directory. --- types/react-router-redux/index.d.ts | 102 +++++++++--------- .../react-router-redux-tests.tsx | 46 ++++++++ types/react-router-redux/tsconfig.json | 9 +- types/react-router-redux/tslint.json | 7 +- types/react-router-redux/v4/index.d.ts | 63 +++++++++++ types/react-router-redux/v4/package.json | 5 + .../{ => v4}/react-router-redux-tests.ts | 0 types/react-router-redux/v4/tsconfig.json | 28 +++++ types/react-router-redux/v4/tslint.json | 6 ++ 9 files changed, 211 insertions(+), 55 deletions(-) create mode 100644 types/react-router-redux/react-router-redux-tests.tsx create mode 100644 types/react-router-redux/v4/index.d.ts create mode 100644 types/react-router-redux/v4/package.json rename types/react-router-redux/{ => v4}/react-router-redux-tests.ts (100%) create mode 100644 types/react-router-redux/v4/tsconfig.json create mode 100644 types/react-router-redux/v4/tslint.json diff --git a/types/react-router-redux/index.d.ts b/types/react-router-redux/index.d.ts index 9f8044a7c0..5638b135b9 100644 --- a/types/react-router-redux/index.d.ts +++ b/types/react-router-redux/index.d.ts @@ -1,59 +1,65 @@ -// Type definitions for react-router-redux 4.0 -// Project: https://github.com/rackt/react-router-redux -// Definitions by: Isman Usoh , Noah Shipley , Dimitri Rosenberg , Karol Janyst , Dovydas Navickas +// Type definitions for react-router-redux 5.0 +// Project: https://github.com/ReactTraining/react-router/tree/master/packages/react-router-redux +// Definitions by: Huy Nguyen // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped -// TypeScript Version: 2.1 +// TypeScript Version: 2.2 -import { Action, Middleware, Store } from "redux"; -import { History, Location, LocationDescriptor } from "history"; +import { + Store, + Dispatch, + Action, + Middleware +} from 'redux'; +import { + History, + Location, + Path, + LocationState, + LocationDescriptorObject +} from 'history'; +import * as React from 'react'; -export const CALL_HISTORY_METHOD: string; -export const LOCATION_CHANGE: string; +export interface ConnectedRouterProps { + store?: Store, + history?: History +} +export class ConnectedRouter extends React.Component, {}> {} + +export const LOCATION_CHANGE = '@@router/LOCATION_CHANGE' + +export interface RouterState { + location: Location | null +} + +export function routerReducer(state?: RouterState, action?: RouterAction): RouterState + +export const CALL_HISTORY_METHOD = '@@router/LOCATION_CHANGE'; + +export function push(path: Path, state?: LocationState): RouterAction +export function push(location: LocationDescriptorObject): RouterAction +export function replace(path: Path, state?: LocationState): RouterAction +export function replace(location: LocationDescriptorObject): RouterAction +export function go(n: number): RouterAction +export function goBack(): RouterAction +export function goForward(): RouterAction + +export const routerAction: { + push: typeof push + replace: typeof replace + go: typeof go + goBack: typeof goBack + goForward: typeof goForward +} export interface LocationActionPayload { - method: string; - args?: any[]; + method: string, + args?: any[], } export interface RouterAction extends Action { - payload?: LocationActionPayload; + type: typeof CALL_HISTORY_METHOD, + payload: LocationActionPayload } -type LocationAction = (nextLocation: LocationDescriptor) => RouterAction; -type GoAction = (n: number) => RouterAction; -type NavigateAction = () => RouterAction; +export function routerMiddleware(history: History): Middleware -export const push: LocationAction; -export const replace: LocationAction; -export const go: GoAction; -export const goBack: NavigateAction; -export const goForward: NavigateAction; - -interface RouteActions { - push: typeof push; - replace: typeof replace; - go: typeof go; - goForward: typeof goForward; - goBack: typeof goBack; -} - -export const routerActions: RouteActions; - -export interface RouterState { - locationBeforeTransitions: Location; -} - -export type DefaultSelectLocationState = (state: any) => RouterState; - -export interface SyncHistoryWithStoreOptions { - selectLocationState?: DefaultSelectLocationState; - adjustUrlOnReplay?: boolean; -} - -export interface HistoryUnsubscribe { - unsubscribe(): void; -} - -export function routerReducer(state?: RouterState, action?: Action): RouterState; -export function syncHistoryWithStore(history: History, store: Store, options?: SyncHistoryWithStoreOptions): History & HistoryUnsubscribe; -export function routerMiddleware(history: History): Middleware; diff --git a/types/react-router-redux/react-router-redux-tests.tsx b/types/react-router-redux/react-router-redux-tests.tsx new file mode 100644 index 0000000000..cd2c42167d --- /dev/null +++ b/types/react-router-redux/react-router-redux-tests.tsx @@ -0,0 +1,46 @@ +import * as React from 'react' +import * as ReactDOM from 'react-dom' + +import { createStore, combineReducers, applyMiddleware, Reducer } from 'redux' +import { Provider } from 'react-redux' + +import createHistory from 'history/createBrowserHistory' +import { Route } from 'react-router' + +import { ConnectedRouter, routerReducer, routerMiddleware, push, RouterState } from 'react-router-redux' + +// Create a history of your choosing (we're using a browser history in this case) +const history = createHistory() + +// Build the middleware for intercepting and dispatching navigation actions +const middleware = routerMiddleware(history) + +interface State { + router: RouterState +} + +// For testing, assume the router reducer is the only sub-reducer: +const reducers: Reducer = combineReducers({router: routerReducer}) + +// Add the reducer to your store on the `router` key +// Also apply our middleware for navigating +const store = createStore( + reducers, + applyMiddleware(middleware) +) + +const Home = () =>
Home
+ReactDOM.render( + + { /* ConnectedRouter will use the store from Provider automatically */ } + +
+ +
+
+
, + document.getElementById('root') +) + +// Now you can dispatch navigation actions from anywhere! +store.dispatch(push('/foo')) diff --git a/types/react-router-redux/tsconfig.json b/types/react-router-redux/tsconfig.json index 7e9539f9dd..bd33709ea0 100644 --- a/types/react-router-redux/tsconfig.json +++ b/types/react-router-redux/tsconfig.json @@ -8,20 +8,17 @@ "noImplicitAny": true, "noImplicitThis": true, "strictNullChecks": true, + "jsx": "react", "baseUrl": "../", "typeRoots": [ - "../" + "../" ], - "paths": { - "history": ["history/v3"], - "history/*": ["history/v3/*"] - }, "types": [], "noEmit": true, "forceConsistentCasingInFileNames": true }, "files": [ "index.d.ts", - "react-router-redux-tests.ts" + "react-router-redux-tests.tsx" ] } diff --git a/types/react-router-redux/tslint.json b/types/react-router-redux/tslint.json index 377cc837d4..f05741c59b 100644 --- a/types/react-router-redux/tslint.json +++ b/types/react-router-redux/tslint.json @@ -1 +1,6 @@ -{ "extends": "../tslint.json" } +{ + "extends": "../tslint.json", + "rules": { + "forbidden-types": false + } +} diff --git a/types/react-router-redux/v4/index.d.ts b/types/react-router-redux/v4/index.d.ts new file mode 100644 index 0000000000..90d403da24 --- /dev/null +++ b/types/react-router-redux/v4/index.d.ts @@ -0,0 +1,63 @@ +// Type definitions for react-router-redux 4.0 +// Project: https://github.com/rackt/react-router-redux +// Definitions by: Isman Usoh , +// Noah Shipley , +// Dimitri Rosenberg , +// Karol Janyst , +// Dovydas Navickas +// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped +// TypeScript Version: 2.1 + +import { Action, Middleware, Store } from "redux"; +import { History, Location, LocationDescriptor } from "history"; + +export const CALL_HISTORY_METHOD: string; +export const LOCATION_CHANGE: string; + +export interface LocationActionPayload { + method: string; + args?: any[]; +} + +export interface RouterAction extends Action { + payload?: LocationActionPayload; +} + +type LocationAction = (nextLocation: LocationDescriptor) => RouterAction; +type GoAction = (n: number) => RouterAction; +type NavigateAction = () => RouterAction; + +export const push: LocationAction; +export const replace: LocationAction; +export const go: GoAction; +export const goBack: NavigateAction; +export const goForward: NavigateAction; + +interface RouteActions { + push: typeof push; + replace: typeof replace; + go: typeof go; + goForward: typeof goForward; + goBack: typeof goBack; +} + +export const routerActions: RouteActions; + +export interface RouterState { + locationBeforeTransitions: Location; +} + +export type DefaultSelectLocationState = (state: any) => RouterState; + +export interface SyncHistoryWithStoreOptions { + selectLocationState?: DefaultSelectLocationState; + adjustUrlOnReplay?: boolean; +} + +export interface HistoryUnsubscribe { + unsubscribe(): void; +} + +export function routerReducer(state?: RouterState, action?: Action): RouterState; +export function syncHistoryWithStore(history: History, store: Store, options?: SyncHistoryWithStoreOptions): History & HistoryUnsubscribe; +export function routerMiddleware(history: History): Middleware; diff --git a/types/react-router-redux/v4/package.json b/types/react-router-redux/v4/package.json new file mode 100644 index 0000000000..36ce503807 --- /dev/null +++ b/types/react-router-redux/v4/package.json @@ -0,0 +1,5 @@ +{ + "dependencies": { + "redux": "^3.6.0" + } +} diff --git a/types/react-router-redux/react-router-redux-tests.ts b/types/react-router-redux/v4/react-router-redux-tests.ts similarity index 100% rename from types/react-router-redux/react-router-redux-tests.ts rename to types/react-router-redux/v4/react-router-redux-tests.ts diff --git a/types/react-router-redux/v4/tsconfig.json b/types/react-router-redux/v4/tsconfig.json new file mode 100644 index 0000000000..83cf349881 --- /dev/null +++ b/types/react-router-redux/v4/tsconfig.json @@ -0,0 +1,28 @@ +{ + "compilerOptions": { + "module": "commonjs", + "lib": [ + "es6", + "dom" + ], + "noImplicitAny": true, + "noImplicitThis": true, + "strictNullChecks": true, + "baseUrl": "../../", + "typeRoots": [ + "../../" + ], + "paths": { + "history": ["history/v3"], + "history/*": ["history/v3/*"], + "react-router-redux": ["react-router-redux/v4"] + }, + "types": [], + "noEmit": true, + "forceConsistentCasingInFileNames": true + }, + "files": [ + "index.d.ts", + "react-router-redux-tests.ts" + ] +} diff --git a/types/react-router-redux/v4/tslint.json b/types/react-router-redux/v4/tslint.json new file mode 100644 index 0000000000..f05741c59b --- /dev/null +++ b/types/react-router-redux/v4/tslint.json @@ -0,0 +1,6 @@ +{ + "extends": "../tslint.json", + "rules": { + "forbidden-types": false + } +} From 56934db45996e0b665c7919d6c8d59bb44215a50 Mon Sep 17 00:00:00 2001 From: Huy Nguyen Date: Wed, 29 Mar 2017 10:17:39 -0400 Subject: [PATCH 2/6] Incorporate reviewer's suggest changes --- types/react-router-redux/index.d.ts | 12 +++++------- 1 file changed, 5 insertions(+), 7 deletions(-) diff --git a/types/react-router-redux/index.d.ts b/types/react-router-redux/index.d.ts index 5638b135b9..73be776ec5 100644 --- a/types/react-router-redux/index.d.ts +++ b/types/react-router-redux/index.d.ts @@ -15,7 +15,7 @@ import { Location, Path, LocationState, - LocationDescriptorObject + LocationDescriptor } from 'history'; import * as React from 'react'; @@ -25,7 +25,7 @@ export interface ConnectedRouterProps { } export class ConnectedRouter extends React.Component, {}> {} -export const LOCATION_CHANGE = '@@router/LOCATION_CHANGE' +export const LOCATION_CHANGE: string; export interface RouterState { location: Location | null @@ -33,12 +33,10 @@ export interface RouterState { export function routerReducer(state?: RouterState, action?: RouterAction): RouterState -export const CALL_HISTORY_METHOD = '@@router/LOCATION_CHANGE'; +export const CALL_HISTORY_METHOD: string; -export function push(path: Path, state?: LocationState): RouterAction -export function push(location: LocationDescriptorObject): RouterAction -export function replace(path: Path, state?: LocationState): RouterAction -export function replace(location: LocationDescriptorObject): RouterAction +export function push(location: LocationDescriptor, state?: LocationState): RouterAction +export function replace(location: LocationDescriptor, state?: LocationState): RouterAction export function go(n: number): RouterAction export function goBack(): RouterAction export function goForward(): RouterAction From ddb82936f24e432152620405d8a2e10ef86e921a Mon Sep 17 00:00:00 2001 From: Huy Nguyen Date: Mon, 3 Apr 2017 14:21:15 -0400 Subject: [PATCH 3/6] Fix lint errors --- types/react-router-redux/index.d.ts | 31 ++++++++++++++-------------- types/react-router-redux/tslint.json | 2 +- 2 files changed, 16 insertions(+), 17 deletions(-) diff --git a/types/react-router-redux/index.d.ts b/types/react-router-redux/index.d.ts index 73be776ec5..bebaab7562 100644 --- a/types/react-router-redux/index.d.ts +++ b/types/react-router-redux/index.d.ts @@ -20,26 +20,26 @@ import { import * as React from 'react'; export interface ConnectedRouterProps { - store?: Store, - history?: History + store?: Store; + history?: History; } export class ConnectedRouter extends React.Component, {}> {} export const LOCATION_CHANGE: string; export interface RouterState { - location: Location | null + location: Location | null; } -export function routerReducer(state?: RouterState, action?: RouterAction): RouterState +export function routerReducer(state?: RouterState, action?: RouterAction): RouterState; export const CALL_HISTORY_METHOD: string; -export function push(location: LocationDescriptor, state?: LocationState): RouterAction -export function replace(location: LocationDescriptor, state?: LocationState): RouterAction -export function go(n: number): RouterAction -export function goBack(): RouterAction -export function goForward(): RouterAction +export function push(location: LocationDescriptor, state?: LocationState): RouterAction; +export function replace(location: LocationDescriptor, state?: LocationState): RouterAction; +export function go(n: number): RouterAction; +export function goBack(): RouterAction; +export function goForward(): RouterAction; export const routerAction: { push: typeof push @@ -47,17 +47,16 @@ export const routerAction: { go: typeof go goBack: typeof goBack goForward: typeof goForward -} +}; export interface LocationActionPayload { - method: string, - args?: any[], + method: string; + args?: any[]; } export interface RouterAction extends Action { - type: typeof CALL_HISTORY_METHOD, - payload: LocationActionPayload + type: typeof CALL_HISTORY_METHOD; + payload: LocationActionPayload; } -export function routerMiddleware(history: History): Middleware - +export function routerMiddleware(history: History): Middleware; diff --git a/types/react-router-redux/tslint.json b/types/react-router-redux/tslint.json index f05741c59b..c6a89d14c7 100644 --- a/types/react-router-redux/tslint.json +++ b/types/react-router-redux/tslint.json @@ -1,6 +1,6 @@ { "extends": "../tslint.json", "rules": { - "forbidden-types": false + "banned-types": false } } From a2881ed1c74e80a165516683027296b255d015e6 Mon Sep 17 00:00:00 2001 From: Huy Nguyen Date: Tue, 4 Apr 2017 10:16:14 -0400 Subject: [PATCH 4/6] Fix lint errors --- .../react-router-redux-tests.tsx | 30 +++++++++---------- 1 file changed, 15 insertions(+), 15 deletions(-) diff --git a/types/react-router-redux/react-router-redux-tests.tsx b/types/react-router-redux/react-router-redux-tests.tsx index cd2c42167d..b6927fb7bf 100644 --- a/types/react-router-redux/react-router-redux-tests.tsx +++ b/types/react-router-redux/react-router-redux-tests.tsx @@ -1,35 +1,35 @@ -import * as React from 'react' -import * as ReactDOM from 'react-dom' +import * as React from 'react'; +import * as ReactDOM from 'react-dom'; -import { createStore, combineReducers, applyMiddleware, Reducer } from 'redux' -import { Provider } from 'react-redux' +import { createStore, combineReducers, applyMiddleware, Reducer } from 'redux'; +import { Provider } from 'react-redux'; -import createHistory from 'history/createBrowserHistory' -import { Route } from 'react-router' +import createHistory from 'history/createBrowserHistory'; +import { Route } from 'react-router'; -import { ConnectedRouter, routerReducer, routerMiddleware, push, RouterState } from 'react-router-redux' +import { ConnectedRouter, routerReducer, routerMiddleware, push, RouterState } from 'react-router-redux'; // Create a history of your choosing (we're using a browser history in this case) -const history = createHistory() +const history = createHistory(); // Build the middleware for intercepting and dispatching navigation actions -const middleware = routerMiddleware(history) +const middleware = routerMiddleware(history); interface State { - router: RouterState + router: RouterState; } // For testing, assume the router reducer is the only sub-reducer: -const reducers: Reducer = combineReducers({router: routerReducer}) +const reducers: Reducer = combineReducers({router: routerReducer}); // Add the reducer to your store on the `router` key // Also apply our middleware for navigating const store = createStore( reducers, applyMiddleware(middleware) -) +); -const Home = () =>
Home
+const Home = () =>
Home
; ReactDOM.render( { /* ConnectedRouter will use the store from Provider automatically */ } @@ -40,7 +40,7 @@ ReactDOM.render( , document.getElementById('root') -) +); // Now you can dispatch navigation actions from anywhere! -store.dispatch(push('/foo')) +store.dispatch(push('/foo')); From 32f8d75fdba1c1d5666f0c6782c2d656d67febf7 Mon Sep 17 00:00:00 2001 From: Huy Nguyen Date: Tue, 4 Apr 2017 12:01:19 -0400 Subject: [PATCH 5/6] Fix tslint config --- types/react-router-redux/tslint.json | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/types/react-router-redux/tslint.json b/types/react-router-redux/tslint.json index c6a89d14c7..f9e30021f4 100644 --- a/types/react-router-redux/tslint.json +++ b/types/react-router-redux/tslint.json @@ -1,6 +1,3 @@ { - "extends": "../tslint.json", - "rules": { - "banned-types": false - } + "extends": "../tslint.json" } From 05c43d5711f37984e9c36f289aba084bc0d3f5a4 Mon Sep 17 00:00:00 2001 From: Huy Nguyen Date: Tue, 4 Apr 2017 12:17:18 -0400 Subject: [PATCH 6/6] Fix lint errors --- types/react-router-redux/v3/index.d.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/types/react-router-redux/v3/index.d.ts b/types/react-router-redux/v3/index.d.ts index be706bdcc8..19473384a1 100644 --- a/types/react-router-redux/v3/index.d.ts +++ b/types/react-router-redux/v3/index.d.ts @@ -7,7 +7,6 @@ import * as Redux from "redux"; import * as History from "history"; - export const TRANSITION: string; export const UPDATE_LOCATION: string;