[DataGrid] Add Filter Panel delete icon slot

[Hameezr]

Fix #4063

[mui-bot]

These are the results for the performance tests:

Test case	Unit	Min	Max	Median	Mean	σ
Filter 100k rows	ms	232.2	421.4	376.5	333.44	79.967
Sort 100k rows	ms	409.4	927.1	763.1	741.36	183.125
Select 100k rows	ms	168.7	267.1	198.8	208.2	33.247
Deselect 100k rows	ms	133.9	300.4	211.3	204.32	56.861

Generated by 🚫 dangerJS against 958ee5b

[alexfauquette]

Thanks for the contribution, I updated your message such that when merging this PR it closes the related issue. Here is the list of keywords to link PR to issue

[alexfauquette]

Removing the fontSize="small" prop modify the default appearance of the icon

New icon

Previouse icon

[Hameezr]

I've added a conditional logic to fix this issue but I believe that's not the best approach, since icons are used directly from svg's and there could be a component to render the icons, used globally with props such as size and etc.

[Hameezr]

I have a suggested approach for using the icons more efficiently in my mind, but that'll require some time since they're being used in a lot of places. I'll create a separate PR for that once I'm able to figure out the best approach

[alexfauquette]

I merged master such that we can check the icon is still the same (I added a test to catch this regression)

[alexfauquette]

Why using rootProps.components.FilterPanelDeleteIcon?.name as a criterion? Any icon created by createSvgIcon() will have a name.

A simpler solution would be to set <rootProps.components.FilterPanelDeleteIcon fontSize="small" />

The drawback is that all the icons will receive the prop fontSize="small" with no way to change it.

If developers want to use big icons, they can ignore the prop as follow:

const MyBigIcon = () => <CloseIcon fontSize="large" />

<DataGrid components={{ FilterPanelDeleteIcon: MyBigIcon }} />

@Hameezr Does that sound good to you?

[Hameezr]

Yes, this will solve the problem and add some customizability as well! Thanks for the suggestion, will make this change

[alexfauquette]

Thanks for your contribution, this feature will be available in next release :)