Created
April 15, 2019 09:50
-
-
Save Irrelon/e764fa2e9fb0290562b20407893127ff to your computer and use it in GitHub Desktop.
./hoc/getPageContext.js for material-ui support in next.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import {SheetsRegistry} from 'jss'; | |
import {createGenerateClassName} from '@material-ui/core/styles'; | |
import { createMuiTheme } from '@material-ui/core/styles'; | |
const theme = createMuiTheme({ | |
typography: { | |
useNextVariants: true | |
} | |
}); | |
const createPageContext = () => ({ | |
theme, | |
// This is needed in order to deduplicate the injection of CSS in the page. | |
sheetsManager: new Map(), | |
// This is needed in order to inject the critical CSS. | |
sheetsRegistry: new SheetsRegistry(), | |
// The standard class name generator. | |
generateClassName: createGenerateClassName() | |
}); | |
export default function getPageContext () { | |
// Make sure to create a new context for every server-side request so that data | |
// isn't shared between connections (which would be bad). | |
if (!process.browser) { | |
return createPageContext(); | |
} | |
// Reuse context on the client-side. | |
/* eslint-disable no-underscore-dangle */ | |
if (!global.__INIT_MATERIAL_UI__) { | |
global.__INIT_MATERIAL_UI__ = createPageContext(); | |
} | |
return global.__INIT_MATERIAL_UI__; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment