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

Fix react key attributes to be unique #314

Open
js0mmer opened this issue May 27, 2023 · 0 comments
Open

Fix react key attributes to be unique #314

js0mmer opened this issue May 27, 2023 · 0 comments
Labels
Story Point: 3 backend or full-stack change. maybe adding an endpoint or changing the response of an endpoint + the

Comments

@js0mmer
Copy link
Member

js0mmer commented May 27, 2023

In a lot of our code, we render arrays of components. React requires components rendered in an array to have a key attribute. The key attribute should be unique to the component because React uses it to match states for the components. In many instances, we use an item index in the key to differentiate them. This is bad practice since the index is not unique to the component, and if component orders were to change (e.g. sorting a list of reviews) then their states/data would be mismatched. You can read more about keys on the react documentation. Additional documentation available in our wiki.

Here's a screenshot of a grep search for key={. Any of them that use an index in the key should be changed to something unique to the component e.g. a professor name or ucinetid for a list of professors.
image

@js0mmer js0mmer added the Story Point: 2 small UI change, maybe some CSS + JS. unit test would ideally be written, but not always. label May 27, 2023
@js0mmer js0mmer moved this to Backlog in PeterPortal Client May 27, 2023
@js0mmer js0mmer added Story Point: 3 backend or full-stack change. maybe adding an endpoint or changing the response of an endpoint + the and removed Story Point: 2 small UI change, maybe some CSS + JS. unit test would ideally be written, but not always. labels Feb 15, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Story Point: 3 backend or full-stack change. maybe adding an endpoint or changing the response of an endpoint + the
Projects
Status: Backlog
Development

No branches or pull requests

1 participant