diff --git a/src/app.config.json b/src/app.config.json
index 7fe0ce871..0fb00c0e6 100644
--- a/src/app.config.json
+++ b/src/app.config.json
@@ -19,6 +19,10 @@
"allowDownload": true,
"allowDelete": true
},
+ "sideNav" : {
+ "preserveState" : true,
+ "expandedSidenav": true
+ },
"navigation": {
"main": [
{
diff --git a/src/app/components/layout/layout.component.html b/src/app/components/layout/layout.component.html
index 958362bc2..090d002c0 100644
--- a/src/app/components/layout/layout.component.html
+++ b/src/app/components/layout/layout.component.html
@@ -7,14 +7,13 @@
[sidenavMin]="70"
[sidenavMax]="320"
[stepOver]="600"
- [hideSidenav]="isPreview"
- [expandedSidenav]="true">
+ [hideSidenav]="hideSidenav"
+ [expandedSidenav]="expandedSidenav"
+ (expanded)="setState($event)">
-
-
-
+
diff --git a/src/app/components/layout/layout.component.spec.ts b/src/app/components/layout/layout.component.spec.ts
index 166179c45..0424abf35 100644
--- a/src/app/components/layout/layout.component.spec.ts
+++ b/src/app/components/layout/layout.component.spec.ts
@@ -45,6 +45,8 @@ describe('LayoutComponent', () => {
let fixture: ComponentFixture;
let component: LayoutComponent;
let browsingFilesService: BrowsingFilesService;
+ let appConfig: AppConfigService;
+ let userPreference: UserPreferencesService;
const navItem = {
label: 'some-label',
route: {
@@ -86,18 +88,114 @@ describe('LayoutComponent', () => {
fixture = TestBed.createComponent(LayoutComponent);
component = fixture.componentInstance;
browsingFilesService = TestBed.get(BrowsingFilesService);
-
- const appConfig = TestBed.get(AppConfigService);
- spyOn(appConfig, 'get').and.returnValue([navItem]);
-
- fixture.detectChanges();
+ appConfig = TestBed.get(AppConfigService);
+ userPreference = TestBed.get(UserPreferencesService);
});
it('sets current node', () => {
+ appConfig.config = {
+ navigation: [navItem]
+ };
+
const currentNode = { id: 'someId' };
+ fixture.detectChanges();
+
browsingFilesService.onChangeParent.next(currentNode);
expect(component.node).toEqual(currentNode);
});
+
+ describe('sidenav state', () => {
+ it('should get state from configuration', () => {
+ appConfig.config = {
+ sideNav: {
+ expandedSidenav: false,
+ preserveState: false
+ }
+ };
+
+ fixture.detectChanges();
+
+ expect(component.expandedSidenav).toBe(false);
+ });
+
+ it('should resolve state to true is no configuration', () => {
+ appConfig.config = {};
+
+ fixture.detectChanges();
+
+ expect(component.expandedSidenav).toBe(true);
+ });
+
+ it('should get state from user settings as true', () => {
+ appConfig.config = {
+ sideNav: {
+ expandedSidenav: false,
+ preserveState: true
+ }
+ };
+
+ spyOn(userPreference, 'get').and.callFake(key => {
+ if (key === 'expandedSidenav') {
+ return 'true';
+ }
+ });
+
+ fixture.detectChanges();
+
+ expect(component.expandedSidenav).toBe(true);
+ });
+
+ it('should get state from user settings as false', () => {
+ appConfig.config = {
+ sideNav: {
+ expandedSidenav: false,
+ preserveState: true
+ }
+ };
+
+ spyOn(userPreference, 'get').and.callFake(key => {
+ if (key === 'expandedSidenav') {
+ return 'false';
+ }
+ });
+
+ fixture.detectChanges();
+
+ expect(component.expandedSidenav).toBe(false);
+ });
+
+ it('should set expandedSidenav to true if configuration is true', () => {
+ spyOn(userPreference, 'set');
+
+ appConfig.config = {
+ sideNav: {
+ expandedSidenav: false,
+ preserveState: true
+ }
+ };
+
+ fixture.detectChanges();
+ component.setState(true);
+
+ expect(userPreference.set).toHaveBeenCalledWith( 'expandedSidenav', true);
+ });
+
+ it('should set expandedSidenav to false if configuration is true', () => {
+ spyOn(userPreference, 'set');
+
+ appConfig.config = {
+ sideNav: {
+ expandedSidenav: false,
+ preserveState: true
+ }
+ };
+
+ fixture.detectChanges();
+ component.setState(false);
+
+ expect(userPreference.set).toHaveBeenCalledWith( 'expandedSidenav', false);
+ });
+ });
});
diff --git a/src/app/components/layout/layout.component.ts b/src/app/components/layout/layout.component.ts
index 07f3fa06e..1800a8ddc 100644
--- a/src/app/components/layout/layout.component.ts
+++ b/src/app/components/layout/layout.component.ts
@@ -27,6 +27,7 @@ import { Component, OnInit, OnDestroy } from '@angular/core';
import { Router, NavigationEnd } from '@angular/router';
import { Subscription } from 'rxjs/Rx';
import { MinimalNodeEntryEntity } from 'alfresco-js-api';
+import { UserPreferencesService, AppConfigService } from '@alfresco/adf-core';
import { BrowsingFilesService } from '../../common/services/browsing-files.service';
import { NodePermissionService } from '../../common/services/node-permission.service';
@@ -37,22 +38,27 @@ import { NodePermissionService } from '../../common/services/node-permission.ser
})
export class LayoutComponent implements OnInit, OnDestroy {
node: MinimalNodeEntryEntity;
- isPreview = false;
-
+ hideSidenav: boolean;
+ expandedSidenav: boolean;
+ private hideConditions: string[] = ['preview'];
private subscriptions: Subscription[] = [];
constructor(
private router: Router,
private browsingFilesService: BrowsingFilesService,
+ private userPreferenceService: UserPreferencesService,
+ private appConfigService: AppConfigService,
public permission: NodePermissionService) {
this.router.events
.filter(event => event instanceof NavigationEnd)
.subscribe( (event: any ) => {
- this.isPreview = event.urlAfterRedirects.includes('preview');
+ this.hideSidenav = this.hideConditions.some(el => event.urlAfterRedirects.includes(el));
});
}
ngOnInit() {
+ this.expandedSidenav = this.sidenavState;
+
this.subscriptions.concat([
this.browsingFilesService.onChangeParent.subscribe((node: MinimalNodeEntryEntity) => this.node = node)
]);
@@ -61,4 +67,21 @@ export class LayoutComponent implements OnInit, OnDestroy {
ngOnDestroy() {
this.subscriptions.forEach(s => s.unsubscribe());
}
+
+ get sidenavState(): boolean {
+ const expand = this.appConfigService.get('sideNav.expandedSidenav', true);
+ const preserveState = this.appConfigService.get('sideNav.preserveState', true);
+
+ if (preserveState) {
+ return (this.userPreferenceService.get('expandedSidenav', expand.toString()) === 'true');
+ }
+
+ return expand;
+ }
+
+ setState(state) {
+ if (this.appConfigService.get('sideNav.preserveState')) {
+ this.userPreferenceService.set('expandedSidenav', state);
+ }
+ }
}