[Due for payment 2025-02-19] [HOLD for payment 2025-02-07] [$250] Profile - Display Name Not Live Updated When Adding Legal Name to New Account

[IuliiaHerets]

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

---

Version Number: v9.0.65-1
Reproducible in staging?: Y
Reproducible in production?: Y
Email or phone of affected tester (no customers): applausetester+tw33434343553@applause.expensifail.com
Issue reported by: Applause Internal Team

Action Performed:

1. Create a new account and navigate to Settings.
2. Go to Profile, add a legal name, and observe that the Display Name is not updated.
3. Refresh the page; the Display Name remains unchanged.

Expected Result:

When a legal name is added to a newly created account (or an account without a previously set display name), the Display Name should automatically inherit the legal name and update in real time.

Actual Result:

The Display Name does not update live after adding a legal name. It only updates after navigating back.

Workaround:

Unknown

Platforms:

• Android: Standalone
• Android: HybridApp
• Android: mWeb Chrome
• iOS: Standalone
• iOS: HybridApp
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Bug6671636_1732178835063.Screen_Recording_2024-11-21_at_12.31.52_AM.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021861461957491636641
• Upwork Job ID: 1861461957491636641
• Last Price Increase: 2024-12-03

Issue Owner

Current Issue Owner: @zanyrenney

[melvin-bot]

Triggered auto assignment to @zanyrenney (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details. Please add this bug to a GH project, as outlined in the SO.

[Themoonalsofall]

Edited by proposal-police: This proposal was edited at 2024-11-21 13:34:28 UTC.

Proposal

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

Profile - Display Name Not Live Updated When Adding Legal Name to New Account

What is the root cause of that problem?

When we call api updateLegalName we are not updating displayName in personalDetails Onyx

App/src/libs/actions/PersonalDetails.ts

Lines 126 to 135 in 5955bd7

	optimisticData: [
	{
	onyxMethod: Onyx.METHOD.MERGE,
	key: ONYXKEYS.PRIVATE_PERSONAL_DETAILS,
	value: {
	legalFirstName,
	legalLastName,
	},
	},
	],

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

We should update displayName in personalDetails Onyx base on legalFirstName, legalLastName when displayName is equal to login (default value) or we don't have both firstName and lastName

like BE is returning when we call OpenReport API

           {
                onyxMethod: Onyx.METHOD.MERGE,
                key: ONYXKEYS.PERSONAL_DETAILS_LIST,
                value: {
                    [currentUserAccountID]: {
                        displayName: PersonalDetailsUtils.createDisplayName(currentUserEmail ?? '', {
                            legalFirstName,
                            legalLastName,
                        }),
                    },
                },
            },

We can update field firstName and lastName too

What alternative solutions did you explore? (Optional)

[huult]

Edited by proposal-police: This proposal was edited at 2024-11-22 15:42:19 UTC.

Proposal

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

Display Name Not Live Updated When Adding Legal Name to New Account

What is the root cause of that problem?

When we call updateLegalName to update the legal name, we do not call updateDisplayName, so the display name will not be updated.

App/src/pages/settings/Profile/PersonalDetails/LegalNamePage.tsx

Line 24 in 44b2f77

PersonalDetails.updateLegalName(values.legalFirstName?.trim() ?? '', values.legalLastName?.trim() ?? '');

And we can see the update when navigating back because openReport has updated the display name.

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

To resolve this issue, we must call updateDisplayName when the legal name is changed. Some thing like this:

//src/pages/settings/Profile/PersonalDetails/LegalNamePage.tsx#L23
const updateLegalName = (values: PrivatePersonalDetails) => {
+    PersonalDetails.updateDisplayName(values.legalFirstName?.trim() ?? '', values.legalLastName?.trim() ?? '');
    PersonalDetails.updateLegalName(values.legalFirstName?.trim() ?? '', values.legalLastName?.trim() ?? '');
};

POC

Screen.Recording.2024-11-22.at.22.26.47.mov

What alternative solutions did you explore? (Optional)

Alternative 1

Or, if we only want to update the display name during the first legal name update, it could be something like this:

We must move updateLegalName to line 32

//src/pages/settings/Profile/PersonalDetails/LegalNamePage.tsx#L32
    const updateLegalName = (values: PrivatePersonalDetails) => {
+        if (!privatePersonalDetails?.legalFirstName || !privatePersonalDetails?.legalLastName) {
+            PersonalDetails.updateDisplayName(values.legalFirstName?.trim() ?? '', values.legalLastName?.trim() ?? '');
+        }
        PersonalDetails.updateLegalName(values.legalFirstName?.trim() ?? '', values.legalLastName?.trim() ?? '');
    };

Alternative 2

Or, if we only want to update the display name when it is null or set to an email, it could look like this:

//src/pages/settings/Profile/PersonalDetails/LegalNamePage.tsx#L32
+    const currentUserPersonalDetails = useCurrentUserPersonalDetails();
+    const [session] = useOnyx(ONYXKEYS.SESSION);

     const updateLegalName = (values: PrivatePersonalDetails) => {
+        if (!currentUserPersonalDetails?.displayName || currentUserPersonalDetails?.displayName === session?.email) {
+            PersonalDetails.updateDisplayName(values.legalFirstName?.trim() ?? '', values.legalLastName?.trim() ?? '');
+        }
        PersonalDetails.updateLegalName(values.legalFirstName?.trim() ?? '', values.legalLastName?.trim() ?? '');
    };

Note: Or, when updating the display name, we will discuss and make updates accordingly.

[melvin-bot]

@zanyrenney Uh oh! This issue is overdue by 2 days. Don't forget to update your issues!

[melvin-bot]

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

[melvin-bot]

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

[zanyrenney]

@alitoshmatov we already have two proposals, please can you review? Thanks!

[nkdengineer]

Proposal

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

The Display Name does not update live after adding a legal name. It only updates after navigating back.

What is the root cause of that problem?

Now, if the user doesn't set the display name, the default display name is the user's login. When we update the legal name and the display name is still the default, the backend only returns the updated data for firstName and lastName in the current user's personal details.

This bug will not happen in the past because displayName is empty by default and in this case will display ${firstName} ${lastName} or login.

Now displayName is the login by default so the UI still displays it if we only update firstName, lastName.

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

1. We decided the optimistic data was unimportant when we updated the legal name here. And it can be wrong in the case of device 1 we update the legal name offline and online after device 2 updates the display name online.

2. For the bug the display name is not live updated, it has the same RCA with a bug here that is closed because we don't prioritize. We can use my solution in this issue to fix the case here. Update the displayName in Onyx whenever it's outdated.

callback: (val) => {
    Object.keys(val ?? {}).map((accountID) => {
        const details = val?.[accountID];
        const createDisplayName = PersonalDetailsUtils.createDisplayName(details?.login ?? '', details);
        if (createDisplayName !== details?.displayName) {
            Onyx.merge(ONYXKEYS.PERSONAL_DETAILS_LIST, {
                [accountID]: {
                    displayName: createDisplayName
                }
            })
        }
    })
    allPersonalDetails = val
},

App/src/libs/actions/PersonalDetails.ts

Line 47 in c4ff235

callback: (val) => (allPersonalDetails = val),

What alternative solutions did you explore? (Optional)

[melvin-bot]

@zanyrenney, @alitoshmatov Eep! 4 days overdue now. Issues have feelings too...

[melvin-bot]

📣 It's been a week! Do we have any satisfactory proposals yet? Do we need to adjust the bounty for this issue? 💸

[alitoshmatov]

@Themoonalsofall Thank you for your proposal, your RCA is correct and solution solve the issue

[alitoshmatov]

@huult Thank you for your proposal, your RCA is also correct. your solution is very similar to previous proposal

[alitoshmatov]

@nkdengineer Thank you for your proposal, your solution is still not working in offline and I don't think overloading callback function with another onyx update is a good idea.

[alitoshmatov]

I think we can go with @Themoonalsofall 's proposal which applies optimistically updates first name, lastname, and display name when display name is default value

C+ reviewed 🎀 👀 🎀

[melvin-bot]

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

[melvin-bot]

📣 @Themoonalsofall You have been assigned to this job!
Please apply to the Upwork job and leave a comment on the Github issue letting us know when we can expect a PR to be ready for review 🧑‍💻
Once you apply to this job, your Upwork ID will be stored and you will be automatically hired for future jobs!
Keep in mind: Code of Conduct | Contributing 📖

[melvin-bot]

Payment Summary

Upwork Job

• Reviewer: @alitoshmatov owed $250 via NewDot
• ROLE: @Themoonalsofall paid $(AMOUNT) via Upwork (LINK)

BugZero Checklist (@zanyrenney)

• I have verified the correct assignees and roles are listed above and updated the neccesary manual offers
• I have verified that there are no duplicate or incorrect contracts on Upwork for this job (https://www.upwork.com/ab/applicants/1861461957491636641/hired)
• I have paid out the Upwork contracts or cancelled the ones that are incorrect
• I have verified the payment summary above is correct

[alitoshmatov]

Let's hold for #56399 follow up PR which fixes a mistake that we overlook on original PR.

[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 9.0.97-1 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

• Follow up update display name #56399

If no regressions arise, payment will be issued on 2025-02-19. 🎊

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

• @alitoshmatov requires payment through NewDot Manual Requests
• @Themoonalsofall requires payment (Needs manual offer from BZ)

[melvin-bot]

@alitoshmatov @zanyrenney @alitoshmatov The PR fixing this issue has been merged! The following checklist (instructions) will need to be completed before the issue can be closed. Please copy/paste the BugZero Checklist from here into a new comment on this GH and complete it. If you have the K2 extension, you can simply click: [this button]

[alitoshmatov]

BugZero Checklist:

• [Contributor] Classify the bug:

Bug classification

Source of bug:

• 1a. Result of the original design (eg. a case wasn't considered)
• 1b. Mistake during implementation
• 1c. Backend bug
• 1z. Other:

Where bug was reported:

• 2a. Reported on production (eg. bug slipped through the normal regression and PR testing process on staging)
• 2b. Reported on staging (eg. found during regression or PR testing)
• 2d. Reported on a PR
• 2z. Other:

Who reported the bug:

• 3a. Expensify user
• 3b. Expensify employee
• 3c. Contributor
• 3d. QA
• 3z. Other:

• [Contributor] 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/14290/files#r1959671310

• [Contributor] If the regression was CRITICAL (e.g. interrupts a core flow) A discussion in #expensify-open-source 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: No discussion started

• [Contributor] If it was decided to create a regression test for the bug, please propose the regression test steps using the template below to ensure the same bug will not reach production again.

• [BugZero Assignee] Create a GH issue for creating/updating the regression test once above steps have been agreed upon.

  Link to issue:

Regression Test Proposal

Test:

1. Create new account
2. In onboarding modal select 'Manage my team's expenses' and finish onboarding flow. To avoid setting a name
3. Go to Profile settings
4. Update your legal name
5. Make sure the display name is also updated

Do we agree 👍 or 👎

[melvin-bot]

Payment Summary

Upwork Job

• Reviewer: @alitoshmatov owed $250 via NewDot
• ROLE: @Themoonalsofall paid $(AMOUNT) via Upwork (LINK)

BugZero Checklist (@zanyrenney)

• I have verified the correct assignees and roles are listed above and updated the neccesary manual offers
• I have verified that there are no duplicate or incorrect contracts on Upwork for this job (https://www.upwork.com/ab/applicants/1861461957491636641/hired)
• I have paid out the Upwork contracts or cancelled the ones that are incorrect
• I have verified the payment summary above is correct

[JmillsExpensify]

Can I get a payment summary on this issue?

[zanyrenney]

Just getting the regression test done and then will add the payment summary, Jason!

[zanyrenney]

https://github.com/Expensify/Expensify/issues/473232

[zanyrenney]

payment summary
@alitoshmatov requires payment through NewDot Manual Requests - owed $250
@Themoonalsofall requires payment (Needs manual offer from BZ) - sent a manual job offer on upwork.

[zanyrenney]

https://www.upwork.com/jobs/~021892984706846801193 - @Themoonalsofall here is the job.

[zanyrenney]

@Themoonalsofall offer sent!

[zanyrenney]

payment summary
@alitoshmatov requires payment through NewDot Manual Requests - owed $250
@Themoonalsofall requires payment (Needs manual offer from BZ) - paid $250 via upwork job.

[JmillsExpensify]

$250 approved for @alitoshmatov