menu: improve the switch library entry

The switch library was only displayed on the root page of the
professional interface. This commit change this behavior and now this
menu is displayed on all pages (if user has required rights).
However, the menu is disabled on all pages except on the homepage. This
implementation avoid problems if user should edit some resource link to
the current library.

This commit also removes the top panel containing the current library
name. The current library code is now used as label of the switch
library menu instead of "Switch library" string.

This commit also fix the dynamic population problem of the switch
library menu : When a new library was added, this library was not
dynamically added to the switch library menu. This commit fixes this
problem.

- Closes rero/rero-ils#821
- Closes rero/rero-ils#822

Co-Authored-by: Bertrand Zuchuat <bertrand.zuchuat@rero.ch>
Co-Authored-by: Renaud Michotte <renaud.michotte@gmail.com>

projects/admin/src/app/app.component.spec.ts

@@ -27,7 +27,6 @@ import { RecordModule } from '@rero/ng-core';
 import { HttpClientModule } from '@angular/common/http';
 import { TranslateModule } from '@ngx-translate/core';
 import { FormsModule } from '@angular/forms';
-import { InterfaceInfoComponent } from './interface-info/interface-info.component';
 
 describe('AppComponent', () => {
   beforeEach(async(() => {
@@ -45,8 +44,7 @@ describe('AppComponent', () => {
       ],
       declarations: [
         AppComponent,
-        MenuComponent,
-        InterfaceInfoComponent
+        MenuComponent
       ]
     }).compileComponents();
   }));

projects/admin/src/app/app.component.ts

@@ -142,11 +142,6 @@ export class AppComponent implements OnInit, OnDestroy {
             this.localStorageService.updateDate(User.STORAGE_KEY);
           }
         }
-
-        // Library Switch menu show only on homepage
-        this.librarySwitchService.show(
-          (event.url === '/') ? true : false
-        );
       })
     );
   }

projects/admin/src/app/app.module.ts

@@ -37,7 +37,6 @@ import { ErrorPageComponent } from './error/error-page/error-page.component';
 import { FrontpageBoardComponent } from './frontpage/frontpage-board/frontpage-board.component';
 import { FrontpageComponent } from './frontpage/frontpage.component';
 import { NoCacheHeaderInterceptor } from './interceptor/no-cache-header.interceptor';
-import { InterfaceInfoComponent } from './interface-info/interface-info.component';
 import { MenuComponent } from './menu/menu.component';
 import { BioInformationsPipe } from './pipe/bio-informations.pipe';
 import { BirthDatePipe } from './pipe/birth-date.pipe';
@@ -158,10 +157,8 @@ import { SharedPipesModule } from './shared/shared-pipes.module';
     ItemTransactionComponent,
     ItemTransactionsComponent,
     PatronDetailViewComponent,
-    InterfaceInfoComponent,
     RefComponent,
     RemoteAutocompleteInputTypeComponent,
-    InterfaceInfoComponent,
     VendorDetailViewComponent,
     VendorBriefViewComponent,
     AddressTypeComponent,

projects/admin/src/app/menu/menu.component.html

@@ -14,7 +14,6 @@
    You should have received a copy of the GNU Affero General Public License
    along with this program.  If not, see <http://www.gnu.org/licenses/>.
 -->
-<admin-interface-info></admin-interface-info>
 <nav class="navbar navbar-expand-lg navbar-dark bg-dark d-flex">
   <div class="container">
     <a [routerLink]="['/']" class="navbar-brand pr-2 text-sm">
@@ -39,11 +38,11 @@
 
     <div class="collapse navbar-collapse" id="navbarSupportedContent" [collapse]="isCollapsed" [isAnimated]="true">
       <ng-core-menu class="mr-auto" [menu]="linksMenu"></ng-core-menu>
-      <ng-core-menu
+      <!-- RIGHT MENU ENTRIES -->
+      <ng-core-menu *ngIf="isVisibleLibrarySwitchMenu"
         class="userMenu"
         [menu]="librariesSwitchMenu"
         (clickItem)="changeLibrary($event)"
-        *ngIf="isVisibleLibrarySwitchMenu && isVisible"
       ></ng-core-menu>
       <ng-core-menu [menu]="languagesMenu" (clickItem)="changeLang($event)"></ng-core-menu>
       <ng-core-menu [menu]="userMenu"></ng-core-menu>

projects/admin/src/app/menu/menu.component.spec.ts

@@ -33,9 +33,9 @@ describe('MenuComponent', () => {
 
   const libraryTestingSwitchService = jasmine.createSpyObj(
     'LibrarySwitchService', ['generateMenu']);
-  libraryTestingSwitchService.onVisibleMenu$ = of(false);
   libraryTestingSwitchService.entries = [{ entries: [] }];
   libraryTestingSwitchService.onGenerate$ = of([]);
+  libraryTestingSwitchService.currentLibraryRecord$ = of({code: 1});
 
   const userTestingService = jasmine.createSpyObj(
     'UserService', ['getCurrentUser', 'hasRole']

projects/admin/src/app/menu/menu.component.ts

@@ -46,8 +46,9 @@ export class MenuComponent implements OnInit {
 
   librariesSwitchMenu = {
     navCssClass: 'navbar-nav',
+    dropdownMenuCssClass: 'dropdown-menu-right',
     entries: [{
-      name: this._translateService.instant('Switch library'),
+      name: '',  // start with empty value, it will be changed when menu is generated
       iconCssClass: 'fa fa-random',
       entries: []
     }]
@@ -58,7 +59,6 @@ export class MenuComponent implements OnInit {
   userMenu = {
     navCssClass: 'navbar-nav',
     dropdownMenuCssClass: 'dropdown-menu-right',
-    iconCssClass: 'fa fa-user',
     entries: []
   };
 
@@ -72,7 +72,7 @@ export class MenuComponent implements OnInit {
     private _localeStorageService: LocalStorageService,
     private _menuService: MenuService,
     private _mainTitlePipe: MainTitlePipe
-  ) { }
+  ) {}
 
   ngOnInit() {
     this._initLinksMenu();
@@ -86,6 +86,7 @@ export class MenuComponent implements OnInit {
 
     this.userMenu.entries.push({
       name: `${currentUser.first_name[0]}${currentUser.last_name[0]}`,
+      iconCssClass: 'fa fa-user',
       entries: [
         {
           name: this._translateService.instant('Public interface'),
@@ -117,19 +118,10 @@ export class MenuComponent implements OnInit {
         this.userMenu.entries[0].entries[0].href = `/${organisation.metadata.code}/`;
       });
 
-    this._librarySwitchService.onVisibleMenu$.subscribe((visible) => {
-      if (
-        visible
-        && this._userService.hasRole('system_librarian')
-        && this._librarySwitchService.entries.length === 0) {
-        this._librarySwitchService.generateMenu();
-      }
-    });
-
-    this._librarySwitchService.onGenerate$.subscribe((entries: any) => {
-      this.librariesSwitchMenu.entries[0].entries = entries;
-    });
-
+    // SWITCH LIBRARY MENU ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+    this._librarySwitchService.generateMenu();
+    this._librarySwitchService.onGenerate$.subscribe((entries: any) => this.librariesSwitchMenu.entries[0].entries = entries);
+    this._librarySwitchService.currentLibraryRecord$.subscribe((library: any) => this.librariesSwitchMenu.entries[0].name = library.code);
   }
 
   /**
@@ -169,15 +161,12 @@ export class MenuComponent implements OnInit {
     this._librarySwitchService.switch(item.id);
   }
 
-  get isVisibleLibrarySwitchMenu() {
-    if (this._librarySwitchService.length <= 1) {
-      return false;
-    }
-    return this._librarySwitchService.visible;
-  }
-
-  get isVisible() {
-    return this._librarySwitchService.visible;
+  /** Is the library switch menu should be displayed.
+   *  To be displayed, the current logged used must be allowed and the menu must contains more than one entry
+   *  @return `true if the menu should be display, `false` otherwise
+   */
+  get isVisibleLibrarySwitchMenu(): boolean {
+    return this._librarySwitchService.visible && (this._librarySwitchService.length > 1);
   }
 
   /**

projects/admin/src/app/service/library-switch.service.spec.ts

@@ -14,15 +14,18 @@
  * You should have received a copy of the GNU Affero General Public License
  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
+import { HttpClientModule } from '@angular/common/http';
 import { TestBed } from '@angular/core/testing';
-
+import { RouterTestingModule } from '@angular/router/testing';
+import { TranslateModule } from '@ngx-translate/core';
 import { LibrarySwitchService } from './library-switch.service';
-import { HttpClientModule } from '@angular/common/http';
 
 describe('LibrarySwitchService', () => {
   beforeEach(() => TestBed.configureTestingModule({
     imports: [
-      HttpClientModule
+      HttpClientModule,
+      TranslateModule.forRoot(),
+      RouterTestingModule
     ]
   }));