From 1d07d6e173362bea4bf360ca611a02f636da000b Mon Sep 17 00:00:00 2001 From: mehmet-erim Date: Sat, 3 Oct 2020 00:59:10 +0300 Subject: [PATCH] refactor: reduce locale chunk files count & imrove locale registering --- .../src/lib/services/localization.service.ts | 3 +- .../core/src/lib/utils/initial-utils.ts | 72 +++++++++++++++---- 2 files changed, 61 insertions(+), 14 deletions(-) diff --git a/npm/ng-packs/packages/core/src/lib/services/localization.service.ts b/npm/ng-packs/packages/core/src/lib/services/localization.service.ts index 5cdbe3c291..c6ebb3dd00 100644 --- a/npm/ng-packs/packages/core/src/lib/services/localization.service.ts +++ b/npm/ng-packs/packages/core/src/lib/services/localization.service.ts @@ -48,12 +48,11 @@ export class LocalizationService { registerLocale(locale: string) { const router = this.injector.get(Router); - const { cultureNameLocaleFileMap } = this.injector.get(CORE_OPTIONS); const { shouldReuseRoute } = router.routeReuseStrategy; router.routeReuseStrategy.shouldReuseRoute = () => false; router.navigated = false; - return registerLocale(locale, cultureNameLocaleFileMap).then(() => { + return registerLocale(locale, this.injector).then(() => { this.ngZone.run(async () => { await router.navigateByUrl(router.url).catch(noop); router.routeReuseStrategy.shouldReuseRoute = shouldReuseRoute; diff --git a/npm/ng-packs/packages/core/src/lib/utils/initial-utils.ts b/npm/ng-packs/packages/core/src/lib/utils/initial-utils.ts index cf35cc3023..76f01214c8 100644 --- a/npm/ng-packs/packages/core/src/lib/utils/initial-utils.ts +++ b/npm/ng-packs/packages/core/src/lib/utils/initial-utils.ts @@ -1,5 +1,5 @@ import { registerLocaleData } from '@angular/common'; -import { Injector } from '@angular/core'; +import { Injector, isDevMode } from '@angular/core'; import { Store } from '@ngxs/store'; import { OAuthService } from 'angular-oauth2-oidc'; import { tap } from 'rxjs/operators'; @@ -8,6 +8,7 @@ import { ABP } from '../models/common'; import { AuthService } from '../services/auth.service'; import { ConfigState } from '../states/config.state'; import { clearOAuthStorage } from '../strategies/auth-flow.strategy'; +import { LocaleErrorHandlerData, LOCALE_ERROR_HANDLER } from '../tokens/locale-error-handler.token'; import { CORE_OPTIONS } from '../tokens/options.token'; import { getRemoteEnv } from './environment-utils'; import { parseTenantFromUrl } from './multi-tenancy-utils'; @@ -42,26 +43,73 @@ export function checkAccessToken(store: Store, injector: Injector) { export function localeInitializer(injector: Injector) { const fn = () => { const store: Store = injector.get(Store); - const options = injector.get(CORE_OPTIONS); const lang = store.selectSnapshot(state => state.SessionState.language) || 'en'; return new Promise((resolve, reject) => { - registerLocale(lang, options.cultureNameLocaleFileMap).then( - () => resolve('resolved'), - reject, - ); + registerLocale(lang, injector).then(() => resolve('resolved'), reject); }); }; return fn; } -export function registerLocale(locale: string, localeNameMap: ABP.Dictionary) { - return import( - /* webpackChunkName: "_locale-[request]"*/ - `@angular/common/locales/${localeNameMap[locale] || locale}.js` - ).then(module => { - registerLocaleData(module.default); +export function registerLocale(locale: string, injector: Injector): Promise { + const { cultureNameLocaleFileMap } = injector.get(CORE_OPTIONS, {} as ABP.Root); + + const errorHandlerFn = injector.get(LOCALE_ERROR_HANDLER, defaultLocalErrorHandlerFn); + + return new Promise((resolve, reject) => { + return import( + /* webpackChunkName: "_locale-[request]"*/ + /* webpackInclude: /\/(ar|cs|en|fr|pt|ru|sl|zh-Hans|zh-Hant).js/ */ + /* webpackExclude: /\/global|\/extra/ */ + `@angular/common/locales/${cultureNameLocaleFileMap[locale] || locale}.js` + ) + .then(module => { + registerLocaleData(module.default, locale); + resolve(module.default); + }) + .catch(error => { + errorHandlerFn({ + resolve, + reject, + error, + injector, + locale, + storedLocales: { ...extraLocales }, + }); + }); }); } + +const extraLocales = {}; +export function storeLocaleData(data: any, localeId: string) { + extraLocales[localeId] = data; +} + +async function defaultLocalErrorHandlerFn({ + locale, + storedLocales, + resolve, + injector, +}: LocaleErrorHandlerData) { + if (storedLocales[locale]) { + registerLocaleData(storedLocales[locale], locale); + resolve(); + return; + } + + if (isDevMode) { + console.error(`Cannot find the ${locale} locale file. You should add the code below to app.module: + +import { storeLocaleData } from '@abp/ng.core'; +import( +/* webpackChunkName: "_locale-${locale}-js"*/ +/* webpackMode: "eager" */ +'@angular/common/locales/${locale}.js' +).then(m => storeLocaleData(m.default, '${locale}'));`); + } + + resolve(); +}