[data grid] When using aggregations, UI of column header labels doesn't look good

[stivluc]

Steps to reproduce

Example in this image, using SUM for the "Colis" column.

Example when using density = 'standard':

Current behavior

The aggregation column header label overlaps the field name when the grid density is compact.

Expected behavior

It should look the same as when using density standard, maybe with less padding / margin.

Context

No response

Your environment

npx @mui/envinfo

  System:
    OS: Windows 10 10.0.19045
  Binaries:
    Node: 22.6.0 - C:\Program Files\nodejs\node.EXE
    npm: 10.8.2 - C:\Program Files\nodejs\npm.CMD
    pnpm: Not Found
  Browsers:
    Chrome: Not Found
    Edge: Chromium (127.0.2651.98)
  npmPackages:
    @emotion/react: ^11.10.6 => 11.13.3
    @emotion/styled: ^11.10.6 => 11.13.0
    @mui/base:  5.0.0-beta.40
    @mui/core-downloads-tracker:  5.16.7
    @mui/icons-material: ^5.11.16 => 5.16.7
    @mui/lab: ^5.0.0-alpha.126 => 5.0.0-alpha.173
    @mui/material: ^5.12.0 => 5.16.7
    @mui/private-theming:  5.16.6
    @mui/styled-engine:  5.16.6
    @mui/system:  5.16.7
    @mui/types:  7.2.15
    @mui/utils:  5.16.6
    @mui/x-data-grid:  6.20.4
    @mui/x-data-grid-premium: ^6.19.6 => 6.20.4
    @mui/x-data-grid-pro:  6.20.4
    @mui/x-date-pickers: ^6.18.2 => 6.20.2
    @mui/x-date-pickers-pro: ^6.19.5 => 6.20.2
    @mui/x-license-pro:  6.10.2
    @types/react:  18.3.4
    react: 18.2.0 => 18.2.0
    react-dom: 18.2.0 => 18.2.0
    typescript:  5.5.4

Search keywords: UI Header Labels Aggregations
Order ID: 80196

[michelengelen]

We are currently working on a rebrush of the header cells and changes to the aggregation view are included afaik.
@KenanYusuf could you elaborate a bit on it, since you have the most information on this atm?

[michelengelen]

@stivluc could you re-upload the second screenshot? It seems it hasn't completed uploading it!

[KenanYusuf]

Hi @stivluc. We updated the header design in v7.16.0, fixing this issue as part of the changes. If you are able to upgrade, you should get an improved experience with aggregation labels.

[github-actions]

The issue has been inactive for 7 days and has been automatically closed.