Support more data types in data grid

[prakhargupta1]

Duplicates

• I have searched the existing issues

Latest version

• I have tested the latest version

Summary 💡

Our data grid (in Toolpad) currently supports 5 data types namely:

1. Boolean
2. Date
3. Date time
4. String
5. Number

But Retool supports 20 data types, Appsmith supports 9.

We could add:

• A Link column type. Requested in Umbrella: feedback building GitHub supports tools #1163
• A Custom component column type. Support custom column type in data grid #1174

Examples 🌈

• created_at column here is being read properly in Retool but not in Toolpad

[prakhargupta1]

There are fields like action button, URL, image, video, but we can look into it when the need comes.

[prakhargupta1]

I am including it in the next sprint. We can start with link, image column types.

[apedroferreira]

@prakhargupta1 I understand that these columns types are not natively supported by the MUI X Data Grid, correct?

So if we implement these new column types they will be something that Toolpad is adding on top of the MUI X Data Grid, not a feature of the data grid itself.
Just clarifying that as I'm not sure if there would be any interest for the MUI X team in adding these column types natively to the data grid.

[prakhargupta1]

Found the same info here: https://mui.com/x/react-data-grid/column-definition/#column-types

@joserodolfofreitas This issue is about supporting more column types like link, image and even a custom component in the data grid. Aren't these natively supported?

[apedroferreira]

Just to clarify: I can add all these column types to the grid on Toolpad if they're something we want, it shouldn't be that hard.
The "custom component" column type for example will be something unique to Toolpad, obviously.
As for link and image, I'm just noting that they could be features that the Datagrid already has, but if the MUI X team has no plans to add them I can just create them in Toolpad.

[joserodolfofreitas]

This issue is about supporting more column types like link, image and even a custom component in the data grid. Aren't these natively supported?

We don't support those out-of-the-box, but you can create customizations.

Generally speaking, a link, image or something alike would usually only have a different render, but would most likely operate as strings internally.
In the Data Grid, being a column type has several implications, like how it behaves on filtering, sorting, editing or aggregation, for instance.

[joserodolfofreitas]

I think this level of abstraction makes sense on toolpad, but I'm not so sure in the Data Grid because of the implications I mentioned above, but I'm curious to see how this custom columns get implemented.
Perhaps it'd make sense somehow to incorporate into the Data Grid later (even if it's as "recipes" on the docs).

[Janpot]

@apedroferreira fyi, we already have some customizations: https://github.com/mui/mui-toolpad/blob/920d5fb439cd5512d0414c65c27ee6016868b9f4/packages/toolpad-components/src/DataGrid.tsx#L134

[apedroferreira]

Sounds good, will add on Toolpad. Just making sure!

[Janpot]

I'm adding number formatting in #1449