[HOLD for payment 2023-07-03] [$1000] New Chat - Recents list option for a new chat shows incorrect username and avatar after avatar update

[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. Login
2. Click FAB > New Chat, observe the list of Recents
3. Create a money request with one of recents accounts
4. Change avatar
5. Click on chat from step 3 - > then thread - > then IOU preview
6. Click FAB - > New chat

Expected Result:

Recent options should be correctly displayed

Actual Result:

Incorrect account name (IOU hat instead of account) and incorrect avatar (Your account avatar instead another user)
Repro rate 4/5

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.19.2

Reproducible in staging?: Yes

Reproducible in production?: yes

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

https://platform.applause.com/services/links/v1/external/01f4f080cb32f535f3067b29ba1bc19ae61a3de975bf5efdb867461b6c43820d

https://platform.applause.com/services/links/v1/external/7e6b0c2b2d2fb95e02014ca913465e9d17dc05868c0899d631013161dbf3bf6c

https://platform.applause.com/services/links/v1/external/e5b82e0ad05530e5bfc7eeb0e12b1c879da07f855846014a703571c85cc1f53f

Expensify/Expensify Issue URL:

Issue reported by: Applause - Internal Team, and @Nathan-Mulugeta via Slack (#19370)

Slack conversation:

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~012ca2c9c058213c2a
• Upwork Job ID: 1669361161957789696
• Last Price Increase: 2023-06-15

[melvin-bot]

Triggered auto assignment to @conorpendergrast (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details.

[melvin-bot]

Bug0 Triage Checklist (Main S/O)

• This "bug" occurs on a supported platform (ensure Platforms in OP are ✅)
• This bug is not a duplicate report (check E/App issues and #expensify-bugs)
  • If it is, comment with a link to the original report, close the issue and add any novel details to the original issue instead
• This bug is reproducible using the reproduction steps in the OP. S/O
  • If the reproduction steps are clear and you're unable to reproduce the bug, check with the reporter and QA first, then close the issue.
  • If the reproduction steps aren't clear and you determine the correct steps, please update the OP.
• This issue is filled out as thoroughly and clearly as possible
  • Pay special attention to the title, results, platforms where the bug occurs, and if the bug happens on staging/production.
• I have reviewed and subscribed to the linked Slack conversation to ensure Slack/Github stay in sync

[StevenKKC]

Proposal

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

Recent list option for a new chat shows incorrect username and avatar after avatar update

What is the root cause of that problem?

Recent list options for a new chat are retrieved using getOptions function in OptionsListUtils.js.

App/src/pages/NewChatPage.js

Lines 56 to 63 in edf529e

	const {recentReports, personalDetails, userToInvite} = OptionsListUtils.getNewChatOptions(
	props.reports,
	props.personalDetails,
	props.betas,
	'',
	[],
	this.props.isGroupChat ? this.excludedGroupEmails : [],
	);

App/src/libs/OptionsListUtils.js

Lines 877 to 888 in edf529e

	function getNewChatOptions(reports, personalDetails, betas = [], searchValue = '', selectedOptions = [], excludeLogins = [], includeOwnedWorkspaceChats = false) {
	return getOptions(reports, personalDetails, {
	betas,
	searchInputValue: searchValue.trim(),
	selectedOptions,
	includeRecentReports: true,
	includePersonalDetails: true,
	maxRecentReportsToShow: 5,
	excludeLogins,
	includeOwnedWorkspaceChats,
	});
	}

And getOptions call createOption function to get list options information, and createOption function returns the report name and icon for the report.

When getting recent list options for a new chat, money request threads are included by default, so the report name and icon for the money request threads are included in recent list options, and these are not username and avatar.

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

We should filter out money request threads in recent option list for new chat, new group.

function getNewChatOptions(reports, personalDetails, betas = [], searchValue = '', selectedOptions = [], excludeLogins = [], includeOwnedWorkspaceChats = false) {
    const filteredReports = _.filter(reports, (report) => !ReportUtils.isMoneyRequestReport(report));
    return getOptions(filteredReports, personalDetails, {
        ...
    }
}

What alternative solutions did you explore? (Optional)

None.

[melvin-bot]

@conorpendergrast Whoops! This issue is 2 days overdue. Let's get this updated quick!

[conorpendergrast]

@kbecciv I haven't been able to reproduce this; is there a more specific set of steps that you can add to help here?

[conorpendergrast]

Bump on those reproduction step here!

[kbecciv]

This issue is inconsistent, that's why you haven't been able to reproduce this.

[melvin-bot]

@conorpendergrast Huh... This is 4 days overdue. Who can take care of this?

[conorpendergrast]

I'm really sorry, I've tried about seven times to reproduce this and still haven't been able to do this!