Skip to content

Commit

Permalink
menu: refactoring switch library
Browse files Browse the repository at this point in the history 
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 of user has required right.
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#822

Co-Authored-by: Renaud Michotte <renaud.michotte@gmail.com>
  • Loading branch information
@zannkukai
zannkukai committed Jun 16, 2020
1 parent 59a4702 commit 44a46a3
Show file tree
Hide file tree
Showing 4 changed files with 68 additions and 92 deletions.
5 changes: 0 additions & 5 deletions projects/admin/src/app/app.component.ts
View file
Expand Up @@ -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
);
})
);
}
Expand Down
1 change: 0 additions & 1 deletion projects/admin/src/app/menu/menu.component.spec.ts
View file
Expand Up @@ -33,7 +33,6 @@ describe('MenuComponent', () => {

const libraryTestingSwitchService = jasmine.createSpyObj(
'LibrarySwitchService', ['generateMenu']);
libraryTestingSwitchService.onVisibleMenu$ = of(false);
libraryTestingSwitchService.entries = [{ entries: [] }];
libraryTestingSwitchService.onGenerate$ = of([]);

Expand Down
13 changes: 3 additions & 10 deletions projects/admin/src/app/menu/menu.component.ts
View file
Expand Up @@ -58,7 +58,6 @@ export class MenuComponent implements OnInit {
userMenu = {
navCssClass: 'navbar-nav',
dropdownMenuCssClass: 'dropdown-menu-right',
iconCssClass: 'fa fa-user',
entries: []
};

Expand Down Expand Up @@ -86,6 +85,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'),
Expand Down Expand Up @@ -117,15 +117,8 @@ 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();
}
});

// SWITCH LIBRARY MENU ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
this._librarySwitchService.generateMenu();
this._librarySwitchService.onGenerate$.subscribe((entries: any) => {
this.librariesSwitchMenu.entries[0].entries = entries;
});
Expand Down
141 changes: 65 additions & 76 deletions projects/admin/src/app/service/library-switch.service.ts
View file
Expand Up @@ -32,11 +32,6 @@ export class LibrarySwitchService {
*/
private onGenerateMenu: Subject<Array<any>> = new Subject();

/**
* On Visible Menu
*/
private onVisibleMenu: Subject<boolean> = new Subject();

/**
* Entries for library switch menu
*/
Expand All @@ -47,25 +42,13 @@ export class LibrarySwitchService {
*/
private currentLibraryRecord: any;

/**
* Visibility of the menu
*/
private menuVisible = false;

/**
* Return on generate menu observable
*/
get onGenerate$() {
return this.onGenerateMenu.asObservable();
}

/**
* Return on visible menu observable
*/
get onVisibleMenu$() {
return this.onVisibleMenu.asObservable();
}

/**
* Return library entries menu
*/
Expand All @@ -88,119 +71,125 @@ export class LibrarySwitchService {
}

/**
* Return the visibility of menu
* Return the visibility of menu.
* The "switch library" menu should only be visible for system_librarian
* and if the organisation of the current logged user has, at least, two
* related libraries.
* @return True if menu could be visible, false otherwise
*/
get visible() {
if (!this.userService.hasRole('system_librarian')) {
return false;
}
return this.menuVisible;
get visible(): boolean {
return this._userService.hasRole('system_librarian');
}

/**
* Constructor
* @param recordService - RecordService
* @param userService - UserService
* @param localStorageService - LocalStorageService
* @param _recordService - RecordService
* @param _userService - UserService
* @param _localStorageService - LocalStorageService
* @param _libraryService - LibraryService
*/
constructor(
private recordService: RecordService,
private userService: UserService,
private localStorageService: LocalStorageService,
private libraryService: LibraryService
private _recordService: RecordService,
private _userService: UserService,
private _localStorageService: LocalStorageService,
private _libraryService: LibraryService
) {
this.initObservables();
}

/**
* Visibility of the menu
* @return void
*/
show(visible: boolean) {
this.menuVisible = visible;
this.onVisibleMenu.next(visible);
}

/**
* Generate entries menu
* @return void
*/
generateMenu() {
if (this.visible) {
this.libraryService.allOrderBy$('name').pipe(
map(results => results.hits.hits.filter((data: any) =>
data.metadata.pid !== this.userService.getCurrentUser().getCurrentLibrary()
))
).subscribe(libraries => {
this.menuEntries = [];
libraries.map((library: any) => this.menuEntries.push({
name: library.metadata.name,
id: library.metadata.pid
}));
this.onGenerateMenu.next(this.menuEntries);
});
}
* Get all libraries of the current logged user. Each library will be
* an entry of the switch library menu. The current used library should
* be disabled in this menu.
* Finally, When the menu is generated emit the 'generateMenu' event
*/
generateMenu(): void {
this._libraryService.allOrderBy$('name').pipe(
map(results => (results.hits.total > 0) ? results.hits.hits : [])
).subscribe(libraries => {
this.menuEntries = [];
libraries.forEach((library: any) => this.menuEntries.push({
name: library.metadata.name,
id: library.metadata.pid,
active: this.currentLibraryRecord.pid === library.metadata.pid
}));
this.onGenerateMenu.next(this.menuEntries);
});
}

/**
* Load current library record
* @param libraryPid - string
*/
loadCurrentLibrary(libraryPid: string) {
this.libraryService.get$(libraryPid).subscribe((library: any) => {
private _loadCurrentLibrary(libraryPid: string) {
this._libraryService.get$(libraryPid).subscribe((library: any) => {
this.currentLibraryRecord = library.metadata;
});
}

/**
* Switch library
* @param libraryPid - string
* @param libraryPid: the library pid that user would used
*/
switch(libraryPid: string) {
switch(libraryPid: string): void {
const key = User.STORAGE_KEY;
const data = this.localStorageService.get(key);
const data = this._localStorageService.get(key);
data.currentLibrary = libraryPid;
this.localStorageService.set(key, data);
this.loadCurrentLibrary(libraryPid);
this.generateMenu();
this._localStorageService.set(key, data);
// NOTE : As we are listening changed on localStorage, we don't need to modify
// menu to set the newly choose library as active, it will be done by
// the `generateMenu` called by this event handler.
this._loadCurrentLibrary(libraryPid);
}

/**
* Initialize Observables
* @return void
* When any CRUD event is detected on a library the library switch menu should be refreshed
* When local storage 'user' changed, maybe we need to switch to an other current library
*/
private initObservables() {
this.recordService.onCreate$.subscribe((event: RecordEvent) => {
private initObservables(): void {
// when a library resource is created
// --> if a new library is created, then regenerate the menuEntries
this._recordService.onCreate$.subscribe((event: RecordEvent) => {
if (event.resource === 'libraries') {
this.generateMenu();
}
});
this.recordService.onUpdate$.subscribe((event: RecordEvent) => {
// when a library resource is updated
// --> if the library updated is the library currently used, reload the currentLibrary to have refreshed data
// --> regenerate the menuEntries
this._recordService.onUpdate$.subscribe((event: RecordEvent) => {
if (event.resource === 'libraries') {
const libraryPid = event.data.record.pid;
if (this.userService.getCurrentUser().getCurrentLibrary() === libraryPid) {
this.loadCurrentLibrary(libraryPid);
if (this._userService.getCurrentUser().getCurrentLibrary() === libraryPid) {
this._loadCurrentLibrary(libraryPid);
}
this.generateMenu();
}
});
this.recordService.onDelete$.subscribe((event: RecordEvent) => {
// when a library resource is delete
// --> if the deleted library is the same than current library, then switch to the library defined into user account
// --> regenerate the menuEntries
this._recordService.onDelete$.subscribe((event: RecordEvent) => {
if (event.resource === 'libraries') {
const libraryPid = event.data.pid;
if (this.userService.getCurrentUser().getCurrentLibrary() === libraryPid) {
const userLibrary = this.userService.getCurrentUser().library;
if (this._userService.getCurrentUser().getCurrentLibrary() === libraryPid) {
const userLibrary = this._userService.getCurrentUser().library;
this.switch(userLibrary.pid);
}
this.generateMenu();
}
});
this.localStorageService.onSet$.subscribe((event: any) => {
// when the local storage USER changed
// --> if local stored 'currentLibrary' <> current library then switch the library and regenerate the menuEntries
this._localStorageService.onSet$.subscribe((event: any) => {
if (event.key === User.STORAGE_KEY) {
const local = event.data.data;
const user = this.userService.getCurrentUser();
const user = this._userService.getCurrentUser();
if (user.getCurrentLibrary() !== local.currentLibrary) {
user.setCurrentLibrary(local.currentLibrary);
this.loadCurrentLibrary(local.currentLibrary);
this._loadCurrentLibrary(local.currentLibrary);
this.generateMenu();
}
}
Expand Down

0 comments on commit 44a46a3

Please sign in to comment.