locale

app/scripts/comp/settings/settings-manager.ts

@@ -29,7 +29,6 @@ const DesktopLocaleKeys = [
 ];
 
 const SettingsManager = {
-    activeLocale: 'en-US',
     activeTheme: null as string | null,
 
     allLocales: {
@@ -170,18 +169,18 @@ const SettingsManager = {
     },
 
     setLocale(loc: string | undefined | null): void {
-        if (!loc || loc === this.activeLocale) {
+        if (!loc || loc === Locale.localeName) {
             return;
         }
-        let localeValues;
-        if (loc !== 'en-US') {
-            localeValues = this.customLocales.get(loc);
+        if (loc === 'en-US') {
+            Locale.set(undefined);
+        } else {
+            let localeValues = this.customLocales.get(loc);
             if (!localeValues) {
                 localeValues = require('locales/' + loc + '.json') as Record<string, string>;
             }
+            Locale.set(localeValues, loc);
         }
-        Locale.set(localeValues);
-        this.activeLocale = loc;
         Events.emit('locale-changed', loc);
 
         if (Launcher) {

app/scripts/models/menu/menu-item.ts

@@ -2,13 +2,13 @@ import { Model } from 'util/model';
 import { MenuOption } from './menu-option';
 import { Keys } from 'const/keys';
 import { AlertConfig } from 'comp/ui/alerts';
-import { Locale } from 'util/locale';
+import { LocaleKey } from 'util/locale';
 import { InitWithFieldsOf } from 'util/types';
 
 class MenuItem extends Model {
     id?: string;
     title?: string;
-    locTitle?: keyof typeof Locale;
+    locTitle?: LocaleKey;
     icon?: string;
     // customIcon?: null; // TODO(ts): custom icons
     active = false;

app/scripts/util/formatting/date-format.ts

@@ -1,9 +1,9 @@
-import { SettingsManager } from 'comp/settings/settings-manager';
+import { Locale } from 'util/locale';
 import { StringFormat } from 'util/formatting/string-format';
 
 const DateFormat = {
     months(): string[] {
-        const format = new Intl.DateTimeFormat(SettingsManager.activeLocale, { month: 'long' });
+        const format = new Intl.DateTimeFormat(Locale.localeName, { month: 'long' });
         const months = [];
         for (let month = 0; month < 12; month++) {
             months.push(format.format(new Date(2008, month)));
@@ -12,7 +12,7 @@ const DateFormat = {
     },
 
     weekDays(): string[] {
-        const format = new Intl.DateTimeFormat(SettingsManager.activeLocale, { weekday: 'long' });
+        const format = new Intl.DateTimeFormat(Locale.localeName, { weekday: 'long' });
         const weekdays = [];
         for (let day = 1; day < 8; day++) {
             weekdays.push(format.format(new Date(2007, 9, 6 + day)));
@@ -21,7 +21,7 @@ const DateFormat = {
     },
 
     shortWeekDays(): string[] {
-        const format = new Intl.DateTimeFormat(SettingsManager.activeLocale, { weekday: 'short' });
+        const format = new Intl.DateTimeFormat(Locale.localeName, { weekday: 'short' });
         const weekdays = [];
         for (let day = 1; day < 8; day++) {
             weekdays.push(format.format(new Date(2007, 9, 6 + day)));
@@ -34,7 +34,7 @@ const DateFormat = {
             dt = new Date(dt);
         }
         return dt
-            ? new Intl.DateTimeFormat(SettingsManager.activeLocale, {
+            ? new Intl.DateTimeFormat(Locale.localeName, {
                   dateStyle: 'medium',
                   timeStyle: 'medium'
               }).format(dt)
@@ -46,7 +46,7 @@ const DateFormat = {
             dt = new Date(dt);
         }
         return dt
-            ? new Intl.DateTimeFormat(SettingsManager.activeLocale, {
+            ? new Intl.DateTimeFormat(Locale.localeName, {
                   year: 'numeric',
                   month: 'short',
                   day: 'numeric'

app/scripts/util/locale.ts

@@ -1,17 +1,22 @@
-const baseLocale = require('locales/base.json') as Record<string, string>;
+const BaseLocale = require('locales/base.json') as Record<string, string>;
+const BaseLocaleName = 'en-US';
 
 interface LocWithReplace {
     with(value: string): string;
 }
 
 let activeLocale: Record<string, string> | undefined;
+let activeLocaleName = BaseLocaleName;
 
-function set(values: Record<string, string> | undefined): void {
+function set(values: Record<string, string>, localeName: string): void;
+function set(values: undefined): void;
+function set(values?: Record<string, string>, localeName?: string): void {
     activeLocale = values;
+    activeLocaleName = localeName ?? BaseLocaleName;
 }
 
 function get(name: string): string {
-    return activeLocale?.[name] ?? baseLocale[name] ?? '';
+    return activeLocale?.[name] ?? BaseLocale[name] ?? '';
 }
 
 function withReplace(name: string): LocWithReplace {
@@ -19,9 +24,10 @@ function withReplace(name: string): LocWithReplace {
 }
 
 // prettier-ignore
-const Locale = {
+export const Locale = {
     set,
     get,
+    get localeName(): string { return activeLocaleName; },
 
     // this code is generated using npm run generate-locale
     get retToApp(): string { return get('retToApp'); },
@@ -802,4 +808,4 @@ const Locale = {
     // end of generated code
 };
 
-export { Locale };
+export type LocaleKey = Exclude<keyof typeof Locale, 'set' | 'get' | 'localeName'>;

test/init.ts

@@ -16,6 +16,7 @@ const jsdom = new JSDOM('', { url: 'https://app.keeweb.info' }).window;
 
 global.crypto = new Crypto();
 global.localStorage = jsdom.localStorage;
+global.sessionStorage = jsdom.sessionStorage;
 global.navigator = jsdom.navigator;
 global.screen = jsdom.screen;
 global.location = jsdom.location;

test/util/formatting/date-format.spec.ts

@@ -1,5 +1,5 @@
 import { expect } from 'chai';
-import { DateFormat } from 'comp/i18n/date-format';
+import { DateFormat } from 'util/formatting/date-format';
 
 describe('DateFormat', () => {
     const dt = new Date(2020, 0, 2, 3, 4, 5, 6);

test/util/locale.spec.ts

@@ -16,11 +16,13 @@ describe('Locale', () => {
         expect(Locale.name).to.eql('name');
         expect(Locale.minutes.with('3')).to.eql('3 minutes');
 
-        Locale.set({ name: 'hello', minutes: '{}m' });
+        Locale.set({ name: 'hello', minutes: '{}m' }, 'xx');
+        expect(Locale.localeName).to.eql('xx');
         expect(Locale.name).to.eql('hello');
         expect(Locale.minutes.with('2')).to.eql('2m');
 
         Locale.set(undefined);
+        expect(Locale.localeName).to.eql('en-US');
         expect(Locale.name).to.eql('name');
         expect(Locale.minutes.with('4')).to.eql('4 minutes');
     });