diff --git a/components/AppContext.ts b/components/AppContext.ts new file mode 100644 index 0000000..5274cac --- /dev/null +++ b/components/AppContext.ts @@ -0,0 +1,10 @@ +import { NextDocumentContext } from "next/document" +import { Store } from "redux" + +/** + * NextDocumentContext with redux store context + * @tree + */ +export type AppContext = NextDocumentContext & { + readonly store: Store +} diff --git a/pages/_document.tsx b/pages/_document.tsx index ae4ead9..d6be50f 100644 --- a/pages/_document.tsx +++ b/pages/_document.tsx @@ -1,9 +1,10 @@ -import { ServerStyleSheets } from "@material-ui/styles" -import Document, { Head, Main, NextScript } from "next/document" -import React from "react" -import flush from "styled-jsx/server" -import { MuiTheme } from "../components/MuiTheme" -import "../styles/main.css" +import { ServerStyleSheets } from "@material-ui/styles"; +import Document, { Head, Main, NextScript } from "next/document"; +import React from "react"; +import flush from "styled-jsx/server"; +import { AppContext } from "../components/AppContext"; +import { MuiTheme } from "../components/MuiTheme"; +import "../styles/main.css"; interface IProps { pageProps: any @@ -13,7 +14,7 @@ interface IProps { * @see https://github.com/mui-org/material-ui/blob/master/examples/nextjs-with-typescript/pages/_document.tsx */ class MyDocument extends Document { - static getInitialProps = async ctx => { + static getInitialProps = async (ctx: AppContext) => { // Render app and page and get the context of the page with collected side effects. const sheets = new ServerStyleSheets() diff --git a/pages/about.tsx b/pages/about.tsx index 9935d5f..550f7ab 100644 --- a/pages/about.tsx +++ b/pages/about.tsx @@ -1,6 +1,7 @@ import { Typography } from "@material-ui/core" import { createStyles, makeStyles, Theme } from "@material-ui/core/styles" import React from "react" +import { AppContext } from "../components/AppContext" import { SpacingPaper } from "../components/atoms" import { HeaderArticleContainer } from "../components/organisms" import { Layout } from "../components/templates" @@ -29,7 +30,7 @@ function About() { /** * Server side rendering */ -About.getInitialProps = async ctx => { +About.getInitialProps = async (ctx: AppContext) => { const pagePayload: IPagePayload = { selectedPage: Page.ABOUT, } diff --git a/pages/redux.tsx b/pages/redux.tsx index 01b5378..dd471db 100644 --- a/pages/redux.tsx +++ b/pages/redux.tsx @@ -8,6 +8,7 @@ import { import { createStyles, makeStyles, Theme } from "@material-ui/core/styles" import React, { useState } from "react" import { useDispatch, useSelector } from "react-redux" +import { AppContext } from "../components/AppContext" import { SpacingPaper } from "../components/atoms" import { HeaderArticleContainer } from "../components/organisms" import { Layout } from "../components/templates" @@ -121,7 +122,7 @@ function Redux() { /** * Server side rendering */ -Redux.getInitialProps = async ctx => { +Redux.getInitialProps = async (ctx: AppContext) => { const pagePayload: IPagePayload = { selectedPage: Page.REDUX, }