chore: update grid props

Author: silviyaboteva

examples/kendo-react-ssr/package.json

@@ -6,12 +6,12 @@
     "@babel/preset-env": "^7.23.5",
     "@babel/preset-react": "^7.23.3",
     "@babel/register": "^7.22.15",
-    "@progress/kendo-data-query": "^1.7.0",
+    "@progress/kendo-data-query": "^1.7.1",
     "@progress/kendo-date-math": "^1.5.14",
     "@progress/kendo-drawing": "^1.21.2",
     "@progress/kendo-inputs-common": "^3.1.1",
     "@progress/kendo-intl": "^3.1.2",
-    "@progress/kendo-licensing": "^1.3.5",
+    "@progress/kendo-licensing": "^1.6.0",
     "@progress/kendo-popup-common": "^1.9.2",
     "@progress/kendo-react-animation": "^11.0.0",
     "@progress/kendo-react-buttons": "^11.0.0",

examples/kendo-react-ssr/src/App.js

@@ -3,11 +3,8 @@ import './App.css';
 
 import { Grid, GridColumn } from '@progress/kendo-react-grid';
 import { Tooltip } from '@progress/kendo-react-tooltip';
-import { process } from '@progress/kendo-data-query';
 
 import '@progress/kendo-theme-default/dist/all.css';
-
-
 import products from './products.json';
 
 const MyCustomCell = (props) => {
@@ -35,19 +32,20 @@ const MyTooltipTemplate = (props) => {
 }
 
 function App() {
-  const [dataState, setDataState] = React.useState({ skip: 0, take: 10 })
   return (
     <div>
       <Tooltip content={MyTooltipTemplate} anchorElement="target" position="right">
         <Grid
+          data={products}
+          autoProcessData={true}
+          dataItemKey='ProductID'
           pageable
           sortable
-          data={process(products, dataState)}
-          {...dataState}
-          onDataStateChange={(e) => setDataState(e.dataState)}
+          defaultSkip={0}
+          defaultTake={10}
         >
           <GridColumn field="ProductID" title="Product Id" filter="numeric" />
-          <GridColumn field="ProductName" title="Product Name" cell={MyCustomCell} />
+          <GridColumn field="ProductName" title="Product Name" cells={{ data: MyCustomCell }} />
           <GridColumn field="UnitsInStock" title="Units In Stock" filter="numeric" />
         </Grid>
       </Tooltip>