[ADF-2626] added preserved state functionality for sidenav component (#3278)

* [ADF-2626] added preserved state functionality for sidenav component

* [ADF-2626] changed logic for preserving the sidenav component state

* [ADF-2626] added missing curly brace }

* [ADF-2626] small changes on logic based on pr comments

* [ADF-2843] added tooltip for create folder and edit folder icons from Content Services

* Revert "[ADF-2843] added tooltip for create folder and edit folder icons from Content Services"

This reverts commit d5a7abb65b.

* [ADF-2626] changed casting

* [ADF-2626] updated documentation with event

* [ADF-2626] removed app-config pipe because it was not being used

demo-shell/src/app.config.json

@@ -492,5 +492,10 @@
     "adf-version-manager": {
       "allowComments": true,
       "allowDownload": true
+    },
+
+    "sideNav": {
+      "expandedSidenav": true,
+      "preserveState": true
     }
 }

demo-shell/src/app/components/app-layout/app-layout.component.html

@@ -1,4 +1,4 @@
-<adf-sidenav-layout [sidenavMin]="70" [sidenavMax]="220" [stepOver]="780" [hideSidenav]="false" [expandedSidenav]="false">
+<adf-sidenav-layout [sidenavMin]="70" [sidenavMax]="220" [stepOver]="780" [hideSidenav]="false"[expandedSidenav]= "expandedSidenav" (expanded)="setState($event)">
 
     <adf-sidenav-layout-header>
         <ng-template let-toggleMenu="toggleMenu">

demo-shell/src/app/components/app-layout/app-layout.component.ts

@@ -15,7 +15,8 @@
  * limitations under the License.
  */
 
-import { Component, ViewEncapsulation } from '@angular/core';
+import { Component, ViewEncapsulation, OnInit } from '@angular/core';
+import { UserPreferencesService, AppConfigService } from '@alfresco/adf-core';
 
 @Component({
     templateUrl: 'app-layout.component.html',
@@ -25,7 +26,8 @@ import { Component, ViewEncapsulation } from '@angular/core';
     },
     encapsulation: ViewEncapsulation.None
 })
-export class AppLayoutComponent {
+
+export class AppLayoutComponent implements OnInit {
 
     links: Array<any> = [
         { href: '/home', icon: 'home', title: 'APP_LAYOUT.HOME' },
@@ -48,6 +50,25 @@ export class AppLayoutComponent {
         { href: '/about', icon: 'info_outline', title: 'APP_LAYOUT.ABOUT' }
     ];
 
-    constructor() {
+    expandedSidenav = false;
+
+
+    ngOnInit() {
+        const expand = this.config.get<boolean>('sideNav.expandedSidenav');
+        const preserveState = this.config.get('sideNav.preserveState');
+
+        if (preserveState && expand)  {
+            this.expandedSidenav = (this.userpreference.get('expandedSidenav', expand.toString()) === 'true');
+        } else if (expand) {
+            this.expandedSidenav = expand;
+        }
+    }
+    constructor( private userpreference: UserPreferencesService, private config: AppConfigService) {
+    }
+
+    setState(state) {
+        if (this.config.get('sideNav.preserveState')) {
+            this.userpreference.set('expandedSidenav', state);
+        }
     }
 }