[docs] Reorganize the page menu

[alexfauquette]

To simplify the distinction between docs pages that are common to most of the components and the components themself, I propose to reorganize the menu. Part of #10075

Proposal

A first group "common feature" with most used features: validation, lifecycle, and shortcuts

Identify all components in a group

Replace the two accordion by a subsection

The diff

[mui-bot]

Netlify deploy preview

Netlify deploy preview: https://deploy-preview-10139--material-ui-x.netlify.app/

Updated pages

No updates.

These are the results for the performance tests:

Test case	Unit	Min	Max	Median	Mean	σ
Filter 100k rows	ms	-206.6	97.9	-83.7	-74.38	117.721
Sort 100k rows	ms	720.5	1,674.8	1,571.5	1,312.68	336.692
Select 100k rows	ms	747.7	991.9	812.4	848.32	85.298
Deselect 100k rows	ms	151	300.8	207.7	209.96	54.274

Generated by 🚫 dangerJS against 1ebf2c6

[flaviendelangle]

I like a lot the result 🤩

I don't know if Common features should be above or below Components
They are less used than some pages from Components so maybe we should keep the components on the top to make those pages as accessible as possible.

And how about moving Base concepts inside Common features?

[alexfauquette]

I don't know if Common features should be above or below Components

I think it depends for which audience we write it.

For new users, I believe Common before Components is better because it forces them to read it (at least the title) before finding the component. So they know those pages exist

For advanced users, the opposite feels more natural: components > features > API

And how about moving Base concepts inside Common features?

Not sure. For me up to "Base concepts" it is about pages you have to read before trying to use those components. Otherwise, you might spend some time lost. In common features, it's well-scoped features such as validation or shortcuts. If you don't need validation, you can skip this page.

[LukasTy]

The change looks great! 💯
My only concern is the vertical height, which no longer fits all the pickers menu items on a MacBook 16" screen.

I do agree with Flavien, IMHO, Common features would probably make more sense below the Components section. 👌
As for the Base Concepts, I'm not sure it needs to end up in the Common features section, especially if we move it below the components. 🤔

[alexfauquette]

My only concern is the vertical height, which no longer fits all the pickers menu items on a MacBook 16" screen.

I don't think it's an issue since it's just moving from "hidden by a click" to "hidden by scroll"

[noraleonte]

Super nice improvement! 🎉

I also think that Base concepts should live on the top of the menu, as an 'outline' of sorts that users would read before diving deep into the docs, not in Common features. So I think the current placement of thinks is 💯