[$1000] Web - Country search input is cleared/reset when updating language on another device

[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 to any account
2. Go to Settings -> Profile -> Persona details -> Home address -> Country
3. Type any text to search a country
4. Go to another device, login same account
5. Change to another language on this device

Expected Result:

Country search input should be remain current search text when updating language on another device

Actual Result:

Country search input is cleared/reset when updating language on another device

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.47-2
Reproducible in staging?: y
Reproducible in production?: y
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-07-28.at.21.48.37.mov

Recording.3990.mp4

Expensify/Expensify Issue URL:
Issue reported by: @hoangzinh
Slack conversation: https://expensify.slack.com/archives/C049HHMV9SM/p1690556043839129

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~016ec8ed64c16cfa11
• Upwork Job ID: 1694407216392552448
• Last Price Increase: 2023-08-23

[melvin-bot]

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

[kbecciv]

Proposal by: @hoangzinh
Slack conversation: https://expensify.slack.com/archives/C049HHMV9SM/p1690556043839129

Proposal

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

Country search input is cleared/reset when updating language on another device

What is the root cause of that problem?

In the CountryPicker, we have a useEffect that reset the search text value when allCountries is changed. allCountries is changed when preferred language changed => when preferred language changed it reset the search text value, in this case it will reset to an empty string.

App/src/components/CountryPicker/index.js

Lines 38 to 40 in 28644a5

	useEffect(() => {
	setSearchValue(lodashGet(allCountries, value, ''));
	}, [value, allCountries]);

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

I guess the useEffect above is used to set search text value when props.value is changed, then it will be used in the CountrySelectorModal
So I think we can remove the useEffect above and call set search text value with props.value in the show picker modal callback here

App/src/components/CountryPicker/index.js

Lines 42 to 44 in 28644a5

	const showPickerModal = () => {
	setIsPickerVisible(true);
	};

[alexpensify]

Not overdue - I was assigned over the weekend and will test soon.

[alexpensify]

There are some upcoming changes to the Country selector. I'm going to put it on hold to confirm if this behavior still happens when the update goes to production.

[hoangzinh]

@alexpensify could you point to the PR or GH Issue about those changes? Thanks

[alexpensify]

I believe the options will become dropdown following this update: #22018

[hoangzinh]

@alexpensify I just reviewed the PR above, but I think it's only fix the initial value of country. Btw, the PR you mentioned above is deployed to staging.

[alexpensify]

Thanks for flagging, I'll test again to confirm if we get the same experience now. @hoangzinh please test too and share if you get the same result as before.

[hoangzinh]

@alexpensify I still reproduce the bug in latest staging

Screen.Recording.2023-08-17.at.23.49.05.mp4

[melvin-bot]

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

[melvin-bot]

Triggered auto assignment to @anmurali (External), see https://stackoverflow.com/c/expensify/questions/8582 for more details.

[melvin-bot]

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

[tienifr]

@allroundexperts yes, it causes the behavior inconsistency between the CountryPicker and StatePicker

Currently it's consistent, after the PR it's not consistent any more 😄

I agree let's minimize discussion here and wait for the final call from @puneetlath!

[tienifr]

And I think StatePicker is quite beyond of scope of this issue, but thanks @tienifr for pointing out.

I think we have too much of these discussions, since both add value here, if @hoangzinh agrees we can split bounty and you can go ahead with the PR (and have the speed bonus if any) 🤝. We should foster more collaboration and try to add as much value as possible to Expensify!

[alexpensify]

@puneetlath - we need some feedback here, thanks!

[puneetlath]

Hi, sorry, I know I'm coming into this super late, but I'm not sure I agree that this is a bug. Is this a real scenario, where a user would change their language preference on one device while actively using the product in another?

And if they did, I don't think the user would be surprised to see the input cleared in that scenario. That behavior feels fine and normal to me.

I know a lot of work has gone into this already, so my apologies, but my vote would be to close this issue.

[tienifr]

And if they did, I don't think the user would be surprised to see the input cleared in that scenario. That behavior feels fine and normal to me.

@puneetlath Other inputs (like the Pronouns selection) behave differently in that scenario (it won't be cleared), so would that be a valid inconsistency?

[alexpensify]

@puneetlath can we get your feedback again or should we move this to Slack for a bigger discussion?

[puneetlath]

Does this have to be handled on an input-by-input basis? Or in other words, do the other inputs do what the proposal suggests?

I would be down for a global solution. But if we have to handle each input individually and then remember to do it for every one going forward, I don't think this is worth our time just for the two tabs scenario.

[tienifr]

Does this have to be handled on an input-by-input basis?

@puneetlath No, this just happens for 2 inputs due to redundant code that can be removed (more details here).

Or in other words, do the other inputs do what the proposal suggests?

Yes, other inputs already work fine.

But if we have to handle each input individually and then remember to do it for every one going forward, I don't think this is worth our time just for the two tabs scenario.

We don't have to add anything to future inputs going forward, only the 2 inputs above need to be fixed.

[puneetlath]

Ok got it, thanks for the clarifications. I'm going to go ahead and assign @hoangzinh as @allroundexperts suggested.

[tienifr]

@puneetlath FYI @hoangzinh's proposal only fixes 1 instance of the issue and my proposal fixes the full scope. There was a bounty split discussed and @hoangzinh agrees with it here with the thumbs up. Do you want to assign both or just handle the split later during payment?

[puneetlath]

Ah cool, that sounds good and works for me.

[hoangzinh]

Oh it seems Melvin bot is not triggered the auto hire flow. Btw I gonna create the PR first.

[hoangzinh]

I found that the bug we would like to fix here that has been fixed in this PR already #26066. I couldn't reproduce the bug in the latest main branch

[allroundexperts]

Wow. I guess we can close this then!

[puneetlath]

Ah wow ok. Well thanks for your effort! Onto the next one.

[hoangzinh]

@puneetlath Can I get reporting bug bonus? Because I reported before the bug that I mentioned here #23851 (comment)

[puneetlath]

Hmm, yes I suppose your bug was reported first. Can you go ahead and apply to the job?

[alexpensify]

I'm OOO until Thursday but will work on the required process when I return. The key is applying to the job. Thanks!

[hoangzinh]

Thanks @puneetlath . I applied the job link here #23851 (comment)

[puneetlath]

All handled. Thanks y'all for all the effort.

[alexpensify]

Thanks @puneetlath -- no action on my end. The payment was sent via Upwork.