[Due for Payment 7th July] [$250] Accounting - "X minutes ago" text is incorrectly translated for the new languages

[vincdargento]

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.1.68-3
Reproducible in staging?: Yes
Reproducible in production?: N/A - new feature, doesn't exist in prod
If this was caught during regression testing, add the test name, ID and link from TestRail: #64282
Email or phone of affected tester (no customers): N/A
Issue reported by: Applause Internal Team
Device used: All
App Component: Other

Action Performed:

Precondition: Expensifail account is an admin of a workspace with QBO connected.

1. Navigate to https://staging.new.expensify.com/
2. Log in with an Expensifail account
3. Navigate to Account - Preferences - Language
4. Click on "Deutsch"
5. Navigate to Workspace settings - Accounting

Expected Result:

Text should be properly translated.

Actual Result:

Accounting "X minutes ago" text is incorrectly translated for the new languages.

Workaround:

Unknown

Platforms:

• Android: App
• Android: mWeb Chrome
• iOS: App
• iOS: mWeb Safari
• iOS: mWeb Chrome
• Windows: Chrome
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

bug.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021935403648215033304
• Upwork Job ID: 1935403648215033304
• Last Price Increase: 2025-06-18
• Automatic offers:
• dominictb | Reviewer | 107742804
• linhvovan29546 | Contributor | 107742805

Issue Owner

Current Issue Owner: @

[melvin-bot]

Current assignee @trjExpensify is eligible for the Bug assigner, not assigning anyone new.

[neonbhai]

Proposal

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

Connnection Date strings are partially translated.

What is the root cause of that problem?

This happens as we don't have the new languages as part of the locale here:

App/src/libs/DateUtils.ts

Lines 130 to 141 in 1c125ab

	function setLocale(localeString: Locale | undefined) {
	switch (localeString) {
	case CONST.LOCALES.EN:
	setDefaultOptions({locale: enGB});
	break;
	case CONST.LOCALES.ES:
	setDefaultOptions({locale: es});
	break;
	default:
	break;
	}
	}

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

We will import the respective languages in DateUtils.ts:

import {de} from 'date-fns/locale/de';
import {fr} from 'date-fns/locale/fr';
import {it} from 'date-fns/locale/it';
import {ja} from 'date-fns/locale/ja';
import {nl} from 'date-fns/locale/nl';
import {pl} from 'date-fns/locale/pl';
import {ptBR} from 'date-fns/locale/pt-BR';
import {zhCN} from 'date-fns/locale/zh-CN';

We will add a Map for languages in app to date-fn languages.

const dateFnsLocaleMap = {
    [CONST.LOCALES.EN]: enGB,
    [CONST.LOCALES.ES]: es,
    [CONST.LOCALES.DE]: de,
    [CONST.LOCALES.FR]: fr,
    [CONST.LOCALES.IT]: it,
    [CONST.LOCALES.JA]: ja,
    [CONST.LOCALES.NL]: nl,
    [CONST.LOCALES.PL]: pl,
    [CONST.LOCALES.PT_BR]: ptBR,
    [CONST.LOCALES.ZH_HANS]: zhCN, // Map zh-hans to zh-CN since that's what date-fns uses
} as const;

Then use the Map values in setLocale here:

function setLocale(localeString: Locale | undefined) {
    if (!localeString) {
        return;
    }
    
    const dateFnsLocale = dateFnsLocaleMap[localeString as keyof typeof dateFnsLocaleMap];
    if (dateFnsLocale) {
        setDefaultOptions({locale: dateFnsLocale});
    } else {
        // Default to English if locale not found
        setDefaultOptions({locale: enGB});
    }
}

Use this in datetimeToRelative function here

 function datetimeToRelative(locale: Locale | undefined, datetime: string): string {
    const date = getLocalDateFromDatetime(locale, datetime);
    const now = getLocalDateFromDatetime(locale);
-  return formatDistance(date, now, {addSuffix: true, locale: locale === CONST.LOCALES.EN ? enGB : es});
   
+    // Get the appropriate date-fns locale object, defaulting to English
+    const dateFnsLocale = locale ? dateFnsLocaleMap[locale as keyof typeof dateFnsLocaleMap] : enGB;
+    const localeToUse = dateFnsLocale || enGB;
    
+    return formatDistance(date, now, {addSuffix: true, locale: localeToUse});
}

What alternative solutions did you explore? (Optional)

We can use the original switch case to map the languages in setLocale here, but I recommend a map since that is cleaner approach.

[neonbhai]

Hey @trjExpensify @roryabraham 👋 I can help fix this with Proposal here

[melvin-bot]

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

[melvin-bot]

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

[trjExpensify]

@dominictb can you review the proposal, please?