Merge pull request #24076 from abpframework/issue-22901

Add AsyncLocalizationPipe and deprecate LazyLocalizationPipe issue-22901

npm/ng-packs/packages/core/src/lib/core.module.ts

@@ -29,6 +29,7 @@ import { ABP } from './models/common';
 import './utils/date-extensions';
 import { provideAbpCoreChild, provideAbpCore, withOptions } from './providers';
 import {
+  AsyncLocalizationPipe,
   LazyLocalizationPipe,
   UtcToLocalPipe,
   SafeHtmlPipe,
@@ -60,6 +61,7 @@ const CORE_PIPES = [
   ShortDatePipe,
   ToInjectorPipe,
   UtcToLocalPipe,
+  AsyncLocalizationPipe,
   LazyLocalizationPipe,
 ];
 

npm/ng-packs/packages/core/src/lib/localization.module.ts

@@ -1,14 +1,14 @@
 import { NgModule } from '@angular/core';
 import { LocalizationPipe } from './pipes/localization.pipe';
-import { LazyLocalizationPipe } from './pipes';
+import { AsyncLocalizationPipe, LazyLocalizationPipe } from './pipes';
 
 /**
- * @deprecated Use `LocalizationPipe` and `LazyLocalizationPipe` directly as a standalone pipe.
+ * @deprecated Use `LocalizationPipe`, `AsyncLocalizationPipe` and `LazyLocalizationPipe` directly as a standalone pipe.
- * This module is no longer necessary for using the `LocalizationPipe` and `LazyLocalizationPipe` pipes.
+ * This module is no longer necessary for using the `LocalizationPipe`, `AsyncLocalizationPipe` and `LazyLocalizationPipe` pipes.
  */
 
 @NgModule({
-  exports: [LocalizationPipe, LazyLocalizationPipe],
+  exports: [LocalizationPipe, AsyncLocalizationPipe, LazyLocalizationPipe],
-  imports: [LocalizationPipe, LazyLocalizationPipe],
+  imports: [LocalizationPipe, AsyncLocalizationPipe, LazyLocalizationPipe],
 })
 export class LocalizationModule {}

npm/ng-packs/packages/core/src/lib/pipes/async-localization.pipe.ts

@@ -0,0 +1,41 @@
+import { inject, Injectable, Pipe, PipeTransform } from '@angular/core';
+import {
+  Observable,
+  of,
+  filter,
+  take,
+  switchMap,
+  map,
+  startWith,
+  distinctUntilChanged,
+} from 'rxjs';
+import { ConfigStateService, LocalizationService } from '../services';
+
+@Injectable()
+@Pipe({
+  name: 'abpAsyncLocalization',
+})
+export class AsyncLocalizationPipe implements PipeTransform {
+  private localizationService = inject(LocalizationService);
+  private configStateService = inject(ConfigStateService);
+
+  transform(key: string, ...params: (string | string[])[]): Observable<string> {
+    if (!key) {
+      return of('');
+    }
+
+    const flatParams = params.reduce<string[]>(
+      (acc, val) => (Array.isArray(val) ? acc.concat(val) : [...acc, val]),
+      [],
+    );
+
+    return this.configStateService.getAll$().pipe(
+      filter(config => !!config.localization),
+      take(1),
+      switchMap(() => this.localizationService.get(key, ...flatParams)),
+      map(translation => (translation && translation !== key ? translation : '')),
+      startWith(''),
+      distinctUntilChanged(),
+    );
+  }
+}

npm/ng-packs/packages/core/src/lib/pipes/index.ts

@@ -6,5 +6,6 @@ export * from './short-date.pipe';
 export * from './short-time.pipe';
 export * from './short-date-time.pipe';
 export * from './utc-to-local.pipe';
+export * from './async-localization.pipe';
 export * from './lazy-localization.pipe';
 export * from './html-encode.pipe';

npm/ng-packs/packages/core/src/lib/pipes/lazy-localization.pipe.ts

@@ -1,41 +1,12 @@
-import { inject, Injectable, Pipe, PipeTransform } from '@angular/core';
+import { Injectable, Pipe } from '@angular/core';
-import {
+import { AsyncLocalizationPipe } from './async-localization.pipe';
-  Observable,
-  of,
-  filter,
-  take,
-  switchMap,
-  map,
-  startWith,
-  distinctUntilChanged,
-} from 'rxjs';
-import { ConfigStateService, LocalizationService } from '../services';
 
+/**
+ * @deprecated Use `AsyncLocalizationPipe` instead. This pipe will be removed in a future version.
+ * LazyLocalizationPipe has been renamed to AsyncLocalizationPipe to better express its async nature.
+ */
 @Injectable()
 @Pipe({
   name: 'abpLazyLocalization',
 })
-export class LazyLocalizationPipe implements PipeTransform {
+export class LazyLocalizationPipe extends AsyncLocalizationPipe {}
-  private localizationService = inject(LocalizationService);
-  private configStateService = inject(ConfigStateService);
-
-  transform(key: string, ...params: (string | string[])[]): Observable<string> {
-    if (!key) {
-      return of('');
-    }
-
-    const flatParams = params.reduce<string[]>(
-      (acc, val) => (Array.isArray(val) ? acc.concat(val) : [...acc, val]),
-      [],
-    );
-
-    return this.configStateService.getAll$().pipe(
-      filter(config => !!config.localization),
-      take(1),
-      switchMap(() => this.localizationService.get(key, ...flatParams)),
-      map(translation => (translation && translation !== key ? translation : '')),
-      startWith(''),
-      distinctUntilChanged(),
-    );
-  }
-}