App: [HOLD for payment 2022-10-20] [$250] Console error - Non-unique keys when group users have same name - reported by @rushatgabhane

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

Action Performed:

Login on web dev
Create a new group with two users that have the same first name.
Send a message

Expected Result:

No console error

Actual Result:

Console error - Encountered two children with the same key, Rushat. Keys should be

Workaround:

unknown

Platform:

Where is this issue occurring?

Web (Dev only)

Version Number: 1.1.96-0 Reproducible in staging?: Y Reproducible in production?: Y Email or phone of affected tester (no customers): Logs: https://stackoverflow.com/c/expensify/questions/4856 Notes/Photos/Videos: Any additional supporting documentation image - 2022-09-06T234720 499

Expensify/Expensify Issue URL: Issue reported by: @rushatgabhane Slack conversation: https://expensify.slack.com/archives/C01GTK53T8Q/p1661196448723269

View all open jobs on GitHub

About this issue

Original URL
State: closed
Created 2 years ago
Comments: 48 (23 by maintainers)

Most upvoted comments

PR is merged. @srikarparsi @arielgreen considering this won’t be reproducible on staging and dev. So we won’t need a QA here. I am assuming we would handle the payment the same process and regression period?

mananjadhav on Oct 10, 2022

Afaik, @mdneyazahmad you should get the reporting bonus.

cc - @srikarparsi @arielgreen

mananjadhav on Sep 26, 2022

@mananjadhav thanks for the check! I added a reporting bonus as well to @mdneyazahmad 's contract

arielgreen on Oct 20, 2022

keeping the issue open for payment on the 20th

srikarparsi on Oct 18, 2022

@rushatgabhane @mananjadhav @mdneyazahmad check your Upwork inboxes, please.

arielgreen on Sep 29, 2022

@mdneyazahmad, @mvtglobally wont have the dev setup and that’s fine. You can continue with the PR and I’ll take care of the QA part

mananjadhav on Sep 27, 2022

sounds good @mananjadhav, the tooltip proposal looks good to me as well, lets move forward with that. The second issue is very similar so I agree that we can handle it in this pr

srikarparsi on Sep 23, 2022

Proposal

The current proposal solves the issue of the same display name on active chat. You should change key={firstName} to key={firstName + (new Date().getTime()).toString()}

hoangndm on Sep 17, 2022

Reply

Keys should not be kept as indexes as it might have negative impact on the performance. The best way is to use a string that uniquely identifies the list item. Refer this - https://reactjs.org/docs/lists-and-keys.html

ajaynagwani777 on Sep 16, 2022

@rushatgabhane nah I’m only on prod and staging. Can you edit the repro steps to make it clear it’s only reproducible there? Thanks 😃

laurenreidexpensify on Sep 9, 2022