[$1000] [HOLD for payment 2023-06-21] [HOLD for payment 2023-06-19] Web - New Group - Wrong user details page opens on clicking at display names

[kbecciv]

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:

1. Click on fab icon
2. Create a new group
3. Refresh the page
4. Click on each display name and check if the user details are correct

Expected Result:

Correct user details should open

Actual Result:

The user details aren't of the clicked user

Workaround:

Unknown

Platforms:

Which of our officially supported platforms is this issue occurring on?

• Android / native
• Android / Chrome
• iOS / native
• iOS / Safari
• MacOS / Chrome / Safari
• MacOS / Desktop

Version Number: 1.3.26.1

Reproducible in staging?: Yes

Reproducible in production?: No

If this was caught during regression testing, add the test name, ID and link from TestRail:

Email or phone of affected tester (no customers):

Logs: https://stackoverflow.com/c/expensify/questions/4856

Notes/Photos/Videos: Any additional supporting documentation

Screen.Recording.2023-06-12.at.2.21.12.PM.mov

Recording.3075.mp4

Expensify/Expensify Issue URL:

Issue reported by: @Puneet-here

**Slack conversation:**https://expensify.slack.com/archives/C049HHMV9SM/p1686560410530529

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~010a5aeee05bd7da3a
• Upwork Job ID: 1671541422809731072
• Last Price Increase: 2023-06-21

[OSBotify]

👋 Friendly reminder that deploy blockers are time-sensitive ⏱ issues! Check out the open StagingDeployCash deploy checklist to see the list of PRs included in this release, then work quickly to do one of the following:

1. Identify the pull request that introduced this issue and revert it.
2. Find someone who can quickly fix the issue.
3. Fix the issue yourself.

[melvin-bot]

Triggered auto assignment to @PauloGasparSv (Engineering), see https://stackoverflow.com/c/expensify/questions/4319 for more details.

[BhuvaneshPatil]

Proposal

Please re-state the problem that we are trying to solve in this issue.

Wrong user details page opens on clicking at display names

What is the root cause of that problem?

The root cause of this problem is that, the accountIDs and the participant emails are not matched in correct order.
This is the screen shot of accountIDs and their emails in ReportScreen

And here are the details of those users -

If we pay close attention for first two users in the first picture IDs are interchanged, That's why opening the user details were taking on wrong page.
This is the issue video -

7.New.Expensify.Mozilla.Firefox.2023-06-12.19-00-08.mp4

Here we are using index to navigate -

App/src/components/ReportWelcomeText.js

Lines 94 to 112 in 297e5aa

	<Text>
	<Text>{props.translate('reportActionsView.beginningOfChatHistory')}</Text>
	{_.map(displayNamesWithTooltips, ({displayName, pronouns, tooltip}, index) => (
	<Text key={`${displayName}${pronouns}${index}`}>
	<Tooltip text={tooltip}>
	<Text
	style={[styles.textStrong]}
	onPress={() => Navigation.navigate(ROUTES.getProfileRoute(participantAccountIDs[index]))}
	>
	{displayName}
	</Text>
	</Tooltip>
	{!_.isEmpty(pronouns) && <Text>{` (${pronouns})`}</Text>}
	{index === displayNamesWithTooltips.length - 1 && <Text>.</Text>}
	{index === displayNamesWithTooltips.length - 2 && <Text>{` ${props.translate('common.and')} `}</Text>}
	{index < displayNamesWithTooltips.length - 2 && <Text>, </Text>}
	</Text>
	))}
	</Text>

What changes do you think we should make in order to solve the problem?

Instead of using index we can create the object, that will map the participant emails to their accountID
We can use personalDetails for that, this will ensure we are navigating with proper accountID each time.

What alternative solutions did you explore? (Optional)

None

[PauloGasparSv]

I think I may use @BhuvaneshPatil solution but implement it myself!

I'm checking if personalDetails will always have the accountID, if that's not the case we can also search for the participant's actual index searching the email from displayNamesWithTooltips in participants. I like the proposed solution much better than doing this but it's an alternative : )

[PauloGasparSv]

Note: Also test what happens if an account has a displayName and sms/phoneNumber accounts

[PauloGasparSv]

Using personalDetails works fine when accounts have a Display Name but not so much for SMS based accounts, I'm thinking of a way to make that work : ) (it has to do with the login param and how each object/list is generating theirs)

Using the participants list has the same problem where the domain is stripped and we need that to find the account btw
I don't want to simply use an include() to check if the email matches so I'm still investigating

Edit: Oh I think I can just use addSMSDomainIfPhoneNumber with the tooltip content!