Creating new Type Definitions for react-router-relay

Question

I want to create Typescript definitions for react-router-relay but the extending nature of react-router-relay is giving me a hard time. react-router is exposing a Router Component with some properties, also including a render property. react-router-relay uses this render property to supply Router with middleware. After this Router also accepts a environment property at which Relay can be given.

How do I tell typescript that in my module react-router-relay I extend the definitions of module react-router?

I tried following, but then I would have to copy every component of react-router:

declare module "react-router-relay" {
    import {Middleware} from "react-router/lib/applyRouterMiddleware";
    import Router from "react-router/lib/Router";
    import self from "react-router/lib/Route";

    const RelayMiddleware:Middleware;
    export default RelayMiddleware;

    export interface RelayRouter extends React.ComponentClass<RelayRouterProps> { }

    interface RelayRouterProps extends Router.RouterProps {
        render?(...middlewares: any[]): any
        environment?: any
    }

    namespace Route {
        import RouteProps = self.RouteProps;
        export interface RelayRouterProps extends RouteProps {
            name?: string;
            queries?: any;
            render(props: any): React.Component<any, any>
        }
    }
}

Is it also possible to only extend the RouterProps and RouteProps of react-router directly?

Edit: router-relay is applied like:

import useRelay from 'react-router-relay';
...
<Router
    history={browserHistory}
    routes={routes}
    render={applyRouterMiddleware(useRelay)}
    environment={Relay.Store}
/>

Does react-router-relay actually augment all entities produced/exposed from react-router, or does it wrap them on its own? — Daniel Rosenwasser, Nov 06 '16 at 18:51
(see edit). No it does not wrap them :( When you apply the middleware all react-router components like Router, Route, IndexRoute are enhanced by new properties from router-relay. — velop, Nov 06 '16 at 20:12
@Peeter As no one could give me an answer I went with `const RelayRoute: any = Route; const RelayIndexRoute: any = IndexRoute;` — velop, Dec 10 '16 at 18:02
I asked a question on stackoverflow myself without any luck: http://stackoverflow.com/questions/41103720/augment-react-router-module-with-react-router-relay-typings — Peeter, Dec 13 '16 at 08:14

Creating new Type Definitions for react-router-relay

0 Answers0