How to group rows in Kendo UI Grid

I was able to do the following using kendo-ui-recat-wrapper to get a grouped Grid :

let dataSource = {   
  data: data,   
  schema: {
    model: {
      id: 'id',
      expanded: true
    }   
  },   
  group: [
    {
      field: 'title', // GroupBy goes on this field
      dir: 'asc'
    }   ] }

And Then I can pass this to the dataSource props of Grid.

I updated to kendo-react-grid it seems more coherent to use in a ReactJs project than the jquery wrapper.

But I didn't find how to get the same result ? There is no mention to the group option. Even here in DataState (link here) I didn't get how to use it ?!

EDIT : The option is not ready yet (Kendo ui React roadmap)

Currently, the native Kendo React Grid supports grouping. The syntax is different than as per the jquery wrapper (i.e. there is no dataSource prop) but I believe this is expected. Here is a simplified version of the official grouping example:

import { Grid, GridColumn as Column } from '@progress/kendo-react-grid';
import { groupBy } from '@progress/kendo-data-query';
import products from './products.json';

class App extends React.PureComponent {
    render() {
        return (
            <Grid
                groupable={true}
                group={[ { field: 'UnitsInStock' } ]}
                data={groupBy(products, [ { field: 'UnitsInStock' } ])}
            >
                <Column field="ProductID" title="ID" width="50px" />
                <Column field="ProductName" title="Product Name" />
                <Column field="UnitsInStock" title="Units In Stock" />
            </Grid>
        );
    }
}