[DataGrid] Wrap column menu button with a tooltip

[cherniavskii]

Closes #7877

[mui-bot]

Netlify deploy preview

Netlify deploy preview: https://deploy-preview-7890--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	620.7	1,013.5	712	839.64	150.807
Sort 100k rows	ms	724.8	1,401.7	1,401.7	1,088.28	234.254
Select 100k rows	ms	254.9	400.2	299.9	307.5	49.359
Deselect 100k rows	ms	184.4	391.1	255.8	264.18	72.512

Generated by 🚫 dangerJS against 81ffbb9

[MBilalShafi]

Is this delay a little bit above the user's expectation? As it's supposed to work in place of the default HTML tooltip which I guess is 0.3-0.5 seconds, do you think the delay should be set to a smaller number?

The MUI Tooltip also has a default delay of 0.1s and material design shows a minor delay in the image.

The same (1s) is the case for the filter button tooltip though (maybe there was a reason behind that which I am not aware of 🤔 )

[cherniavskii]

Yep, I used the same delay that was being used for the filter button tooltip.
I'm not sure why this exact value was used, maybe to simulate the behavior of aria-label that is not shown immediately, but after a delay?

[MBilalShafi]

Probably somewhere around the default delay for HTML title attribute (0.3-0.5 seconds) would be closer to a normal user's expectation.
Not a big deal though. Being consistent with the filter button tooltip also seems fine to me.

[cherniavskii]

Probably somewhere around the default delay for HTML title attribute (0.3-0.5 seconds) would be closer to a normal user's expectation.

Maybe it depends on the browser, but in Chromium, it seems to be more than 0.5s:

Screen.Recording.2023-04-05.at.19.06.43.mov