Modified the paths

projects/aca-about/src/lib/about.component.ts

@@ -30,7 +30,7 @@ import { AppExtensionService, ExtensionRef } from '@alfresco/adf-extensions';
 import { AuthenticationService, RepositoryInfo } from '@alfresco/adf-core';
 import { DiscoveryApiService } from '@alfresco/adf-content-services';
 import { PACKAGE_JSON } from './package-json.token';
-import { ContentServiceExtensionService } from '../../../aca-content/src/lib/services/content-service-extension.service';
+import { AppService } from '@alfresco/aca-shared';
 
 @Component({
   selector: 'app-about-page',
@@ -52,7 +52,7 @@ export class AboutComponent implements OnInit {
     private authService: AuthenticationService,
     private appExtensions: AppExtensionService,
     private discovery: DiscoveryApiService,
-    private contentServices: ContentServiceExtensionService
+    private appServices: AppService
   ) {
     this.dev = !devMode;
     this.extensions$ = this.appExtensions.references$;
@@ -62,7 +62,7 @@ export class AboutComponent implements OnInit {
     if (this.authService.isEcmLoggedIn()) {
       this.setECMInfo();
     }
-    this.contentServices.cast.subscribe((data) => (this.hideSidenav = data));
+    this.appServices.cast.subscribe((data) => (this.hideSidenav = data));
   }
 
   setECMInfo() {

projects/aca-content/assets/svg/icons/avatar.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="12" cy="12" r="12" fill="#96DAEA"/>
+<path d="M9.7745 16H7.79723L10.81 7.27273H13.1879L16.1964 16H14.2191L12.033 9.26705H11.9648L9.7745 16ZM9.65092 12.5696H14.3214V14.0099H9.65092V12.5696Z" fill="#212121"/>
+</svg>

projects/aca-content/assets/svg/icons/menu.svg

@@ -0,0 +1,11 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="16" cy="16" r="16" fill="#212121" fill-opacity="0.12"/>
+<g clip-path="url(#clip0_1418_136226)">
+<path d="M13.1399 21H10.8331L14.348 10.8182H17.1222L20.6321 21H18.3253L15.7749 13.1449H15.6953L13.1399 21ZM12.9957 16.9979H18.4446V18.6783H12.9957V16.9979Z" fill="#212121"/>
+</g>
+<defs>
+<clipPath id="clip0_1418_136226">
+<rect width="11" height="32" fill="white" transform="translate(10.5)"/>
+</clipPath>
+</defs>
+</svg>

projects/aca-content/assets/svg/icons/settings.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M19.5023 12C19.5023 12.34 19.4723 12.66 19.4323 12.98L21.5423 14.63C21.7323 14.78 21.7823 15.05 21.6623 15.27L19.6623 18.73C19.5723 18.89 19.4023 18.98 19.2323 18.98C19.1723 18.98 19.1123 18.97 19.0523 18.95L16.5623 17.95C16.0423 18.34 15.4823 18.68 14.8723 18.93L14.4923 21.58C14.4623 21.82 14.2523 22 14.0023 22H10.0023C9.75228 22 9.54228 21.82 9.51228 21.58L9.13228 18.93C8.52228 18.68 7.96228 18.35 7.44228 17.95L4.95228 18.95C4.90228 18.97 4.84228 18.98 4.78228 18.98C4.60228 18.98 4.43228 18.89 4.34228 18.73L2.34228 15.27C2.22228 15.05 2.27228 14.78 2.46228 14.63L4.57228 12.98C4.53228 12.66 4.50228 12.33 4.50228 12C4.50228 11.67 4.53228 11.34 4.57228 11.02L2.46228 9.37C2.27228 9.22 2.21228 8.95 2.34228 8.73L4.34228 5.27C4.43228 5.11 4.60228 5.02 4.77228 5.02C4.83228 5.02 4.89228 5.03 4.95228 5.05L7.44228 6.05C7.96228 5.66 8.52228 5.32 9.13228 5.07L9.51228 2.42C9.54228 2.18 9.75228 2 10.0023 2H14.0023C14.2523 2 14.4623 2.18 14.4923 2.42L14.8723 5.07C15.4823 5.32 16.0423 5.65 16.5623 6.05L19.0523 5.05C19.1023 5.03 19.1623 5.02 19.2223 5.02C19.4023 5.02 19.5723 5.11 19.6623 5.27L21.6623 8.73C21.7823 8.95 21.7323 9.22 21.5423 9.37L19.4323 11.02C19.4723 11.34 19.5023 11.66 19.5023 12ZM17.5023 12C17.5023 11.79 17.4923 11.58 17.4523 11.27L17.3123 10.14L18.2023 9.44L19.2723 8.59L18.5723 7.38L17.3023 7.89L16.2423 8.32L15.3323 7.62C14.9323 7.32 14.5323 7.09 14.1023 6.91L13.0423 6.48L12.8823 5.35L12.6923 4H11.3023L11.1023 5.35L10.9423 6.48L9.88228 6.91C9.47228 7.08 9.06228 7.32 8.63228 7.64L7.73228 8.32L6.69228 7.9L5.42228 7.39L4.72228 8.6L5.80228 9.44L6.69228 10.14L6.55228 11.27C6.52228 11.57 6.50228 11.8 6.50228 12C6.50228 12.2 6.52228 12.43 6.55228 12.74L6.69228 13.87L5.80228 14.57L4.72228 15.41L5.42228 16.62L6.69228 16.11L7.75228 15.68L8.66228 16.38C9.06228 16.68 9.46228 16.91 9.89228 17.09L10.9523 17.52L11.1123 18.65L11.3023 20H12.7023L12.9023 18.65L13.0623 17.52L14.1223 17.09C14.5323 16.92 14.9423 16.68 15.3723 16.36L16.2723 15.68L17.3123 16.1L18.5823 16.61L19.2823 15.4L18.2023 14.56L17.3123 13.86L17.4523 12.73C17.4823 12.43 17.5023 12.21 17.5023 12ZM12.0023 8C9.79228 8 8.00228 9.79 8.00228 12C8.00228 14.21 9.79228 16 12.0023 16C14.2123 16 16.0023 14.21 16.0023 12C16.0023 9.79 14.2123 8 12.0023 8ZM10.0023 12C10.0023 13.1 10.9023 14 12.0023 14C13.1023 14 14.0023 13.1 14.0023 12C14.0023 10.9 13.1023 10 12.0023 10C10.9023 10 10.0023 10.9 10.0023 12Z" fill="#212328" fill-opacity="0.6"/>
+</svg>

projects/aca-content/assets/svg/icons/workspace.svg

@@ -0,0 +1,4 @@
+<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M18 9C18 4.02944 13.9706 0 9 0C4.02944 0 0 4.02944 0 9C0 13.9706 4.02944 18 9 18H18V9Z" fill="#2A7DE2"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M17.9984 16.6856V9.05664C17.9984 5.06228 15.3963 1.67568 11.7948 0.499512C9.56758 3.98205 9.97569 8.66281 13.0191 11.7062L17.9984 16.6856Z" fill="#0055B9"/>
+</svg>

projects/aca-content/src/lib/components/sidenav/sidenav.component.ts

@@ -29,8 +29,7 @@ import { Store } from '@ngrx/store';
 import { AppStore, getSideNavState } from '@alfresco/aca-shared/store';
 import { Subject } from 'rxjs';
 import { takeUntil, distinctUntilChanged, debounceTime } from 'rxjs/operators';
-import { AppExtensionService } from '@alfresco/aca-shared';
+import { AppExtensionService, AppService } from '@alfresco/aca-shared';
-import { ContentServiceExtensionService } from '../../services/content-service-extension.service';
 
 @Component({
   selector: 'app-sidenav',
@@ -47,7 +46,7 @@ export class SidenavComponent implements OnInit, OnDestroy {
   groups: Array<NavBarGroupRef> = [];
   private onDestroy$ = new Subject<boolean>();
 
-  constructor(private store: Store<AppStore>, private extensions: AppExtensionService, private contentServices: ContentServiceExtensionService) {}
+  constructor(private store: Store<AppStore>, private extensions: AppExtensionService, private appServices: AppService) {}
 
   ngOnInit() {
     this.store
@@ -56,7 +55,7 @@ export class SidenavComponent implements OnInit, OnDestroy {
       .subscribe(() => {
         this.groups = this.extensions.getApplicationNavigation(this.extensions.navbar);
       });
-      this.contentServices.cast.subscribe((data) => (this.hideSidenav = data));
+      this.appServices.cast.subscribe((data) => (this.hideSidenav = data));
   }
 
   trackByGroupId(_: number, obj: NavBarGroupRef): string {
@@ -69,7 +68,7 @@ export class SidenavComponent implements OnInit, OnDestroy {
 
   toggleClick() {
     this.hideSidenav = !this.hideSidenav;
-    this.contentServices.push(this.hideSidenav);
+    this.appServices.getSidenavValue(this.hideSidenav);
   }
 
   ngOnDestroy() {

projects/aca-content/src/lib/components/view-profile/view-profile.component.ts

@@ -11,7 +11,7 @@ import { Component, OnInit, ViewEncapsulation } from '@angular/core';
 import { FormControl, FormGroup, Validators } from '@angular/forms';
 import { Router } from '@angular/router';
 import { throwError } from 'rxjs';
-import { ContentServiceExtensionService } from '../../services/content-service-extension.service';
+import { AppService } from '@alfresco/aca-shared';
 
 @Component({
   selector: 'app-view-profile',
@@ -36,7 +36,7 @@ export class ViewProfileComponent implements OnInit {
   contactSectionButtonsToggle = true;
   hideSidenav: boolean;
 
-  constructor(private router: Router, apiService: AlfrescoApiService, private contentServices: ContentServiceExtensionService) {
+  constructor(private router: Router, apiService: AlfrescoApiService, private appService: AppService) {
     this.peopleApi = new PeopleApi(apiService.getInstance());
   }
 
@@ -51,7 +51,7 @@ export class ViewProfileComponent implements OnInit {
       .catch((error) => {
         throwError(error);
       });
-      this.contentServices.cast.subscribe((data) => (this.hideSidenav = data));
+      this.appService.cast.subscribe((data) => (this.hideSidenav = data));
   }
 
   populateForm(userInfo: Person) {

projects/aca-content/src/lib/services/content-service-extension.service.ts

@@ -9,23 +9,16 @@
 import { Injectable } from '@angular/core';
 import { AppConfigService } from '@alfresco/adf-core';
 import { take } from 'rxjs/operators';
-import { BehaviorSubject } from 'rxjs';
 
 @Injectable({
   providedIn: 'root'
 })
 export class ContentServiceExtensionService {
-  public hideSidenav = new BehaviorSubject<boolean>(false);
-  cast = this.hideSidenav.asObservable();
 
   constructor(private appConfigService: AppConfigService) {
     this.updateContentServiceAvailability();
   }
 
-  push(str: boolean) {
-    this.hideSidenav.next(str);
-  }
-
   updateContentServiceAvailability() {
     this.appConfigService.onLoad.pipe(take(1)).subscribe((config) => {
       if (config.plugins && config.plugins.contentService === false) {

projects/aca-shared/src/lib/components/page-layout/page-layout.component.scss

@@ -3,6 +3,15 @@
 .aca-page-layout {
   @include flex-column;
 
+  .aca-content-container {
+    display: flex;
+    flex-direction: column;
+    flex: 1;
+    height: 100%;
+    overflow: hidden;
+    min-height: 0;
+  }
+
   .aca-content-header {
     border-left: none;
     border-right: none;

projects/aca-shared/src/lib/components/page-layout/page-layout.component.ts

@@ -24,7 +24,7 @@
  */
 
 import { Component, ViewEncapsulation, ChangeDetectionStrategy, Input, ChangeDetectorRef } from '@angular/core';
-import { ContentServiceExtensionService } from '../../../../../aca-content/src/lib/services/content-service-extension.service';
+import { AppService } from '../../services/app.service';
 
 @Component({
   selector: 'aca-page-layout',
@@ -39,18 +39,18 @@ export class PageLayoutComponent {
   hasError = false;
   hideSidenav: boolean;
 
-  constructor(private contentServices: ContentServiceExtensionService, private ref: ChangeDetectorRef) {
+  constructor(private appService: AppService, private ref: ChangeDetectorRef) {
     setInterval(() => {
       this.ref.detectChanges();
     });
   }
 
   ngOnInit() {
-    this.contentServices.cast.subscribe((data) => (this.hideSidenav = data));
+    this.appService.cast.subscribe((data) => (this.hideSidenav = data));
   }
 
   toggleClick() {
     this.hideSidenav = !this.hideSidenav;
-    this.contentServices.push(this.hideSidenav);
+    this.appService.getSidenavValue(this.hideSidenav);
   }
 }

projects/aca-shared/src/lib/services/app.service.ts

@@ -25,7 +25,7 @@
 
 import { Inject, Injectable } from '@angular/core';
 import { AuthenticationService, AppConfigService, AlfrescoApiService, PageTitleService, UserPreferencesService } from '@alfresco/adf-core';
-import { Observable, BehaviorSubject } from 'rxjs';
+import { Observable, BehaviorSubject, Subject } from 'rxjs';
 import { GroupService, SearchQueryBuilderService, SharedLinksApiService, UploadService, FileUploadErrorEvent } from '@alfresco/adf-content-services';
 import { OverlayContainer } from '@angular/cdk/overlay';
 import { ActivatedRoute, ActivationEnd, NavigationStart, Router } from '@angular/router';
@@ -58,10 +58,14 @@ export class AppService {
   private ready: BehaviorSubject<boolean>;
   ready$: Observable<boolean>;
 
+  public hideSidenav = new BehaviorSubject<boolean>(false);
+  cast = this.hideSidenav.asObservable();
+
   pageHeading$: Observable<string>;
 
   hideSidenavConditions = ['/preview/'];
   minimizeSidenavConditions = ['search'];
+  onDestroy$ = new Subject<boolean>();
 
   /**
    * Whether `withCredentials` mode is enabled.
@@ -108,6 +112,11 @@ export class AppService {
     );
   }
 
+  ngOnDestroy(): void {
+    this.onDestroy$.next(true);
+    this.onDestroy$.complete();
+  }
+
   init(): void {
     this.alfrescoApiService.getInstance().on('error', (error: { status: number; response: any }) => {
       if (error.status === 401 && !this.alfrescoApiService.isExcludedErrorListener(error?.response?.req?.url)) {