[ACS-9119] Saved Search navbar title now gets translated (#4356)

* [ACS-9119] Fixed issue where Saved Search Nav Bar title was not getting updated on changing language

* [ACS-9119] Added unit test

* [ACS-9119] Added null safety check

* [ACS-9119] Addressed PR comments

* [ACS-9119] Fixed Unit test

projects/aca-content/src/lib/components/search/search-save/sidenav/save-search-sidenav.component.spec.ts

@@ -27,11 +27,14 @@ import { SaveSearchSidenavComponent } from './save-search-sidenav.component';
 import { SavedSearchesService } from '@alfresco/adf-content-services';
 import { AppTestingModule } from '../../../../testing/app-testing.module';
 import { of, ReplaySubject } from 'rxjs';
+import { TranslationService, UserPreferencesService, UserPreferenceValues } from '@alfresco/adf-core';
 
 describe('SaveSearchSidenavComponent', () => {
   let fixture: ComponentFixture<SaveSearchSidenavComponent>;
   let component: SaveSearchSidenavComponent;
   let savedSearchesService: SavedSearchesService;
+  let userPreferenceService: UserPreferencesService;
+  let translateService: TranslationService;
 
   beforeEach(() => {
     const mockService = {
@@ -52,6 +55,8 @@ describe('SaveSearchSidenavComponent', () => {
     fixture = TestBed.createComponent(SaveSearchSidenavComponent);
     component = fixture.componentInstance;
     savedSearchesService = TestBed.inject(SavedSearchesService);
+    userPreferenceService = TestBed.inject(UserPreferencesService);
+    translateService = TestBed.inject(TranslationService);
   });
 
   it('should set navbar object if no search is saved', async () => {
@@ -81,7 +86,7 @@ describe('SaveSearchSidenavComponent', () => {
     savedSearchesService.savedSearches$.next([{ name: '1', order: 0, encodedUrl: 'abc' }]);
     component.ngOnInit();
     fixture.detectChanges();
-    tick();
+    tick(100);
     expect(component.item.children[0]).toEqual({
       icon: '',
       title: '1',
@@ -91,4 +96,17 @@ describe('SaveSearchSidenavComponent', () => {
       id: 'search1'
     });
   }));
+
+  it('should translate sidenav title when language is changed', fakeAsync(() => {
+    fixture.detectChanges();
+    savedSearchesService.savedSearches$.next([{ name: '1', order: 0, encodedUrl: 'abc' }]);
+    tick(100);
+    spyOn(translateService, 'instant');
+    savedSearchesService.savedSearches$.next([]);
+    expect(translateService.instant).toHaveBeenCalledTimes(1);
+    userPreferenceService.set(UserPreferenceValues.Locale, 'ar');
+    fixture.detectChanges();
+    tick(100);
+    expect(translateService.instant).toHaveBeenCalledTimes(2);
+  }));
 });

projects/aca-content/src/lib/components/search/search-save/sidenav/save-search-sidenav.component.ts

@@ -24,11 +24,12 @@
 
 import { Component, DestroyRef, inject, OnInit, ViewEncapsulation } from '@angular/core';
 import { SavedSearch, SavedSearchesService } from '@alfresco/adf-content-services';
-import { CoreModule, TranslationService } from '@alfresco/adf-core';
+import { CoreModule, TranslationService, UserPreferencesService, UserPreferenceValues } from '@alfresco/adf-core';
 import { NavBarLinkRef } from '@alfresco/adf-extensions';
 import { ExpandMenuComponent } from '../../../sidenav/components/expand-menu.component';
 import { AppService } from '@alfresco/aca-shared';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { delay } from 'rxjs/operators';
 
 @Component({
   selector: 'aca-save-search-sidenav',
@@ -45,6 +46,9 @@ export class SaveSearchSidenavComponent implements OnInit {
 
   private readonly manageSearchesId = 'manage-saved-searches';
   private readonly destroyRef = inject(DestroyRef);
+  private readonly userPreferenceService = inject(UserPreferencesService);
+
+  private savedSearchCount = 0;
 
   ngOnInit() {
     this.savedSearchesService.init();
@@ -53,6 +57,15 @@ export class SaveSearchSidenavComponent implements OnInit {
       .pipe(takeUntilDestroyed(this.destroyRef))
       .subscribe((savedSearches) => {
         this.item = this.createNavBarLinkRef(savedSearches);
+        this.savedSearchCount = savedSearches.length;
+      });
+    this.userPreferenceService
+      .select(UserPreferenceValues.Locale)
+      .pipe(takeUntilDestroyed(this.destroyRef), delay(10))
+      .subscribe(() => {
+        if (this.item) {
+          this.item.title = this.translationService.instant('APP.BROWSE.SEARCH.SAVE_SEARCH.NAVBAR.TITLE', { number: this.savedSearchCount });
+        }
       });
   }