Skip to content

Updated DataTable for alternate key #5907

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

Merged
merged 22 commits into from
May 5, 2025

Conversation

bibektamang7
Copy link
Contributor

@bibektamang7 bibektamang7 commented Apr 8, 2025

Closes #5898

New

  1. keyField in DataTableProps in DataTable.tsx file
  2. rowId parameter in getCells function in useTable.ts file.

Changed

  1. TableRow's key corresponds to the value of keyValue
  2. TableRow's cell key

Rollout strategy

  • Patch release
  • Minor release
  • Major release; if selected, include a written rollout or migration plan
  • None; if selected, include a brief description as to why

Testing & Reviewing

Merge checklist

@bibektamang7 bibektamang7 requested a review from a team as a code owner April 8, 2025 19:27
Copy link

changeset-bot bot commented Apr 8, 2025

🦋 Changeset detected

Latest commit: c9eb5bd

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@primer/react Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

Copy link
Member

@joshblack joshblack left a comment

Choose a reason for hiding this comment

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

Hey there! Thanks for taking the time to make a PR for this 🙏

Taking a look real quick, I think we'd either want to add a top-level getRowId function (similar to tanstack table) or would want to extend UniqueRow to support a function to get the id.

We would also want to make sure this gets passed along to useTable so that row.id matches what is provided.

Let me know what you think! Curious to hear your thoughts 👀

@bibektamang7
Copy link
Contributor Author

I totally agree—adding a top-level getRowId function or extending UniqueRow to support a custom ID getter makes a lot of sense. I’ll update the PR to reflect that and make sure it flows through to useTable so row.id aligns properly.

@bibektamang7
Copy link
Contributor Author

Since the key prop in React is used internally for rendering and does not appear in the DOM, would it be appropriate to verify the correct number of rendered elements as a means of testing, or would you recommend a more effective approach to validate this behavior?

@francinelucca
Copy link
Member

Since the key prop in React is used internally for rendering and does not appear in the DOM, would it be appropriate to verify the correct number of rendered elements as a means of testing, or would you recommend a more effective approach to validate this behavior?

You could test not DataTable, but the useTable function itself and validate that it overrides the row.id with the result of getRowId function. Similarly add test cases for when no getRowId function is supplied

@francinelucca
Copy link
Member

Thanks for all the work on this @bibektamang7 🙏 !

@francinelucca francinelucca enabled auto-merge April 30, 2025 18:44
auto-merge was automatically disabled May 1, 2025 06:20

Head branch was pushed to by a user without write access

@bibektamang7
Copy link
Contributor Author

Thank you so much! Really appreciate your thoughtful review and support 🙏 Excited to keep contributing!

@francinelucca francinelucca added this pull request to the merge queue May 5, 2025
Merged via the queue into primer:main with commit dbeca84 May 5, 2025
42 of 43 checks passed
@primer primer bot mentioned this pull request May 5, 2025
hectahertz pushed a commit that referenced this pull request May 20, 2025
Co-authored-by: Marie Lucca <[email protected]>
Co-authored-by: Marie Lucca <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Allow alternate key for DataTable id
3 participants