[docs] Uplift SimpleTreeView customization examples

[noraleonte]

• [ x] I have followed (at least) the PR section of the contributing guide.

Changes:

• Cleaned up existing Custom icons, borders and animation demo -> split into more modular demos, highlighting each customization and gradually building up a more complex customized Tree View
• Added new demo
• Adjusted gmail clone demo (dark mode especially)

Preview:

https://deploy-preview-11424--material-ui-x.netlify.app/x/react-tree-view/simple-tree-view/customization/

[mui-bot]

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

Updated pages:

• docs/data/tree-view/simple-tree-view/customization/customization.md

Generated by 🚫 dangerJS against 6e2186a

[flaviendelangle]

That's a big improvement over the current doc 👌

I liked a lot the "Adding borders" demo which is probably a very common use case

I'm not a fan of the "Customizing for complex use cases" demo because it's a demo that display the power of our component when the others focus on a specific use-case.
Same for the Gmail clone.
I like a lot the idea to try to build some very appealing Tree View to show that it can be done with our component, but I would separate them for the more API focused demos (that would always use the same data set and focus only on a specific change like the border or the animation).
And probably always name them from the UI we are implementing (a mail client, a file explorer etc...) instead of "rich" or "complex' or "advanced" which do not bring a lot of value IMHO

[danilo-leal]

This is looking great, Nora — nice work! 👏 Just left a few notes about writing & the designs.

[github-actions]

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

[zanivan]

Hey, nice work @noraleonte!

Echoing Flavien, I think the demos, though look nice, could be better placed or organized. I wonder if we could add an item such as "Customization" or "Styling" to the menu instead adding these demos to Overview, where we can populate it with demos and a playground in the future, like the styling page from Charts.
Other example is how we do on Joy UI to showcase these complex demos, by the common examples section in the end of the page.

[flaviendelangle]

I wonder if we could add an item such as "Customization" or "Styling" to the menu instead adding these demos to Overview

This will be the case once the PR is merged with next

[danilo-leal]

Looking awesome, Nora — thanks for bearing with us on the review!
Just a round of fine-tune stuff :)

[flaviendelangle]

Awesome improvements of the doc!

[danilo-leal]

Just a last round of touch-ups, but already dropping an approval! :)
Great work, Nora—thanks for pushing through!