inovua / reactdatagrid

Empower Your Data with the best React Data Grid there is
https://reactdatagrid.io
Other
3.44k stars 57 forks source link

Invalid prop `disabled` of type `string` supplied to `InovuaCheckBox`, expected `boolean` #344

Open robozb opened 1 year ago

robozb commented 1 year ago

I experienced this warning with both community and enterprise edition as well, at column visibility change on the context menu:

https://user-images.githubusercontent.com/8656998/218294774-ec7905d1-6fa4-4138-91d2-ea83a172fa3f.mp4

Warning: Failed prop type: Invalid prop `disabled` of type `string` supplied to `InovuaCheckBox`, expected `boolean`.
    at InovuaCheckBox (http://localhost:3001/static/js/bundle.js:24128:34)
    at MenuItem (http://localhost:3001/static/js/bundle.js:34925:34)
    at tbody
    at table
    at div
    at http://localhost:3001/static/js/bundle.js:31539:96
    at div
    at div
    at div
    at div
    at div
    at InovuaScrollContainer (http://localhost:3001/static/js/bundle.js:46240:34)
    at div
    at http://localhost:3001/static/js/bundle.js:31539:96
    at InovuaArrowScroller (http://localhost:3001/static/js/bundle.js:22558:34)
    at div
    at InovuaMenu (http://localhost:3001/static/js/bundle.js:33230:34)
    at div
    at div
    at InovuaMenu (http://localhost:3001/static/js/bundle.js:33230:34)
    at div
    at http://localhost:3001/static/js/bundle.js:14494:41
    at TheGrid (http://localhost:3001/static/js/bundle.js:15718:43)
    at __WEBPACK_DEFAULT_EXPORT__
    at div
    at App
overrideMethod @ react_devtools_backend.js:4012
printWarning @ react.development.js:209
error @ react.development.js:183
checkPropTypes @ react.development.js:2074
validatePropTypes @ react.development.js:2275
createElementWithValidation @ react.development.js:2379
renderSelectInput @ index.js:299
renderCells @ index.js:228
render @ index.js:61
finishClassComponent @ react-dom.development.js:19752
updateClassComponent @ react-dom.development.js:19698
beginWork @ react-dom.development.js:21611
beginWork$1 @ react-dom.development.js:27426
performUnitOfWork @ react-dom.development.js:26557
workLoopSync @ react-dom.development.js:26466
renderRootSync @ react-dom.development.js:26434
performSyncWorkOnRoot @ react-dom.development.js:26085
flushSyncCallbacks @ react-dom.development.js:12042
(anonymous) @ react-dom.development.js:25651

package.json dependencies:

  "dependencies": {
    "@inovua/reactdatagrid-enterprise": "^5.8.4",
    "@testing-library/jest-dom": "^5.16.5",
    "@testing-library/react": "^13.4.0",
    "@testing-library/user-event": "^13.5.0",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-scripts": "5.0.1",
    "web-vitals": "^2.1.4"
  }

I took the example code from here:

https://reactdatagrid.io/docs/getting-started

import React from 'react'
import ReactDataGrid from '@inovua/reactdatagrid-enterprise'
import '@inovua/reactdatagrid-enterprise/index.css'

const columns = [
  { name: 'name', header: 'Name', minWidth: 50, defaultFlex: 2 },
  { name: 'age', header: 'Age', maxWidth: 1000, defaultFlex: 1 }
]

const gridStyle = { minHeight: 550 }

const dataSource = [
  { id: 1, name: 'John McQueen', age: 35 },
  { id: 2, name: 'Mary Stones', age: 25 },
  { id: 3, name: 'Robert Fil', age: 27 },
  { id: 4, name: 'Roger Robson', age: 81 },
  { id: 5, name: 'Billary Konwik', age: 18 },
  { id: 6, name: 'Bob Martin', age: 18 },
  { id: 7, name: 'Matthew Richardson', age: 54 },
  { id: 8, name: 'Ritchie Peterson', age: 54 },
  { id: 9, name: 'Bryan Martin', age: 40 },
  { id: 10, name: 'Mark Martin', age: 44 },
  { id: 11, name: 'Michelle Sebastian', age: 24 },
  { id: 12, name: 'Michelle Sullivan', age: 61 },
  { id: 13, name: 'Jordan Bike', age: 16 },
  { id: 14, name: 'Nelson Ford', age: 34 },
  { id: 15, name: 'Tim Cheap', age: 3 },
  { id: 16, name: 'Robert Carlson', age: 31 },
  { id: 17, name: 'Johny Perterson', age: 40 }
]

export default () => <ReactDataGrid
  idProperty="id"
  columns={columns}
  dataSource={dataSource}
  style={gridStyle}
/>
robozb commented 1 year ago

The possible solution is to build the project, in the built project the warn message disappear!

robozb commented 1 year ago

How can I make it not appear in the development environment?