Material-ui: [docs] makeStyles demo is broken

[joshwooding]

• [x] This is not a v0.x issue.
• [x] I have searched the issues of this repository and believe that this is not a duplicate.

Expected Behavior 🤔

makeStyles() codesandbox demo should work

Current Behavior 😯

It currently errors with: _react.default.useContext is not a function

Steps to Reproduce 🕹

Link: https://codesandbox.io/s/0mpw102k00

Your Environment 🌎

| Tech | Version |
|--------------|---------|
| Material-UI | v3.5.1 |
| React | |
| Browser | |
| TypeScript | |
| etc. | |

Demo needs to be updated to use react 16.7.0 alpha

[oliviertassinari]

Demo needs to be updated to use react 16.7.0 alpha

@joshwooding Run warn and you should be good: https://github.com/mui-org/material-ui/blob/46cb140174ae40c4751cb49326157dc7fc499955/package.json#L131

[joshwooding]

@oliviertassinari https://codesandbox.io/s/0mpw102k00 I meant this demo. The docs demo works fine but the edit in codesandbox doesn't work

[oliviertassinari]

@joshwooding Oh right, people can't just click on the edit button, they also have to change the react version:

{
  "title": "Material demo",
  "description": "https://github.com/mui-org/material-ui/blob/master/docs/src/pages/css-in-js/basics/Hook.js",
  "dependencies": {
-   "react-dom": "latest",
-   "react": "latest",
+   "react-dom": "next",
+   "react": "next",
    "@material-ui/styles": "latest",
    "@material-ui/core": "latest"
  }
}

[oliviertassinari]

We can add an option for it, like this:

-{{"demo": "pages/css-in-js/basics/StyledComponents.js"}}
+{{"demo": "pages/css-in-js/basics/StyledComponents.js", "react": "next"}}

[oliviertassinari]

@joshwooding What do you think? Do you want to handle it? :)

[joshwooding]

@oliviertassinari I can have a go :)

[mkaschke]

@joshwooding - the Demo is still not working "_react.default.useContext is not a function"

[joshwooding]

@mkaschke The makeStyles demo works for me https://codesandbox.io/s/ywj9v6lz9v
There's a reported issue with the other hook demos that should be fixed soon https://github.com/mui-org/material-ui/issues/14063

[oliviertassinari]

@mkaschke _react.default.useContext is not a function means that your React version doesn't support Hooks.

[mkaschke]

@joshwooding - your link works fine but the link on https://material-ui.com/demos/app-bar/ (under App Bar with menu) -> https://codesandbox.io/s/5kro05m06l is not working

[mkaschke]

@oliviertassinari - thank you for your answer, I already fixed it for my project.