Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[ACS-5932] - Sidenav not able to expand when search page is closed #3412

Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
[ACS-5932] - Sidenav not able to expand when search page is closed
dominikiwanekhyland committed Sep 5, 2023
commit e17a0a932d1789dea8819e6e132a2cc5f271b9e3
Original file line number Diff line number Diff line change
@@ -42,10 +42,12 @@ describe('SearchInputComponent', () => {
let searchInputService: SearchNavigationService;
const appServiceMock = {
appNavNarMode$: new BehaviorSubject('collapsed'),
setAppNavbarMode: jasmine.createSpy('setAppNavbarMode'),
toggleAppNavBar$: new Subject()
};

beforeEach(() => {
appServiceMock.setAppNavbarMode.calls.reset();
TestBed.configureTestingModule({
imports: [AppTestingModule, SearchInputComponent],
providers: [
@@ -70,10 +72,9 @@ describe('SearchInputComponent', () => {
});

it('should collapsed sidenav by default', () => {
spyOn(appServiceMock.appNavNarMode$, 'next');
component.ngOnInit();

expect(appServiceMock.appNavNarMode$.next).toHaveBeenCalledWith('collapsed');
expect(appServiceMock.setAppNavbarMode).toHaveBeenCalledWith('collapsed');
});

it('should change flag on library400Error event', async () => {
@@ -244,9 +245,8 @@ describe('SearchInputComponent', () => {
});

it('should sidenav expanded after the component is destroy', () => {
spyOn(appServiceMock.appNavNarMode$, 'next');
component.ngOnDestroy();

expect(appServiceMock.appNavNarMode$.next).toHaveBeenCalledWith('expanded');
expect(appServiceMock.setAppNavbarMode).toHaveBeenCalledWith('expanded');
});
});
Original file line number Diff line number Diff line change
@@ -139,7 +139,7 @@ export class SearchInputComponent implements OnInit, OnDestroy {
}

showInputValue() {
this.appService.appNavNarMode$.next('collapsed');
this.appService.setAppNavbarMode('collapsed');
this.has400LibraryError = false;
this.hasLibrariesConstraint = this.evaluateLibrariesConstraint();
this.searchedWord = this.getUrlSearchTerm();
@@ -150,7 +150,7 @@ export class SearchInputComponent implements OnInit, OnDestroy {
}

ngOnDestroy(): void {
this.appService.appNavNarMode$.next('expanded');
this.appService.setAppNavbarMode('expanded');
this.onDestroy$.next(true);
this.onDestroy$.complete();
this.removeContentFilters();
Original file line number Diff line number Diff line change
@@ -37,10 +37,12 @@ describe('SearchLibrariesResultsComponent', () => {
const emptyPage = { list: { pagination: { totalItems: 0 }, entries: [] } };
const appServiceMock = {
appNavNarMode$: new BehaviorSubject('collapsed'),
toggleAppNavBar$: new Subject()
toggleAppNavBar$: new Subject(),
setAppNavbarMode: jasmine.createSpy('setAppNavbarMode')
};

beforeEach(() => {
appServiceMock.setAppNavbarMode.calls.reset();
TestBed.configureTestingModule({
imports: [AppTestingModule, SearchLibrariesResultsComponent],
schemas: [NO_ERRORS_SCHEMA],
@@ -65,9 +67,8 @@ describe('SearchLibrariesResultsComponent', () => {
});

it('should collapsed sidenav by default', () => {
spyOn(appServiceMock.appNavNarMode$, 'next');
component.ngOnInit();

expect(appServiceMock.appNavNarMode$.next).toHaveBeenCalledWith('collapsed');
expect(appServiceMock.setAppNavbarMode).toHaveBeenCalledWith('collapsed');
});
});
Original file line number Diff line number Diff line change
@@ -92,7 +92,7 @@ export class SearchLibrariesResultsComponent extends PageComponent implements On
}

ngOnInit() {
this.appService.appNavNarMode$.next('collapsed');
this.appService.setAppNavbarMode('collapsed');
super.ngOnInit();

this.columns = this.extensions.documentListPresets.searchLibraries || [];
Original file line number Diff line number Diff line change
@@ -54,7 +54,8 @@ describe('SearchComponent', () => {
provide: AppService,
useValue: {
appNavNarMode$: new BehaviorSubject('expanded'),
toggleAppNavBar$: new Subject()
toggleAppNavBar$: new Subject(),
setAppNavbarMode: jasmine.createSpy('setAppNavbarMode')
}
},
{
Original file line number Diff line number Diff line change
@@ -44,7 +44,8 @@ describe('SidenavComponent', () => {
provide: AppService,
useValue: {
appNavNarMode$: new BehaviorSubject('expanded'),
toggleAppNavBar$: new Subject()
toggleAppNavBar$: new Subject(),
setAppNavbarMode: jasmine.createSpy('setAppNavbarMode')
}
},
SidenavLayoutComponent
Original file line number Diff line number Diff line change
@@ -64,7 +64,7 @@ export class SidenavComponent implements OnInit, OnDestroy {
this.groups = this.extensions.getApplicationNavigation(this.extensions.navbar);
});

this.appService.appNavNarMode$.next(this.data.mode);
this.appService.setAppNavbarMode(this.data.mode);
this.appService.toggleAppNavBar$.pipe(takeUntil(this.onDestroy$)).subscribe(() => this.toggleNavBar());
this.data.layout.expanded.pipe(takeUntil(this.onDestroy$)).subscribe(() => this.setNavBarMode());
}
@@ -82,7 +82,7 @@ export class SidenavComponent implements OnInit, OnDestroy {
}

private setNavBarMode() {
this.appService.appNavNarMode$.next(this.data.layout.isMenuMinimized || this.data.layout.isHeaderInside ? 'collapsed' : 'expanded');
this.appService.setAppNavbarMode(this.data.layout.isMenuMinimized || this.data.layout.isHeaderInside ? 'collapsed' : 'expanded');
}

private toggleNavBar() {
5 changes: 5 additions & 0 deletions projects/aca-shared/src/lib/services/app.service.ts
Original file line number Diff line number Diff line change
@@ -174,6 +174,11 @@ export class AppService implements OnDestroy {
this.overlayContainer.getContainerElement().setAttribute('role', 'region');
}

setAppNavbarMode(mode: 'expanded' | 'collapsed'): void {
this.appNavNarMode$.next(mode);
this.preferencesService.set('expandedSidenav', mode === 'expanded');
}

private loadRepositoryStatus() {
this.contentApi.getRepositoryInformation().subscribe((response: DiscoveryEntry) => {
if (response?.entry?.repository) {