Merge pull request #15462 from huy-nguyen/add-react-router-redux-v5

Add type definition for react-router-redux v5

types/react-router-redux/index.d.ts

@@ -1,18 +1,53 @@
-// Type definitions for react-router-redux 4.0
-// Project: https://github.com/rackt/react-router-redux
-// Definitions by: Isman Usoh <http://github.com/isman-usoh>
-//                 Noah Shipley <https://github.com/noah79>
-//                 Dimitri Rosenberg <https://github.com/rosendi>
-//                 Karol Janyst <https://github.com/LKay>
-//                 Dovydas Navickas <https://github.com/DovydasNavickas>
+// 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 <https://github.com/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,
+    LocationDescriptor
+} from 'history';
+import * as React from 'react';
+
+export interface ConnectedRouterProps<State> {
+    store?: Store<State>;
+    history?: History;
+}
+export class ConnectedRouter<State> extends React.Component<ConnectedRouterProps<State>, {}> {}
+
+export const LOCATION_CHANGE: string;
+
+export interface RouterState {
+    location: Location | null;
+}
+
+export function routerReducer(state?: RouterState, action?: RouterAction): RouterState;
 
 export const CALL_HISTORY_METHOD: string;
-export const LOCATION_CHANGE: 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 const routerAction: {
+    push: typeof push
+    replace: typeof replace
+    go: typeof go
+    goBack: typeof goBack
+    goForward: typeof goForward
+};
 
 export interface LocationActionPayload {
     method: string;
@@ -20,44 +55,8 @@ export interface LocationActionPayload {
 }
 
 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 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<any>, options?: SyncHistoryWithStoreOptions): History & HistoryUnsubscribe;
 export function routerMiddleware(history: History): Middleware;

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<State> = combineReducers<State>({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 = () => <div>Home</div>;
+ReactDOM.render(
+  <Provider store={store}>
+    { /* ConnectedRouter will use the store from Provider automatically */ }
+    <ConnectedRouter history={history}>
+      <div>
+        <Route exact path="/" component={Home}/>
+      </div>
+    </ConnectedRouter>
+  </Provider>,
+  document.getElementById('root')
+);
+
+// Now you can dispatch navigation actions from anywhere!
+store.dispatch(push('/foo'));

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"
     ]
 }

types/react-router-redux/tslint.json

@@ -1 +1,3 @@
-{ "extends": "../tslint.json" }
+{
+    "extends": "../tslint.json"
+}

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;
 

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 <http://github.com/isman-usoh>,
+//                 Noah Shipley <https://github.com/noah79>,
+//                 Dimitri Rosenberg <https://github.com/rosendi>,
+//                 Karol Janyst <https://github.com/LKay>,
+//                 Dovydas Navickas <https://github.com/DovydasNavickas>
+// 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<any>, options?: SyncHistoryWithStoreOptions): History & HistoryUnsubscribe;
+export function routerMiddleware(history: History): Middleware;

types/react-router-redux/v4/package.json

@@ -0,0 +1,5 @@
+{
+  "dependencies": {
+    "redux": "^3.6.0"
+  }
+}

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"
+    ]
+}

types/react-router-redux/v4/tslint.json

@@ -0,0 +1,6 @@
+{
+    "extends": "../tslint.json",
+    "rules": {
+        "forbidden-types": false
+    }
+}