Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[docs] Mention row id requirement and document getRowId prop #3765

Merged
merged 10 commits into from Feb 2, 2022

Conversation

cherniavskii
Copy link
Member

@cherniavskii cherniavskii commented Jan 28, 2022

Currently DataGrid throws an error if row doesn't have an id property.
This is not documented though, and there's getRowId prop that can be used instead.
I've updated the error message to mention getRowId prop as well.

Preview: https://deploy-preview-3765--material-ui-x.netlify.app/components/data-grid/rows/

@mui-bot
Copy link

mui-bot commented Jan 28, 2022

These are the results for the performance tests:

Test case Unit Min Max Median Mean σ
Filter 100k rows ms 1,110.8 1,753.4 1,146.1 1,377.38 305.756
Sort 100k rows ms 676.2 1,083.7 1,083.7 915.68 166.41
Select 100k rows ms 141.8 298.2 234.4 227.92 53.04
Deselect 100k rows ms 91.8 176.7 151.4 139 27.63

Generated by 🚫 dangerJS against f0d6354

@cherniavskii cherniavskii added the docs Improvements or additions to the documentation label Jan 28, 2022
@oliviertassinari oliviertassinari added the component: data grid This is the name of the generic UI component, not the React module! label Jan 29, 2022
Co-authored-by: Flavien DELANGLE <flaviendelangle@gmail.com>
@cherniavskii
Copy link
Member Author

Well, it looks like it's not up to me to decide whether there's demo preview or not 😀
docs:typescript:formatted generates preview automatically if it's short enough (currently maxLines is 16).
I guess I'm keeping the preview then.

@flaviendelangle
Copy link
Member

@cherniavskii here is an example with the code not expanded by default:

{{"demo": "pages/components/data-grid/filtering/BasicExampleDataGrid.js", "bg": "inline", "defaultCodeOpen": false}}

@@ -15,6 +15,17 @@ The rows can be defined with the `rows` prop, which expects an array of objects.

{{"demo": "pages/components/data-grid/rows/RowsGrid.js", "bg": "inline"}}

> ⚠️ Each row should have a unique id.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We could also mention that the "id" property doesn't need to be specified in the columns prop. An user wasn't aware of this: #346 (comment)

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Something like this ?

⚠️ Each row should have a unique id even when no there is no id column

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Interesting. Looks like the issue here is understanding columns - users might think that every field in their rows data is required to be reflected in columns as well.
Maybe instead we should mention on Columns page that it's not required for columns to cover all the fields available in rows data?

This comment was marked as outdated.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It could be, but then we would need to say there that, although the "id" is required, a "id" column is not.

Now I'm convinced to your initial proposal - I'll mention id column here :)

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I tried to make it as clear as I could and ended up with this:

Note that column definition for id field is not required.

@cherniavskii
Copy link
Member Author

cherniavskii commented Jan 31, 2022

@flaviendelangle interesting, I did not expect this setting to toggle demo code preview!
I guess demo preview is still generated by the script, but it will not be shown. I'll use that, thanks!

@@ -15,6 +15,17 @@ The rows can be defined with the `rows` prop, which expects an array of objects.

{{"demo": "pages/components/data-grid/rows/RowsGrid.js", "bg": "inline"}}

> ⚠️ Each row should have a unique id.

This comment was marked as outdated.

@cherniavskii cherniavskii merged commit d5d6bc6 into mui:master Feb 2, 2022
@cherniavskii cherniavskii deleted the docs-row-id branch February 2, 2022 13:24
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
component: data grid This is the name of the generic UI component, not the React module! docs Improvements or additions to the documentation
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

5 participants