Create a prop to tell the library which data attribute is "id"

hlarouss commented 2 years ago

Following my question and reply from Domino987, I'm creating this feature request.

The idea would be to have a prop where you tell the component which data attribute is "id". This would be a very useful feature for data objects that have an id attribute but is not called "id".

Link to the original question: https://github.com/material-table-core/core/issues/478

Thanks in advance for your help, Let me know if you need anything else, Regards.

adamTarr commented 2 years ago

Please make this a thing. Tired of the warning in console or adding unnecessary bulk to my data by adding an id field.

I made this comment on a different issue that was closed: #391

Domino987 commented 2 years ago

This can now be done with the idSynonym in options.

adamTarr commented 2 years ago

@Domino987 where is that documented? When I search for it, only this issue with your comment references idSynonym

Domino987 commented 2 years ago

Its both in the types and the docs.

adamTarr commented 2 years ago

Still seeing the same console message even with idSynonym in options.

Domino987 commented 2 years ago

Looks like I missed one, now^^

hlarouss commented 2 years ago

Still seeing the same console message even with idSynonym in options.

I have the same issue

Domino987 commented 2 years ago

Will work now!

adamTarr commented 2 years ago

Pulled latest next branch, still no dice. I tried making a sandbox with next branch but it doesn't let me install the dependency that specifically.

<MaterialTable
          columns={columns}
          data={data}
          options={{
            idSynonym: 'medication_dose_id',
          }}
        />

The table requires all rows to have an unique id property. A row was provided without id in the rows prop. To prevent the loss of state between renders, please provide an unique id for each row.

package.json dependencies:

"dependencies": {
    "@date-io/moment": "^1.3.13",
    "@emotion/react": "^11.7.1",
    "@emotion/styled": "^11.6.0",
    "@fortawesome/fontawesome-pro": "^5.15.2",
    "@fortawesome/fontawesome-svg-core": "^1.2.34",
    "@fortawesome/pro-duotone-svg-icons": "^5.15.2",
    "@fortawesome/pro-light-svg-icons": "^5.15.2",
    "@fortawesome/pro-regular-svg-icons": "^5.15.2",
    "@fortawesome/pro-solid-svg-icons": "^5.15.2",
    "@fortawesome/react-fontawesome": "^0.1.14",
    "@material-table/core": "^0.2.23",
    "@mui/icons-material": "^5.3.0",
    "@mui/lab": "^5.0.0-alpha.62",
    "@mui/material": "^5.2.4",
    "@nivo/core": "^0.73.0",
    "@nivo/pie": "^0.73.0",
    "@types/jest": "^27.0.2",
    "@types/node": "^16.10.2",
    "@types/react": "^17.0.27",
    "@types/react-dom": "^17.0.9",
    "axios": "^0.21.1",
    "env-cmd": "^10.1.0",
    "formik": "^2.2.0",
    "moment": "^2.29.1",
    "node-sass": "^4.14.1",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-helmet": "^6.1.0",
    "react-number-format": "^4.6.3",
    "react-redux": "^7.2.0",
    "react-router-dom": "^5.3.0",
    "react-scripts": "^5.0.0",
    "react-toastify": "^7.0.4",
    "redux": "^4.0.5",
    "redux-thunk": "^2.3.0",
    "typescript": "^4.4.3",
    "yup": "^0.29.3"
  },

Domino987 commented 2 years ago

Hmh without a Sandbox, it's quite difficult. I created one this morning 🤔

hlarouss commented 2 years ago

Hello, it's actually working for me now! Not getting the warning anymore :)

var materialTableOptions={ pageSize: 10, filtering: true, idSynonym: 'SK' };

I'm using the latest version:

"@material-table/core": "^4.3.31", "@material-ui/core": "^4.12.3",

Thanks a lot for your help

adamTarr commented 2 years ago

I can create one with regular @material-table/core but not @material-table/core@next which is recommended for use with MUI v5.

adamTarr commented 2 years ago

@Domino987 is there a solution for this with MUI v5?

"@material-table/core": "^0.2.23", "@mui/material": "^5.2.4",

Domino987 commented 2 years ago

Seems like it was not merged yet. I'll do it tonight

adamTarr commented 2 years ago

Finally got it working. Thanks @Domino987 !

Domino987 commented 2 years ago

So it works for Mui v5?

adamTarr commented 2 years ago

Yup

package.json

"@material-table/core": "^0.2.23",
    "@mui/icons-material": "^5.3.0",
    "@mui/lab": "^5.0.0-alpha.62",
    "@mui/material": "^5.2.4",

usage

<MaterialTable
          columns={columns}
          data={rows}
          onSelectionChange={(r) => handleSelection(r)}
          options={{
            idSynonym: 'unique_parent_id',
          }}
        />

material-table-core / core

Create a prop to tell the library which data attribute is "id" #487