[Awaiting Payment 2nd Sept] [Workspace Feeds] [$250] Spanish - "Hidden" is not translated to Spanish when going to card details in WS menu

[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!

---

Version Number: 9.0.16
Reproducible in staging?: Y
Reproducible in production?: Y
If this was caught during regression testing, add the test name, ID and link from TestRail: N/A
Email or phone of affected tester (no customers): applausetester+en@applause.expensifail.com
Issue reported by: Applause - Internal Team

Action Performed:

PreCond: App is in Spanish

1. Access New Expensify app
2. Sign into a valid account (Beta Enabled)
3. Go to a WS > Members > Invite a beta member
4. Click on Member name > Click on Assigned Cards section > Observe the CardHolder section

Expected Result:

User expects "Hidden" to be translated to Spanish

Actual Result:

Hidden shows in English, although the app is in Spanish

Workaround:

Unknown

Platforms:

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

• Android: Native
• Android: mWeb Chrome
• iOS: Native
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Add any screenshot/video evidence

Bug6559459_1722536165365.Hidden_is_not_translated_to_Spanish_in_WS_settings.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~01dce39aec75aaa4cf
• Upwork Job ID: 1820464850160123531
• Last Price Increase: 2024-08-05
• Automatic offers:
• DylanDylann | Contributor | 103492615

Issue Owner

Current Issue Owner: @slafortune

[melvin-bot]

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

[lanitochka17]

@slafortune FYI I haven't added the External label as I wasn't 100% sure about this issue. Please take a look and add the label if you agree it's a bug and can be handled by external contributors

[Krishna2323]

Edited by proposal-police: This proposal was edited at 2024-08-06 09:16:20 UTC.

Proposal

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

Spanish - "Hidden" is not translated to Spanish when going to card details in WS menu

What is the root cause of that problem?

hiddenTranslation and youTranslation is defined outside of getDisplayNameOrDefault and due to this the hidden translation is never re-calculated.

App/src/libs/PersonalDetailsUtils.ts

Lines 36 to 45 in c72f7a9

	const hiddenTranslation = Localize.translateLocal('common.hidden');
	const youTranslation = Localize.translateLocal('common.you').toLowerCase();
	const regexMergedAccount = new RegExp(CONST.REGEX.MERGED_ACCOUNT_PREFIX);
	function getDisplayNameOrDefault(passedPersonalDetails?: Partial<PersonalDetails> | null, defaultValue = '', shouldFallbackToHidden = true, shouldAddCurrentUserPostfix = false): string {
	let displayName = passedPersonalDetails?.displayName ?? '';
	// If the displayName starts with the merged account prefix, remove it.
	if (regexMergedAccount.test(displayName)) {

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

Move hiddenTranslation and youTranslation inside getDisplayNameOrDefault.

What alternative solutions did you explore? (Optional)

We can also use useMemo to recalculate the display name when preferredLocale changes.

App/src/pages/workspace/expensifyCard/WorkspaceExpensifyCardDetailsPage.tsx

Line 62 in c72f7a9

const displayName = PersonalDetailsUtils.getDisplayNameOrDefault(cardholder);

const displayName = useMemo(() => PersonalDetailsUtils.getDisplayNameOrDefault(cardholder), [preferredLocale, cardholder]);

What alternative solutions did you explore? (Optional 2)

We can remove the hiddenTranslation & youTranslation constants and directly use Localize.translateLocal when the translation in needed, this way the calculation will only happen when needed. I believe we only need hiddenTranslation & youTranslation in special cases so even if we recalculate it when needed it won't cause any issue.

App/src/libs/PersonalDetailsUtils.ts

Line 57 in c72f7a9

displayName = `${displayName} (${youTranslation})`;

To:

displayName = `${displayName} (${Localize.translateLocal('common.you').toLowerCase()})`;

App/src/libs/PersonalDetailsUtils.ts

Line 67 in c72f7a9

return defaultValue || (shouldFallbackToHidden ? hiddenTranslation : '');

To:

return defaultValue || (shouldFallbackToHidden ? Localize.translateLocal('common.hidden') : '');

[github-actions]

true

[melvin-bot]

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

[melvin-bot]

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