[code-infra] Simplify bug reproduction

[oliviertassinari]

It's not directly linked to the milestone of moving from CodeSandbox to StackBlitz but still is directly connected. It's complex to have to manage CodeSandbox templates, I believe we can simplify the contribution experience by heavily relying on demo forks. The combinator to support with CodeSandbox templates is high (Material UI / Base UI / Joy UI, Pro / MIT, Date Picker / Data Grid, TypeScript/JavaScript)

Preview: https://deploy-preview-11849--material-ui-x.netlify.app/x/introduction/support/#bug-reproductions (image fixed from mui/material-ui#40833)

[mui-bot]

Deploy preview: https://deploy-preview-11849--material-ui-x.netlify.app/

Updated pages:

• docs/data/introduction/support/support.md

Generated by 🚫 dangerJS against f3dba0e

[github-actions]

This pull request has conflicts, please resolve those before we can evaluate the pull request.

[romgrk]

I think having the links directly in the issue template is faster, there is no need to click & load another page. It's also nice to have the code template because it doesn't require to search through the docs, users can just insert their code directly.

[oliviertassinari]

users can just insert their code directly.

This sandbox to be most helpful needs the user:

• to use the Pro plan
• to use the Data Grid
• to use TypeScript
• to use Material UI

I'm not sure it's so frequent. The docs support a lot of combinatory.

[romgrk]

The packages for community & premium are installed in the template, we could add commented lines like:

// Uncomment the line that applies
// import { DataGrid as DataGrid } from 'x-data-grid'
// import { DataGridPro as DataGrid } from 'x-data-grid-pro'
// import { DataGridPremium as DataGrid } from 'x-data-grid-premium'

And MUI & typescript are the most common choices. If I was a user, I feel like I would be more satisfied to have the template available right there rather than to have to go through multiple pages/links. I think the other packages (charts, pickers, tree-view) should also include a link like this one in this section. It also already works as-is with stackblitz.

[oliviertassinari]

I have tried an alternative tradeoff, keeping this bug reproduction template.

// Uncomment the line that applies

I don't believe developers follow this flow. I don't recall the last time I wrote data grid code from scratch, I always copied it from my own codebase or from the docs. I don't know the API well enough, maybe it's possible for developers who use this all day. My guess is that developers if they report a bug, they likely hit an edge case that isn't straight to reproduce. I mean, if it's straight to reproduce, then forking a demo of the docs sounds fast, if it's complex, then likely you would copy and paste your codebase.

[romgrk]

I don't believe developers follow this flow. I don't recall the last time I write data grid code from scratch, I always copied it from my own codebase or from the docs.

Very true.

I still think less clicks is a better UX, but I don't open that many issues with the templates so I'm fine with this change as it is.

[michelengelen]

Just a few nits in the wording... feel free to ignore.

[oliviertassinari]

The image is broken, but will work once a new Core release is made. I will cherry pick it. This gets cherry picked in MUI X v6 as well for the GitHub issue template link to work.

[oliviertassinari]

It's live: https://mui.com/x/introduction/support/#bug-reproductions

[alexfauquette]

It's live: mui.com/x/introduction/support/#bug-reproductions

I've open cherry-pick request to avoid overriding it during the git push force of the docs deployement

#11932