[HOLD for payment 2023-08-28] [$1000] IOU - Workspace avatar shows 'U' avatar before reverting to actual avatar in IOU view

[lanitochka17]

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

---

Issue found when executing PR #23043

Action Performed:

1. Go to staging.new.expensify.com
2. Request money in a workspace chat
3. Click on the IOU preview
4. Click on the IOU again

Expected Result:

The workspace avatar shows the correct avatar

Actual Result:

The workspace avatar shows 'U' avatar before reverting to the actual avatar.

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

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

Bug6159056_20230809_224632.1.mp4

Expensify/Expensify Issue URL:

Issue reported by: Applause - Internal Team

Slack conversation:

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~01698449a42b0e216c
• Upwork Job ID: 1689577432456220672
• Last Price Increase: 2023-08-10
• Automatic offers:
• situchan | Reviewer | 26110136
• StevenKKC | Contributor | 26110138

[melvin-bot]

Triggered auto assignment to @flaviadefaria (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.

Workspace avatar shows 'U' avatar before reverting to actual avatar in IOU view.

What is the root cause of that problem?

If we click IOU preview in the money request page, onIOUPreviewPressed is executed.
Since there is no child thread data in Onyx, app generates optimistic child thread data, and set the child thread's policyID to CONST.POLICY.OWNER_EMAIL_FAKE.
And then send OpenReport API to BE, and navigate to the child thread.

App/src/components/ReportActionItem/MoneyRequestAction.js

Lines 101 to 121 in 202f2eb

	const thread = ReportUtils.buildOptimisticChatReport(
	participantAccountIDs,
	props.translate(ReportActionsUtils.isSentMoneyReportAction(props.action) ? 'iou.threadSentMoneyReportName' : 'iou.threadRequestReportName', {
	formattedAmount: ReportActionsUtils.getFormattedAmount(props.action),
	comment: props.action.originalMessage.comment,
	}),
	'',
	CONST.POLICY.OWNER_EMAIL_FAKE,
	CONST.POLICY.OWNER_ACCOUNT_ID_FAKE,
	false,
	'',
	undefined,
	undefined,
	CONST.REPORT.NOTIFICATION_PREFERENCE.ALWAYS,
	props.action.reportActionID,
	props.requestReportID,
	);
	const userLogins = PersonalDetailsUtils.getLoginsByAccountIDs(thread.participantAccountIDs);
	Report.openReport(thread.reportID, userLogins, thread, props.action.reportActionID);
	Navigation.navigate(ROUTES.getReportRoute(thread.reportID));

Because the report's policyID is CONST.POLICY.OWNER_EMAIL_FAKE, ReportUtils.getPolicyName returns Unavailable Workspace, and then ReportUtils.getWorkspaceAvatar returns WorkspaceUavatar.
So 'U' is shown in money request header.

App/src/libs/ReportUtils.js

Lines 568 to 583 in 202f2eb

	function getPolicyName(report, returnEmptyIfNotFound = false, policy = undefined) {
	const noPolicyFound = returnEmptyIfNotFound ? '' : Localize.translateLocal('workspace.common.unavailable');
	if (_.isEmpty(report)) {
	return noPolicyFound;
	}
	if ((!allPolicies || _.size(allPolicies) === 0) && !report.policyName) {
	return Localize.translateLocal('workspace.common.unavailable');
	}
	const finalPolicy = policy || _.get(allPolicies, `${ONYXKEYS.COLLECTION.POLICY}${report.policyID}`);
	// Public rooms send back the policy name with the reportSummary,
	// since they can also be accessed by people who aren't in the workspace
	return lodashGet(finalPolicy, 'name') || report.policyName || report.oldPolicyName || noPolicyFound;
	}

App/src/libs/ReportUtils.js

Lines 859 to 862 in 202f2eb

	function getWorkspaceAvatar(report) {
	const workspaceName = getPolicyName(report, allPolicies);
	return lodashGet(allPolicies, [`${ONYXKEYS.COLLECTION.POLICY}${report.policyID}`, 'avatar']) || getDefaultWorkspaceAvatar(workspaceName);
	}

App/src/libs/ReportUtils.js

Lines 845 to 857 in 202f2eb

	function getDefaultWorkspaceAvatar(workspaceName) {
	if (!workspaceName) {
	return defaultWorkspaceAvatars.WorkspaceBuilding;
	}
	// Remove all chars not A-Z or 0-9 including underscore
	const alphaNumeric = workspaceName
	.normalize('NFD')
	.replace(/[^0-9a-z]/gi, '')
	.toUpperCase();
	return !alphaNumeric ? defaultWorkspaceAvatars.WorkspaceBuilding : defaultWorkspaceAvatars[`Workspace${alphaNumeric[0]}`];
	}

After OpenReport API returns the thread report data, app showes the correct workspace avatar, since the thread has a corrrect policyID.

Therefore, workspace avatar shows 'U' avatar before reverting to actual avatar in IOU view.

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

We can set the optimistic child thread's policyID to correct value.
Because the props.iouReport has a correct policyID, we can set the optimistic thread's policyID to props.iouReport policyID instead of CONST.POLICY.OWNER_EMAIL_FAKE.

    lodashGet(props.iouReport, 'policyID', CONST.POLICY.OWNER_EMAIL_FAKE),

What alternative solutions did you explore? (Optional)

None.

[melvin-bot]

Job added to Upwork: https://www.upwork.com/jobs/~01698449a42b0e216c

[melvin-bot]

Current assignee @flaviadefaria is eligible for the External assigner, not assigning anyone new.

[melvin-bot]

Triggered auto assignment to Contributor-plus team member for initial proposal review - @situchan (External)

[kaomoua]

Hi. I can not see the proposal of @situchan. But how was he assigned to this issue?
I am new here and I really don't know how to contribute to Expensify.

[kaomoua]

Hi. I can not see the proposal of @situchan. But how was he assigned to this issue?
I am new here and I really don't know how to contribute to Expensify.

[pradeepmdk]

@kaomoua he is a C+ member so he only going to review our proposal. you need to post the root cause and
solution here

[kaomoua]

@pradeepmdk You mean this issue is still available?

[situchan]

@StevenKKC thanks for your proposal. Please avoid code diff but explain in plain English

[situchan]

@kaomoua as a new contributor, please review our contributing guidelines. As this GH has Help Wanted label, still open for proposals.

[kaomoua]

#16108
Could you please check this issue? I posted my proposal and can not see other ones.
But this issues was assigned to other developer.
What happened?

[StevenKKC]

@situchan Thanks for your review. I have updated my proposal.

[pradeepmdk]

@kaomoua only the Help Wanted label we need to look that and check the guidelines contributing guidelines. like this

[situchan]

@StevenKKC your root cause is correct. Does your solution work on paid IOU report as well?

[meedwire]

Contributor details
Your Expensify account email: l.jeronimo12345@gmail.com
Upwork Profile Link: https://www.upwork.com/freelancers/leonardos24

The bug seems to be a relatively simple issue. It appears to be a remnant of a previous state and is being caused by a delay in state updating. The state should be cleared during the transition, or the state update should be optimized so that the transition isn't noticeable. There are several ways to accomplish this, such as handling it within the click action itself, forcing the dismounting and remounting of the screen, or creating a new instance of the screen. With my in-depth understanding of these processes and strong technical abilities, I am well-equipped to tackle this issue, ensuring a seamless user experience.

[melvin-bot]

✅ Contributor details stored successfully. Thank you for contributing to Expensify!

[StevenKKC]

@situchan I have tested on paid IOU report and works as well.

[situchan]

@StevenKKC's proposal looks good to me. Fixing optimistic data is the only solution.
🎀 👀 🎀 C+ reviewed

[melvin-bot]

Triggered auto assignment to @cristipaval, see https://stackoverflow.com/c/expensify/questions/7972 for more details.

[StevenKKC]

@situchan PR #24551 is ready for review.

[melvin-bot]

🎯 ⚡️ Woah @situchan / @StevenKKC, great job pushing this forwards! ⚡️

The pull request got merged within 3 working days of assignment, so this job is eligible for a 50% #urgency bonus 🎉

• when @StevenKKC got assigned: 2023-08-14 11:00:21 Z
• when the PR got merged: 2023-08-16 18:36:35 UTC

On to the next one 🚀

[melvin-bot]

Reviewing label has been removed, please complete the "BugZero Checklist".

[melvin-bot]

The solution for this issue has been 🚀 deployed to production 🚀 in version 1.3.55-8 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

• fix workspace avatar shows U before reverting to actual avatar in IOU view #24551

If no regressions arise, payment will be issued on 2023-08-28. 🎊

After the hold period is over and BZ checklist items are completed, please complete any of the applicable payments for this issue, and check them off once done.

• External issue reporter
• Contributor that fixed the issue
• Contributor+ that helped on the issue and/or PR

For reference, here are some details about the assignees on this issue:

• @situchan requires payment offer (Reviewer)
• @StevenKKC requires payment offer (Contributor)

As a reminder, here are the bonuses/penalties that should be applied for any External issue:

• Merged PR within 3 business days of assignment - 50% bonus
• Merged PR more than 9 business days after assignment - 50% penalty

[melvin-bot]

BugZero Checklist: The PR fixing this issue has been merged! The following checklist (instructions) will need to be completed before the issue can be closed:

• [@situchan] The PR that introduced the bug has been identified. Link to the PR:
• [@situchan] The offending PR has been commented on, pointing out the bug it caused and why, so the author and reviewers can learn from the mistake. Link to comment:
• [@situchan] A discussion in #expensify-bugs has been started about whether any other steps should be taken (e.g. updating the PR review checklist) in order to catch this type of bug sooner. Link to discussion:
• [@situchan] Determine if we should create a regression test for this bug.
• [@situchan] If we decide to create a regression test for the bug, please propose the regression test steps to ensure the same bug will not reach production again.
• [@flaviadefaria] Link the GH issue for creating/updating the regression test once above steps have been agreed upon:

[StevenKKC]

@flaviadefaria Could you please process payment?

[situchan]

• The PR that introduced the bug has been identified. Link to the PR: [Manual Requests] Create thread for Manual Request when opening IOUPreview #18760
• The offending PR has been commented on, pointing out the bug it caused and why, so the author and reviewers can learn from the mistake. Link to comment: https://github.com/Expensify/App/pull/18760/files#r1310023010

This is minor UI bug and offline test is already in PR checklist. So no regression test is needed

[flaviadefaria]

Thanks @situchan
@StevenKKC I was OoO, will process payment now.

[flaviadefaria]

Payment is as follow:

• No reporting bonus (bug reported by Applause)
• @StevenKKC = $1000 + $500 bonus = $1500 (UW)
• @situchan = $1000 + $500 bonus = $1500 (should request in ND)

[flaviadefaria]

@StevenKKC has been paid. I'll switch this to weekly and close when @situchan has been paid.

[situchan]

@flaviadefaria I am still using upwork. Already accepted offer made by Melvin - #24325 (comment)

[flaviadefaria]

@situchan I just paid you in UW. Closing this as completed.