Invalid hook call

If you use this component:

https://github.com/mui-org/material-ui/tree/master/docs/src/pages/getting-started/page-layout-examples/album

With this example project:

https://github.com/mui-org/material-ui/tree/master/examples/nextjs

You get:

Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app

How do we fix?

[sorleone]

@oliviertassinari I don’t have another computer, but I can add that the problem shows up here:

./pages/_document.js:60

   7 | const sheets = new ServerStyleSheets();
  58 | const originalRenderPage = ctx.renderPage;
  59 | 
> 60 | ctx.renderPage = () =>
  61 |   originalRenderPage({
  62 |     enhanceApp: App => props => sheets.collect(<App {...props} />),
  63 |   });

and if you remove everything from the bottom up to and including this line, it goes away.

[cdll]

same issue with Stepper component