Exception in rendering grid using devextreme-reactive React Grid

I am using devextreme-reactive React grid. I was working fine but with my new screen i am getting following exception.

]×
TypeError: Cannot read property 'map' of undefined
rowIdGetter
src/main/resources/react-app/node_modules/@devexpress/dx-grid-core/dist/dx-grid-core.es.js:12
   9 | 
  10 | var rowIdGetter = function rowIdGetter(getRowId, rows) {
  11 |   if (!getRowId) {
> 12 |     var map = new Map(rows.map(function (row, rowIndex) {
  13 |       return [row, rowIndex];
  14 |     }));
  15 |     return function (row) {
View compiled
GridCore.render
src/main/resources/react-app/node_modules/@devexpress/dx-react-grid/dist/dx-react-grid.es.js:321
  318 | Plugin,
  319 | null,
  320 | createElement(Getter, { name: 'rows', value: rows }),
> 321 | createElement(Getter, { name: 'getRowId', value: rowIdGetter(getRowId, rows) }),
  322 | createElement(Getter, { name: 'columns', value: columns }),
  323 | createElement(Getter, { name: 'getCellValue', value: cellValueGetter(getCellValue, columns) }),
  324 | createElement(Template, { name: 'header' }),
View compiled
finishClassComponent
src/main/resources/react-app/node_modules/react-dom/cjs/react-dom.development.js:7873
  7870 | var nextChildren = void 0;
  7871 | {
  7872 |   ReactDebugCurrentFiber.setCurrentPhase('render');
> 7873 |   nextChildren = instance.render();
  7874 |   if (debugRenderPhaseSideEffects) {
  7875 |     instance.render();
  7876 |   }
View compiled
updateClassComponent
src/main/resources/react-app/node_modules/react-dom/cjs/react-dom.development.js:7850
  7847 |   } else {
  7848 |     shouldUpdate = updateClassInstance(current, workInProgress, renderExpirationTime);
  7849 |   }
> 7850 |   return finishClassComponent(current, workInProgress, shouldUpdate, hasContext);
  7851 | }
  7852 | 
  7853 | function finishClassComponent(current, workInProgress, shouldUpdate, hasContext) {
View compiled
beginWork
src/main/resources/react-app/node_modules/react-dom/cjs/react-dom.development.js:8225
  8222 | case FunctionalComponent:
  8223 |   return updateFunctionalComponent(current, workInProgress);
  8224 | case ClassComponent:
> 8225 |   return updateClassComponent(current, workInProgress, renderExpirationTime);
  8226 | case HostRoot:
  8227 |   return updateHostRoot(current, workInProgress, renderExpirationTime);
  8228 | case HostComponent:
View compiled
performUnitOfWork
src/main/resources/react-app/node_modules/react-dom/cjs/react-dom.development.js:10224
  10221 |   ReactDebugCurrentFiber.setCurrentFiber(workInProgress);
  10222 | }
  10223 | 
> 10224 | var next = beginWork(current, workInProgress, nextRenderExpirationTime);
  10225 | {
  10226 |   ReactDebugCurrentFiber.resetCurrentFiber();
  10227 | }
View compiled
workLoop
src/main/resources/react-app/node_modules/react-dom/cjs/react-dom.development.js:10288
  10285 | if (nextRenderExpirationTime <= mostRecentCurrentTime) {
  10286 |   // Flush all expired work.
  10287 |   while (nextUnitOfWork !== null) {
> 10288 |     nextUnitOfWork = performUnitOfWork(nextUnitOfWork);
  10289 |   }
  10290 | } else {
  10291 |   // Flush asynchronous work until the deadline runs out of time.
View compiled
HTMLUnknownElement.callCallback
src/main/resources/react-app/node_modules/react-dom/cjs/react-dom.development.js:542
  539 |   // nested call would trigger the fake event handlers of any call higher
  540 |   // in the stack.
  541 |   fakeNode.removeEventListener(evtType, callCallback, false);
> 542 |   func.apply(context, funcArgs);
  543 |   didError = false;
  544 | }
  545 | 
View compiled
invokeGuardedCallbackDev
src/main/resources/react-app/node_modules/react-dom/cjs/react-dom.development.js:581
  578 | // errors, it will trigger our global error handler.
  579 | var evt = document.createEvent('Event');
  580 | evt.initEvent(evtType, false, false);
> 581 | fakeNode.dispatchEvent(evt);
  582 | 
  583 | if (didError) {
  584 |   if (!didSetError) {
View compiled
invokeGuardedCallback
src/main/resources/react-app/node_modules/react-dom/cjs/react-dom.development.js:438
  435 |  * @param {...*} args Arguments for function
  436 |  */
  437 | invokeGuardedCallback: function (name, func, context, a, b, c, d, e, f) {
> 438 |   invokeGuardedCallback.apply(ReactErrorUtils, arguments);
  439 | },
  440 | 
  441 | /**
View compiled
renderRoot
src/main/resources/react-app/node_modules/react-dom/cjs/react-dom.development.js:10366
  10363 | var didError = false;
  10364 | var error = null;
  10365 | {
> 10366 |   invokeGuardedCallback$1(null, workLoop, null, expirationTime);
  10367 |   if (hasCaughtError()) {
  10368 |     didError = true;
  10369 |     error = clearCaughtError();
View compiled
performWorkOnRoot
src/main/resources/react-app/node_modules/react-dom/cjs/react-dom.development.js:11014
  11011 |   root.remainingExpirationTime = commitRoot(finishedWork);
  11012 | } else {
  11013 |   root.finishedWork = null;
> 11014 |   finishedWork = renderRoot(root, expirationTime);
  11015 |   if (finishedWork !== null) {
  11016 |     // We've completed the root. Commit it.
  11017 |     root.remainingExpirationTime = commitRoot(finishedWork);
View compiled
performWork
src/main/resources/react-app/node_modules/react-dom/cjs/react-dom.development.js:10967
  10964 | }
  10965 | 
  10966 | while (nextFlushedRoot !== null && nextFlushedExpirationTime !== NoWork && (minExpirationTime === NoWork || nextFlushedExpirationTime <= minExpirationTime) && !deadlineDidExpire) {
> 10967 |   performWorkOnRoot(nextFlushedRoot, nextFlushedExpirationTime);
  10968 |   // Find the next highest priority work.
  10969 |   findHighestPriorityRoot();
  10970 | }
View compiled
requestWork
src/main/resources/react-app/node_modules/react-dom/cjs/react-dom.development.js:10878
  10875 | 
  10876 | // TODO: Get rid of Sync and use current time?
  10877 | if (expirationTime === Sync) {
> 10878 |   performWork(Sync, null);
  10879 | } else {
  10880 |   scheduleCallbackWithExpiration(expirationTime);
  10881 | }
View compiled
scheduleWorkImpl
src/main/resources/react-app/node_modules/react-dom/cjs/react-dom.development.js:10732
  10729 |   var root = node.stateNode;
  10730 | 
  10731 |   checkRootNeedsClearing(root, fiber, expirationTime);
> 10732 |   requestWork(root, expirationTime);
  10733 |   checkRootNeedsClearing(root, fiber, expirationTime);
  10734 | } else {
  10735 |   {
View compiled
scheduleWork
src/main/resources/react-app/node_modules/react-dom/cjs/react-dom.development.js:10689
  10686 | }
  10687 | 
  10688 | function scheduleWork(fiber, expirationTime) {
> 10689 |   return scheduleWorkImpl(fiber, expirationTime, false);
  10690 | }
  10691 | 
  10692 | function checkRootNeedsClearing(root, fiber, expirationTime) {
View compiled
enqueueSetState
src/main/resources/react-app/node_modules/react-dom/cjs/react-dom.development.js:6212
  6209 |     next: null
  6210 |   };
  6211 |   insertUpdateIntoFiber(fiber, update);
> 6212 |   scheduleWork(fiber, expirationTime);
  6213 | },
  6214 | enqueueReplaceState: function (instance, state, callback) {
  6215 |   var fiber = get(instance);
View compiled
Users../node_modules/react/cjs/react.development.js.Component.setState
src/main/resources/react-app/node_modules/react/cjs/react.development.js:237
  234 |  */
  235 | Component.prototype.setState = function (partialState, callback) {
  236 |   !(typeof partialState === 'object' || typeof partialState === 'function' || partialState == null) ? invariant(false, 'setState(...): takes an object of state variables to update or a function which returns an object of state variables.') : void 0;
> 237 |   this.updater.enqueueSetState(this, partialState, callback, 'setState');
  238 | };
  239 | 
  240 | /**
View compiled
(anonymous function)
src/main/resources/react-app/src/components/Users.js:66
  63 | componentDidMount(){
  64 |   this.callApiUsers()
  65 |   .then(res => {
> 66 |     this.setState({rows : res.data});
  67 |   }).catch(err => console.log(err));
  68 | } 
  69 | 
View compiled
This screen is visible only in development. It will not appear if the app crashes in production.
Open your browser’s developer console to further inspect this error.

When i do npm install i am getting following warnings, is there anything messed up with the new versions?

npm WARN @devexpress/[email protected] requires a peer of [email protected] but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of ajv@^6.0.0 but none is installed. You must install peer dependencies yourself.