Merge pull request #158 from macrozone/f/add-router

add router to init function

README.md

@@ -96,7 +96,8 @@ Now your page can use anything from `@apollo/react-hooks` or `react-apollo`. If
 
 - `ctx` - This is the [context object](https://nextjs.org/docs/api-reference/data-fetching/getInitialProps#context-object) sent by Next.js to the `getInitialProps` of your page. It's only available for SSR, in the client it will be `undefined`
 - `initialState` - If `getDataFromTree` is sent, this will be the initial data required by the queries in your page, otherwise it will be `undefined`
-- `headers` - This is `ctx.req.headers`, in the client it will be `undefined`.
+- `headers` - This is `ctx.req.headers`, in the client it will be `undefined`
+- `router` - This is the `router` object sent by `getInitialProps`. Only available in the server and when using `getInitialProps`
 
 The second, optional parameter, received by `withApollo`, is an `object` with the following props:
 

src/types.ts

@@ -2,6 +2,7 @@ import ApolloClient from 'apollo-client';
 import { IncomingHttpHeaders } from 'http';
 import { NextPage, NextPageContext } from 'next';
 import { AppContext } from 'next/app';
+import { NextRouter } from 'next/dist/client/router';
 import { ReactNode } from 'react';
 
 export interface WithApolloOptions {
@@ -20,11 +21,13 @@ export interface WithApolloState<TCache> {
 export interface WithApolloProps<TCache> {
   apolloState: WithApolloState<TCache>;
   apollo: ApolloClient<TCache>;
+  router: NextRouter;
 }
 
 export interface InitApolloOptions<TCache> {
   ctx?: NextPageContext;
   headers?: IncomingHttpHeaders;
+  router?: NextRouter;
   initialState?: TCache;
 }
 

src/withApollo.tsx

@@ -33,10 +33,18 @@ export default function withApollo<TCache = any>(
     const render = pageOptions.render || options.render;
     const onError = pageOptions.onError || options.onError;
 
-    function WithApollo({ apollo, apolloState, ...props }: ApolloProps) {
+    function WithApollo({
+      apollo,
+      apolloState,
+      router,
+      ...props
+    }: ApolloProps) {
       const apolloClient =
         apollo ||
-        initApollo<TCache>(client, { initialState: apolloState?.data });
+        initApollo<TCache>(client, {
+          initialState: apolloState?.data,
+          router: router
+        });
 
       if (render) {
         return render({
@@ -53,9 +61,14 @@ export default function withApollo<TCache = any>(
     if (getInitialProps || getDataFromTree) {
       WithApollo.getInitialProps = async (pageCtx: ApolloContext) => {
         const ctx = 'Component' in pageCtx ? pageCtx.ctx : pageCtx;
+        const router = 'Component' in pageCtx ? pageCtx.router : undefined;
         const { AppTree } = pageCtx;
         const headers = ctx.req ? ctx.req.headers : {};
-        const apollo = initApollo<TCache>(client, { ctx, headers });
+        const apollo = initApollo<TCache>(client, {
+          ctx,
+          headers,
+          router
+        });
         const apolloState: WithApolloState<TCache> = {};
 
         let pageProps = {};
@@ -79,7 +92,7 @@ export default function withApollo<TCache = any>(
               await getDataFromTree(<AppTree {...appTreeProps} />);
             } catch (error) {
               if (onError) {
-                onError(error, ctx);
+                onError(error as Error, ctx);
               } else {
                 // Prevent Apollo Client GraphQL errors from crashing SSR.
                 if (process.env.NODE_ENV !== 'production') {