[studio] Data grid density issue

[oliviertassinari]

Steps to reproduce

The current row height for the different density settings looks odd. They were first defined with mui/mui-x#567 but they don't seem to work super great. It feels like everything is so big, for example, no mui/mui-public#211, this is not compact, this feels medium size:

A quick benchmark:

	-1	Default	+1
Elastic	23px	35px	39px
Gmail	28px	40px
Airtable	31px	55px	87px
MUI X	36px (x0.7)	52px (MD spec)	67px (x1.3)

I'm not super clear on either the issue is rooted in Toolpad. It could be the default values of MUI X that are too big, but they are following the Material Design spec, so hard to argue for a change.

At the end of the day, I suspect that it's a problem with Material UI. We should fix mui/material-ui#41579, which Toolpad could then leverage.

Current behavior

No response

Expected behavior

No response

cc @KenanYusuf for awareness.

[KenanYusuf]

I'm not super clear on either the issue is rooted in Toolpad. It could be the default values of MUI X that are too big, but they are following the Material Design spec, so hard to argue for a change.

I agree that it is hard to argue a change for the defaults in MUI X, given they follow the spec. The density can look off based on row content. I would suggest adjusting the rowHeight value on the data grid in Toolpad to suit the use cases there.

At the end of the day, I suspect that it's a problem with Material UI. We should fix mui/material-ui#41579, which Toolpad could then leverage.

This is a really nice suggestion. We could have a global density setting that applies to all Material UI components (including data grid) which can be overwritten on a per-component basis.