Fixes #3824

jcbrand · jcbrand · commit 4fd4b0dffd30 · 2025-10-17T08:17:22.000+02:00
Currently there are two different instances of DayJS. One in
`@converse/headless`, imported in `src/headless/shared/api/public.js`
and another in the UI code, which comes in via the dynamic import of the
DayJS locale.

The bug was that the locale was being set for the UI-code DayJS, but it
should be set for the headless one.

The UI-code DayJS is part of the dynamic import of the locale, but is
otherwise not used.

It would of course be nice to have only one instance, but I'm not sure
how this can be achieved while keeping dynamic imports of DayJS
translations in the UI-code.
diff --git a/CHANGES.md b/CHANGES.md
@@ -2,6 +2,7 @@
 
 ## Next release
 
+- #3824: Dates and times are not translated 
 - #3829: Rich text from LibreOffice Calc is sent as screenshots
 - #3830: The message textarea blocks undo of the pasted text
 - #3863: Shift `unescapeHTML` helper function (used to set `isOnlyEmoji` on a message) to converse-headless
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -138,7 +138,6 @@
     "@converse/log": "file:src/log",
     "bootstrap": "^5.3.3",
     "client-compress": "^2.2.2",
-    "dayjs": "^1.11.8",
     "dompurify": "^3.0.8",
     "favico.js-slevomat": "^0.3.11",
     "gifuct-js": "^2.1.2",
diff --git a/src/headless/index.js b/src/headless/index.js
@@ -1,12 +1,4 @@
-import dayjs from 'dayjs';
-import advancedFormat from 'dayjs/plugin/advancedFormat';
-import localizedFormat from 'dayjs/plugin/localizedFormat';
-
 import log from '@converse/log';
-
-dayjs.extend(advancedFormat);
-dayjs.extend(localizedFormat);
-
 import { _converse, api, constants as shared_constants, i18n, parsers } from './shared/index.js';
 import u from './utils/index.js';
 import converse from './shared/api/public.js';
diff --git a/src/headless/plugins/chat/api.js b/src/headless/plugins/chat/api.js
@@ -143,7 +143,7 @@ export default {
             }
             if (jids === undefined) {
                 const chats = await api.chatboxes.get();
-                return chats.filter(c => (c.get('type') === PRIVATE_CHAT_TYPE));
+                return chats?.filter(c => (c.get('type') === PRIVATE_CHAT_TYPE)) ?? [];
             } else if (typeof jids === 'string') {
                 return _get(jids);
             }
diff --git a/src/headless/plugins/chat/parsers.js b/src/headless/plugins/chat/parsers.js
@@ -4,7 +4,6 @@
 import _converse from '../../shared/_converse.js';
 import api from '../../shared/api/index.js';
 import converse from '../../shared/api/public.js';
-import dayjs from 'dayjs';
 import log from "@converse/log";
 import u from '../../utils/index.js';
 import { rejectMessage } from '../../shared/actions.js';
@@ -29,7 +28,7 @@ import {
     throwErrorIfInvalidForward,
 } from '../../shared/parsers';
 
-const { Strophe, sizzle } = converse.env;
+const { Strophe, dayjs, sizzle } = converse.env;
 
 /**
  * Parses a passed in message stanza and returns an object of attributes.
diff --git a/src/headless/plugins/headlines/api.js b/src/headless/plugins/headlines/api.js
@@ -45,7 +45,7 @@ export default {
 
             if (jids === undefined) {
                 const chats = await api.chatboxes.get();
-                return chats.filter(c => (c.get('type') === HEADLINES_TYPE));
+                return chats?.filter(c => (c.get('type') === HEADLINES_TYPE)) ?? [];
             } else if (typeof jids === 'string') {
                 return _get(jids);
             }
diff --git a/src/headless/plugins/mam/api.js b/src/headless/plugins/mam/api.js
@@ -1,15 +1,14 @@
+import sizzle from "sizzle";
+import { Strophe, Stanza } from 'strophe.js';
+import log from "@converse/log";
 import _converse from '../../shared/_converse.js';
 import api from '../../shared/api/index.js';
 import converse from '../../shared/api/public.js';
-import dayjs from 'dayjs';
-import log from "@converse/log";
-import sizzle from "sizzle";
 import { RSM } from '../../shared/rsm.js';
-import { Strophe, Stanza } from 'strophe.js';
 import { TimeoutError } from '../../shared/errors.js';
 
 const { NS } = Strophe;
-const { stx, u } = converse.env;
+const { dayjs, stx, u } = converse.env;
 
 
 export default {
diff --git a/src/headless/plugins/muc/api.js b/src/headless/plugins/muc/api.js
@@ -161,7 +161,7 @@ const rooms = {
         }
         if (jids === undefined) {
             const chats = await chatboxes.get();
-            return chats.filter((c) => c.get('type') === CHATROOMS_TYPE);
+            return chats?.filter((c) => c.get('type') === CHATROOMS_TYPE) ?? [];
         } else if (typeof jids === 'string') {
             return _get(jids);
         }
diff --git a/src/headless/plugins/muc/parsers.js b/src/headless/plugins/muc/parsers.js
@@ -3,7 +3,6 @@
  * @typedef {import('../muc/muc.js').default} MUC
  * @typedef {import('./types').MUCMessageAttributes} MUCMessageAttributes
  */
-import dayjs from 'dayjs';
 import _converse from '../../shared/_converse.js';
 import api from '../../shared/api/index.js';
 import converse from '../../shared/api/public.js';
@@ -29,7 +28,7 @@ import {
 } from '../../shared/parsers';
 import { STATUS_CODE_STANZAS } from './constants.js';
 
-const { Strophe, sizzle, u } = converse.env;
+const { Strophe, dayjs, sizzle, u } = converse.env;
 const { NS } = Strophe;
 
 /**
diff --git a/src/headless/shared/api/public.js b/src/headless/shared/api/public.js
@@ -3,6 +3,8 @@
  */
 import { sprintf } from 'sprintf-js';
 import dayjs from 'dayjs';
+import advancedFormat from 'dayjs/plugin/advancedFormat';
+import localizedFormat from 'dayjs/plugin/localizedFormat';
 import sizzle from 'sizzle';
 import { Stanza, Strophe, $build, $iq, $msg, $pres, stx } from 'strophe.js';
 import { Collection, Model } from "@converse/skeletor";
@@ -20,9 +22,6 @@ import { isTestEnv } from '../../utils/session.js';
 import { TimeoutError } from '../errors.js';
 import { initAppSettings } from '../settings/utils.js';
 import * as errors from '../errors.js';
-
-_converse.api = api;
-
 import {
     cleanup,
     initClientConfig,
@@ -31,6 +30,11 @@ import {
     registerGlobalEventHandlers,
 } from '../../utils/init.js';
 
+_converse.api = api;
+
+dayjs.extend(advancedFormat);
+dayjs.extend(localizedFormat);
+
 const env = /** @type {import('./types').ConverseEnv} */ {
     $build,
     $iq,
diff --git a/src/headless/shared/message.js b/src/headless/shared/message.js
@@ -1,4 +1,3 @@
-import dayjs from 'dayjs';
 import sizzle from 'sizzle';
 import { Strophe, $iq } from 'strophe.js';
 import { Model } from '@converse/skeletor';
@@ -10,6 +9,9 @@ import ColorAwareModel from '../shared/color.js';
 import ModelWithContact from '../shared/model-with-contact.js';
 import ModelWithVCard from '../shared/model-with-vcard';
 import { getUniqueId } from '../utils/index.js';
+import converse from './api/public.js';
+
+const { dayjs } = converse.env;
 
 class BaseMessage extends ModelWithVCard(ModelWithContact(ColorAwareModel(Model))) {
     defaults() {
diff --git a/src/headless/shared/parsers.js b/src/headless/shared/parsers.js
@@ -2,18 +2,18 @@
  * @module:headless-shared-parsers
  */
 import sizzle from 'sizzle';
-import _converse from './_converse.js';
-import api from './api/index.js';
-import dayjs from 'dayjs';
-import log from "@converse/log";
 import { Strophe } from 'strophe.js';
+import log from "@converse/log";
 import { decodeHTMLEntities } from '../utils/html.js';
 import { getAttributes } from '../utils/stanza.js';
 import { rejectMessage } from './actions.js';
 import { XFORM_TYPE_MAP,  XFORM_VALIDATE_TYPE_MAP } from './constants.js';
 import * as errors from './errors.js';
+import _converse from './_converse.js';
+import api from './api/index.js';
+import converse from './api/public.js';
 
-
+const { dayjs } = converse.env;
 const { NS } = Strophe;
 
 /**
diff --git a/src/headless/types/plugins/disco/api.d.ts b/src/headless/types/plugins/disco/api.d.ts
@@ -131,13 +131,13 @@ declare namespace _default {
                 name: string;
             }, options?: {
                 ignore_cache?: boolean;
-            }): false | import("@converse/skeletor").Model | (Promise<any> & {
+            }): false | import("@converse/skeletor").Model | import("@converse/skeletor/src/types/collection.js").Attributes | (Promise<any> & {
                 isResolved: boolean;
                 isPending: boolean;
                 isRejected: boolean;
                 resolve: Function;
                 reject: Function;
-            }) | import("@converse/skeletor/src/types/collection.js").Attributes;
+            });
         }
         export namespace features_1 {
             /**
diff --git a/src/headless/types/shared/message.d.ts b/src/headless/types/shared/message.d.ts
@@ -56,7 +56,7 @@ declare const BaseMessage_base: {
         _listeningTo: {};
         _listenId: any;
         off(name: string, callback: (event: any, model: Model, collection: import("@converse/skeletor").Collection, options: Record<string, any>) => any, context?: any): any;
-        stopListening(obj?: any, name?: string, callback?: (event: any, model: Model, collection: import("@converse/skeletor").Collection, options: Record<string, any>) => any): any;
+        stopListening(obj?: any, name?: string, callback?: (event: any, model: Model, collection: import("@converse/skeletor" /** @type {import('./types').MessageAttributes} */).Collection, options: Record<string, any>) => any): any;
         once(name: string, callback: (event: any, model: Model, collection: import("@converse/skeletor").Collection, options: Record<string, any>) => any, context: any): any;
         listenToOnce(obj: any, name: string, callback?: (event: any, model: Model, collection: import("@converse/skeletor").Collection, options: Record<string, any>) => any): any;
         trigger(name: string, ...args: any[]): any;
@@ -131,7 +131,7 @@ declare const BaseMessage_base: {
         _listeningTo: {};
         _listenId: any;
         off(name: string, callback: (event: any, model: Model, collection: import("@converse/skeletor").Collection, options: Record<string, any>) => any, context?: any): any;
-        stopListening(obj?: any, name?: string, callback?: (event: any, model: Model, collection: import("@converse/skeletor").Collection, options: Record<string, any>) => any): any;
+        stopListening(obj?: any, name?: string, callback?: (event: any, model: Model, collection: import("@converse/skeletor" /** @type {import('./types').MessageAttributes} */).Collection, options: Record<string, any>) => any): any;
         once(name: string, callback: (event: any, model: Model, collection: import("@converse/skeletor").Collection, options: Record<string, any>) => any, context: any): any;
         listenToOnce(obj: any, name: string, callback?: (event: any, model: Model, collection: import("@converse/skeletor").Collection, options: Record<string, any>) => any): any;
         trigger(name: string, ...args: any[]): any;
@@ -200,7 +200,7 @@ declare const BaseMessage_base: {
         _listeningTo: {};
         _listenId: any;
         off(name: string, callback: (event: any, model: Model, collection: import("@converse/skeletor").Collection, options: Record<string, any>) => any, context?: any): any;
-        stopListening(obj?: any, name?: string, callback?: (event: any, model: Model, collection: import("@converse/skeletor").Collection, options: Record<string, any>) => any): any;
+        stopListening(obj?: any, name?: string, callback?: (event: any, model: Model, collection: import("@converse/skeletor" /** @type {import('./types').MessageAttributes} */).Collection, options: Record<string, any>) => any): any;
         once(name: string, callback: (event: any, model: Model, collection: import("@converse/skeletor").Collection, options: Record<string, any>) => any, context: any): any;
         listenToOnce(obj: any, name: string, callback?: (event: any, model: Model, collection: import("@converse/skeletor").Collection, options: Record<string, any>) => any): any;
         trigger(name: string, ...args: any[]): any;
diff --git a/src/headless/types/shared/parsers.d.ts b/src/headless/types/shared/parsers.d.ts
@@ -40,7 +40,7 @@ export function getRetractionAttributes(stanza: Element, original_stanza: Elemen
  */
 export function getCorrectionAttributes(stanza: Element, original_stanza: Element): {
     replace_id: string;
-    edited: string;
+    edited: any;
 } | {
     replace_id?: undefined;
     edited?: undefined;
diff --git a/src/i18n/index.js b/src/i18n/index.js
@@ -23,21 +23,22 @@ function isConverseLocale(preferred_locale, supported_locales) {
 /**
  * Determines which locale is supported by the user's system as well
  * as by the relevant library (e.g. converse.js or dayjs).
- * @param {string} preferred_locale
- * @param {(locale: string) => boolean} isSupportedByLibrary - Returns a boolean indicating whether
- *   the locale is supported.
  * @returns {string}
  */
-function determineLocale(preferred_locale, isSupportedByLibrary) {
-    if (preferred_locale === 'en' || isSupportedByLibrary(preferred_locale)) {
+function determineLocale() {
+    const preferred_locale = api.settings.get('i18n');
+    const available_locales = api.settings.get('locales');
+    const isSupported = /** @param {string} pref */ (pref) => isConverseLocale(pref, available_locales);
+
+    if (preferred_locale === 'en' || isSupported(preferred_locale)) {
         return preferred_locale;
     }
 
     const { languages } = window.navigator;
 
     let locale;
     for (let i = 0; i < languages.length && !locale; i++) {
-        locale = isLocaleAvailable(languages[i].replace('-', '_'), isSupportedByLibrary);
+        locale = isLocaleAvailable(languages[i].replace('-', '_'), isSupported);
     }
     return locale || 'en';
 }
@@ -68,20 +69,23 @@ function getDayJSLocale(locale) {
 }
 
 /**
- * Fetch the translations for the given local at the given URL.
+ * Fetch the translations for the given locale at the given URL.
  * @returns {Jed}
  */
 async function fetchTranslations() {
-    const dayjs_locale = getDayJSLocale(locale);
-
     if (!isConverseLocale(locale, api.settings.get('locales')) || locale === 'en') {
         return;
     }
     const { default: data } = await import(
         /*webpackChunkName: "locales/[request]" */ `../i18n/locales/${locale}/LC_MESSAGES/converse.po`
     );
-    await import(/*webpackChunkName: "locales/dayjs/[request]" */ `dayjs/locale/${dayjs_locale}.js`);
-    dayjs.locale(determineLocale(dayjs_locale, (l) => dayjs.locale(l)));
+
+    const dayjs_locale = getDayJSLocale(locale);
+    const dayjs_locale_data = await import(
+        /*webpackChunkName: "locales/dayjs/[request]" */ `dayjs/locale/${dayjs_locale}.js`
+    );
+    dayjs.locale(dayjs_locale_data);
+
     return new Jed(data);
 }
 
@@ -107,10 +111,7 @@ function translate(str, args) {
 
 async function initialize() {
     try {
-        const preferred_locale = api.settings.get('i18n');
-        const available_locales = api.settings.get('locales');
-        const isSupportedByLibrary = /** @param {string} pref */ (pref) => isConverseLocale(pref, available_locales);
-        locale = determineLocale(preferred_locale, isSupportedByLibrary);
+        locale = determineLocale();
         jed_instance = await fetchTranslations();
     } catch (e) {
         log.fatal(e.message);
diff --git a/src/i18n/tests/i18n.js b/src/i18n/tests/i18n.js
@@ -15,64 +15,70 @@ describe('i18n', () => {
         it("returns the preferred locale if supported",
             mock.initConverse([], {
                 locales: ['en', 'es', 'fr'],
-                i18n: 'en'
+                i18n: 'es'
             }, async function (_converse) {
                 const { i18n } = _converse.env;
-                const locale = i18n.determineLocale('es', (l) => ['en', 'es', 'fr'].includes(l));
+                const locale = i18n.determineLocale();
                 expect(locale).toBe('es');
             })
         );
 
         it("supports regional dialects",
-            mock.initConverse([], {}, async function (_converse) {
+            mock.initConverse([], {
+                locales: ['en', 'pt_BR', 'pt'],
+                i18n: 'pt_BR'
+            }, async function (_converse) {
                 const { i18n } = _converse.env;
                 Object.defineProperty(navigator, 'languages', {
                     value: ['pt-BR'],
                     configurable: true,
                 });
-                const locale = i18n.determineLocale(undefined, (l) => ['pt_BR'].includes(l));
+                const locale = i18n.determineLocale();
                 expect(locale).toBe('pt_BR');
             })
         );
 
         it("falls back to the non-regional version",
-            mock.initConverse([], {}, async function (_converse) {
+            mock.initConverse([], {
+                locales: ['en', 'pt'],
+                i18n: 'pt_BR'
+            }, async function (_converse) {
                 const { i18n } = _converse.env;
                 Object.defineProperty(navigator, 'languages', {
                     value: ['pt-BR'],
                     configurable: true,
                 });
-                const locale = i18n.determineLocale(undefined, (l) => ['pt'].includes(l));
+                const locale = i18n.determineLocale();
                 expect(locale).toBe('pt');
             })
         );
 
         it("falls back to browser language if preferred not supported",
             mock.initConverse([], {
                 locales: ['en', 'es', 'fr'],
-                i18n: 'en'
+                i18n: 'de'
             }, async function (_converse) {
                 const { i18n } = _converse.env;
                 Object.defineProperty(navigator, 'languages', {
                     value: ['fr-FR', 'fr', 'en-US', 'en'],
                     configurable: true,
                 });
-                const locale = i18n.determineLocale('de', (l) => ['en', 'es', 'fr'].includes(l));
+                const locale = i18n.determineLocale();
                 expect(locale).toBe('fr');
             })
         );
 
         it("falls back to \"en\" if no supported locale found",
             mock.initConverse([], {
                 locales: ['en', 'es', 'fr'],
-                i18n: 'en'
+                i18n: 'ja'
             }, async function (_converse) {
                 const { i18n } = _converse.env;
                 Object.defineProperty(navigator, 'languages', {
                     value: ['de', 'it'],
                     configurable: true,
                 });
-                const locale = i18n.determineLocale('ja', (l) => ['en', 'es', 'fr'].includes(l));
+                const locale = i18n.determineLocale();
                 expect(locale).toBe('en');
             })
         );
diff --git a/src/plugins/chatview/tests/chatbox.js b/src/plugins/chatview/tests/chatbox.js
diff --git a/src/types/i18n/index.d.ts b/src/types/i18n/index.d.ts

Original file line number	Diff line number	Diff line change
`@@ -143,7 +143,7 @@ export default {`
`143`	`143`	`}`
`144`	`144`	`if (jids === undefined) {`
`145`	`145`	`const chats = await api.chatboxes.get();`
`146`		`- return chats.filter(c => (c.get('type') === PRIVATE_CHAT_TYPE));`
	`146`	`+ return chats?.filter(c => (c.get('type') === PRIVATE_CHAT_TYPE)) ?? [];`
`147`	`147`	`} else if (typeof jids === 'string') {`
`148`	`148`	`return _get(jids);`
`149`	`149`	`}`
Original file line number	Diff line number	Diff line change
`@@ -45,7 +45,7 @@ export default {`
`45`	`45`
`46`	`46`	`if (jids === undefined) {`
`47`	`47`	`const chats = await api.chatboxes.get();`
`48`		`- return chats.filter(c => (c.get('type') === HEADLINES_TYPE));`
	`48`	`+ return chats?.filter(c => (c.get('type') === HEADLINES_TYPE)) ?? [];`
`49`	`49`	`} else if (typeof jids === 'string') {`
`50`	`50`	`return _get(jids);`
`51`	`51`	`}`
Original file line number	Diff line number	Diff line change
`@@ -161,7 +161,7 @@ const rooms = {`
`161`	`161`	`}`
`162`	`162`	`if (jids === undefined) {`
`163`	`163`	`const chats = await chatboxes.get();`
`164`		`- return chats.filter((c) => c.get('type') === CHATROOMS_TYPE);`
	`164`	`+ return chats?.filter((c) => c.get('type') === CHATROOMS_TYPE) ?? [];`
`165`	`165`	`} else if (typeof jids === 'string') {`
`166`	`166`	`return _get(jids);`
`167`	`167`	`}`