[data grid] Date selector in date column filter inconsistent with date picker component

[olivier-g74]

When I want to select a date Value in the filter modal after the Operator (is, is not, is after...), I have 2 options:

• a date field dd/mm/yyyy
• a grey calendar icon blank, that turns black (calendarIcon) on hover and when clicked opens THE DEFAULT BROWSER date picker in the default color or theme of the browser

Basic Date Picker, which we use on the same page, has also a grey calendar icon with a day square, but on hover gets a circle focus, and when clicked offers a much nicer looking calendar in the color and theme of the rest of the components.

Can the components Basic Date Picker be used as well in the filter modal to retain a similar style and experience overall? Thank you

Search keywords:

[michelengelen]

Thanks @olivier-g74 ... this is indeed an inconsistency we can prevent. I know that the team just recently had a discussion if an update to the filterpanel UI is overdue (sparked by @romgrk ✨).

I have put it on the board for the team to discuss! Thanks again! 🙇🏼

[olivier-g74]

Dear Michel, Unfortunately the inconsistency still persists in v.7.1.0 (https://mui.com/x/react-data-grid/filtering/) Is there any specific timeline regarding streamlining the views across the different cases (base date pick component and date picker as filter or qualifier within other components). Thanks a lot for keeping us posted!

[michelengelen]

Is there any specific timeline regarding streamlining the views across the different cases (base date pick component and date picker as filter or qualifier within other components).

Not yet unfortunately. We will keep posting updates here once we get to work on this. I fear that the filterPanel UI rework is a bit complex and might take a while longer. Sry!

[cherniavskii]

Hi @olivier-g74 You can use date and time pickers in the data grid following the recipe in https://mui.com/x/react-data-grid/custom-columns/#date-pickers