Could you please make that codesandbox public?

Could you please make that codesandbox public?

opps, public now

All right ... thanks for opening it up.
It looks like the premium grid does not use the skeleton overlay by default.
If used with this slotProps entry ...

slotProps={{
  loadingOverlay: {
    variant: 'linear-progress',
    noRowsVariant: 'skeleton',
  },
}}

... it does.

@KenanYusuf what would you expect the default to be? We should definitely align the usage across the different versions!

Had a quick look, it's getting the correct loading variant, but the internal loading state on <DataGridPro /> is false which is why we see the "No rows" overlay. @MBilalShafi @arminmeh does anything spring to mind in the data source code?

It looks like that some other hook removes the data source's loading overlay.
Moving the hook in the premium package to be at the same position as in the pro package solves the issue.

But before any change, I would wait for the input from @MBilalShafi, since he recently moved this hook up (I assume to be before useGridAggregation)

I assume to be before useGridAggregation

Yes, initializing an aggregation model tries to compute the initial aggregation state which uses a data source API method (resolveGroupAggregation()), I think we could skip computing the aggregation values initially since the data from the API would not be available yet and it makes more sense to keep this computation event based.

The loading state has been reset by the useGridRows and moving the data source hook after it seems to resolve the issue, I've reverted the hooks' original order and set an empty value for the initialized aggregation model: #16282

@KenanYusuf @arminmeh Does - as an initial value looks good to you or would you recommend something like Loading... or an icon that depicts the value still being loaded?

Does - as an initial value looks good to you or would you recommend something like Loading... or an icon that depicts the value still being loaded?

Can we also have skeleton row pill in there?

Can we also have skeleton row pill in there?

Hmm, that could be a decent option indeed. Do you think it'll make sense to add on all the cells or only for the cells with aggregation values being loaded (like Commodities and Quantity in above SS)?

For all the cells, it would be more aligned with the design language of the page but it would also show pills for the cells that have no aggregation values.
For only the cells with aggregation values, it would correctly represent the cells that are loading but would look a bit less aligned with the design language of the page.

For me both are fine. If I have to choose, I would go with the pills only on the cells that will show the value

Can we also have skeleton row pill in there?

This would be ideal!

Do you think it'll make sense to add on all the cells or only for the cells with aggregation values being loaded

Generally, I don't think loading skeletons need to be super accurate representations of the data that is loading, but since we know which columns have aggregated values and we are already showing a partial loaded state with the column title and aggregation label, I would go for only showing it in cells with aggregation values.